/*
 * SalesOS look (the NivtrixOne family: PeopleOS, WorkOS, NiraOS). Loaded after nivtrix.css and nivtrix-theme.css on the
 * CRM pages only (not Health360). It only re-points the colour tokens and polishes the shell: no markup, no behaviour.
 * A company with its own brand colour still wins: its inline <style> (layout.html) comes after this file and also
 * brings back its own dark sidebar (CompanyBrandingService.sidebarCss).
 */
:root {
  --background: 228 36% 97%;            /* #f6f7fb */
  --foreground: 230 27% 17%;            /* #202438 */
  --card: 0 0% 100%; --card-foreground: 230 27% 17%;
  --popover: 0 0% 100%; --popover-foreground: 230 27% 17%;
  --primary: 326 78% 43%;               /* #c21878 */
  --primary-foreground: 0 0% 100%;
  --primary-glow: 326 70% 59%;          /* #e04ca0 */
  --secondary: 228 30% 95%; --secondary-foreground: 230 27% 22%;
  --muted: 228 30% 96%; --muted-foreground: 219 12% 47%;   /* #697386 */
  --accent: 325 75% 32%;                /* #8e145b */
  --accent-foreground: 0 0% 100%;
  --border: 225 21% 92%;                /* #e8eaf0 */
  --input: 225 18% 87%;
  --ring: 326 78% 43%;
  --sidebar-background: 0 0% 100%;
  --sidebar-foreground: 224 14% 36%;
  --sidebar-primary: 326 78% 43%;
  --sidebar-primary-foreground: 0 0% 100%;
  --sidebar-accent: 326 64% 96%;        /* #fbedf5 */
  --sidebar-accent-foreground: 326 78% 38%;
  --sidebar-border: 225 21% 92%;
  --sidebar-ring: 326 78% 43%;
  --chart-1: 326 78% 43%; --chart-2: 325 75% 32%;
  --gradient-brand: linear-gradient(135deg, #8e145b, #c21878 55%, #e04ca0);
  --gradient-brand-soft: linear-gradient(135deg, hsl(326 78% 43% / .10), hsl(325 75% 32% / .07));
  --shadow-brand: 0 10px 30px -10px hsl(326 78% 43% / .35);
  --so-shadow: 0 1px 2px rgba(32, 36, 56, .05), 0 1px 3px rgba(32, 36, 56, .04);
  --so-shadow-hover: 0 6px 18px -6px rgba(32, 36, 56, .14);
}
.dark {
  --background: 230 25% 8%; --foreground: 228 25% 92%;
  --card: 230 22% 12%; --card-foreground: 228 25% 92%;
  --popover: 230 22% 12%; --popover-foreground: 228 25% 92%;
  --primary: 326 75% 58%; --primary-foreground: 0 0% 100%; --primary-glow: 326 85% 68%;
  --secondary: 230 18% 18%; --secondary-foreground: 228 20% 85%;
  --muted: 230 18% 15%; --muted-foreground: 222 12% 62%;
  --accent: 326 60% 50%; --accent-foreground: 0 0% 100%;
  --border: 230 16% 20%; --input: 230 16% 22%; --ring: 326 75% 58%;
  --sidebar-background: 230 25% 10%; --sidebar-foreground: 222 14% 72%;
  --sidebar-primary: 326 80% 66%; --sidebar-primary-foreground: 0 0% 100%;
  --sidebar-accent: 326 40% 16%; --sidebar-accent-foreground: 326 80% 82%;
  --sidebar-border: 230 16% 16%; --sidebar-ring: 326 80% 66%;
  --so-shadow: 0 1px 2px rgba(0, 0, 0, .35);
  --so-shadow-hover: 0 6px 18px -6px rgba(0, 0, 0, .6);
}
body { background: hsl(var(--background)); color: hsl(var(--foreground)); -webkit-font-smoothing: antialiased; }

/* ---- shell: white sidebar like WorkOS ---- */
#nx-sidebar { box-shadow: 1px 0 0 hsl(var(--sidebar-border)); }
#nx-sidebar nav a { position: relative; font-weight: 500; }
#nx-sidebar nav a.bg-sidebar-accent { font-weight: 600; }
#nx-sidebar nav a.bg-sidebar-accent::before {
  content: ""; position: absolute; left: -.5rem; top: .45rem; bottom: .45rem; width: 3px; border-radius: 0 3px 3px 0;
  background: hsl(var(--sidebar-primary));
}
#nx-sidebar nav a svg { opacity: .85; }
#nx-sidebar nav a.bg-sidebar-accent svg { opacity: 1; }
.so-wordmark { font-weight: 800; font-size: 1.05rem; letter-spacing: -.01em; color: hsl(var(--foreground)); }
.so-wordmark span { color: hsl(var(--primary)); }

/* top bar: a little glass, like WorkOS */
main > header.sticky { background: hsl(var(--card) / .88); backdrop-filter: saturate(1.4) blur(8px); -webkit-backdrop-filter: saturate(1.4) blur(8px); }

/* ---- cards, tables, buttons, fields: soft polish only ---- */
main .rounded-lg.border.bg-card, main .rounded-xl.border.bg-card {
  box-shadow: var(--so-shadow); border-radius: .875rem; transition: box-shadow .15s ease;
}
main a.rounded-lg.border.bg-card:hover, main a.rounded-xl.border.bg-card:hover { box-shadow: var(--so-shadow-hover); }
main table thead th {
  font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: hsl(var(--muted-foreground)); font-weight: 600;
}
main table thead { background: hsl(var(--muted) / .7); }
main table tbody tr { transition: background-color .12s ease; }
main table tbody tr:hover { background: hsl(var(--primary) / .035); }
button.bg-primary, a.bg-primary { box-shadow: 0 1px 2px hsl(326 78% 30% / .25); }
input:focus-visible, select:focus-visible, textarea:focus-visible { border-color: hsl(var(--ring)); }
::selection { background: hsl(var(--primary) / .18); }

/* ---- sign-in pages (login, forgot password, invite) ---- */
.nx-orb-a { background: hsl(326 90% 70% / .35); }
.nx-orb-b { background: hsl(330 95% 85% / .22); }
.nx-orb-c { background: hsl(320 90% 60% / .25); }
.so-auth-panel { background: hsl(var(--background)); }
.so-auth-card {
  background: hsl(var(--card)); border: 1px solid hsl(var(--border)); border-radius: 1rem; padding: 1.75rem;
  box-shadow: 0 20px 50px -24px rgba(32, 36, 56, .25);
}
.so-auth-title { font-size: 1.75rem; font-weight: 800; color: hsl(var(--foreground)); letter-spacing: -.02em; }
.so-auth-sub { font-size: .875rem; color: hsl(var(--muted-foreground)); margin-top: .25rem; }
.so-auth-label { display: block; font-size: .8125rem; font-weight: 600; color: hsl(var(--foreground)); margin-bottom: .375rem; }
.so-auth-field { position: relative; }
.so-auth-field svg { position: absolute; left: .75rem; top: 50%; transform: translateY(-50%); width: 1rem; height: 1rem; color: hsl(var(--muted-foreground)); }
.so-auth-input {
  display: flex; height: 2.75rem; width: 100%; border-radius: .625rem; border: 1px solid hsl(var(--input));
  background: hsl(var(--background)); color: hsl(var(--foreground)); padding: 0 .875rem; font-size: .9rem; outline: none;
  transition: border-color .15s, box-shadow .15s;
}
.so-auth-field .so-auth-input { padding-left: 2.25rem; }
.so-auth-input::placeholder { color: hsl(var(--muted-foreground) / .8); }
.so-auth-input:focus { border-color: hsl(var(--ring)); box-shadow: 0 0 0 3px hsl(var(--ring) / .15); }
.so-auth-btn {
  display: inline-flex; align-items: center; justify-content: center; width: 100%; height: 2.75rem; border: 0; border-radius: .625rem;
  font-size: .9rem; font-weight: 700; color: #fff; cursor: pointer; transition: filter .15s, transform .05s;
}
.so-auth-btn:hover { filter: brightness(1.06); }
.so-auth-btn:active { transform: translateY(1px); }
.so-auth-note { border-radius: .625rem; padding: .625rem .75rem; font-size: .8125rem; border: 1px solid hsl(var(--border)); background: hsl(var(--muted)); color: hsl(var(--foreground)); }
.so-auth-note.so-err { border-color: hsl(0 72% 51% / .3); background: hsl(0 72% 51% / .08); color: var(--nx-c-b91c1c, #b91c1c); }
.so-auth-link { color: hsl(var(--primary)); font-weight: 600; text-decoration: none; }
.so-auth-link:hover { text-decoration: underline; }
.so-auth-foot { font-size: .75rem; color: hsl(var(--muted-foreground)); text-align: center; }
.so-auth-stack > * + * { margin-top: 1.1rem; }
.so-hero-name span { color: #f9c7e3; }

