/* NAVONAX CRM premium UI layer
 * - Client-aligned Sora + DM Sans typography across the application shell.
 * - Restrained, semantic action-button palette for Sales registers only.
 * - Command Dashboard quick-access workspace styling.
 *
 * Projects are intentionally excluded from the action-button rules so the
 * approved original Project register layout remains unchanged.
 */

@font-face {
  font-family: "DM Sans NVX";
  src: url("/assets/fonts/dm-sans-latin-v17.woff2") format("woff2");
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
}

@font-face {
  font-family: "Sora NVX";
  src: url("/assets/fonts/sora-latin-v17.woff2") format("woff2");
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
}

:root {
  --nvx-body-font: "DM Sans NVX", "Avenir Next", "Segoe UI", sans-serif;
  --nvx-display-font: "Sora NVX", "Avenir Next", "Segoe UI", sans-serif;
  --font-sans: var(--nvx-body-font);
  --default-font-family: var(--nvx-body-font);
  --nvx-rich-ink: #11283b;
  --nvx-rich-navy: #092f4b;
  --nvx-rich-line: #d8e3eb;
  --nvx-rich-soft: #f5f8fa;
}

html,
body,
.crm-app {
  font-family: var(--nvx-body-font) !important;
  font-kerning: normal;
  font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

input,
select,
textarea,
optgroup {
  font-family: var(--nvx-body-font) !important;
}

button {
  font-family: var(--nvx-display-font) !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.page-heading b,
.module-heading h2,
.register-heading h2 {
  font-family: var(--nvx-display-font) !important;
  letter-spacing: -0.045em;
}

.topbar,
.workspace-scroll,
.module-workspace,
.module-register-workspace,
.nvx-leadops-layer,
.nvx-project-updates-layer,
.nvx-ca-layer {
  font-family: var(--nvx-body-font) !important;
}

.sidebar-nav button,
.page-heading b,
.primary-button,
.secondary-button,
.eyebrow,
.nav-group {
  font-family: var(--nvx-display-font) !important;
}

.kpi-card strong,
.nav-badge,
.sidebar-nav button b,
table td,
table th {
  font-variant-numeric: tabular-nums;
}

table th,
.register-table th {
  font-family: var(--nvx-display-font) !important;
  letter-spacing: 0.025em;
}

/* Premium Sales action bar ---------------------------------------------- */

body .module-register-workspace:is(
    [data-module="leads"],
    [data-module="proposal-sent"],
    [data-module="followups"],
    [data-module="future-leads"],
    [data-module="lost-leads"]
  ) .row-actions {
  align-items: center !important;
  gap: 6px !important;
  padding: 5px !important;
  border: 1px solid #e1e8ee;
  border-radius: 13px;
  background: linear-gradient(135deg, #f7f9fb 0%, #fbfcfd 52%, #f3f7f9 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

body .module-register-workspace:is(
    [data-module="leads"],
    [data-module="proposal-sent"],
    [data-module="followups"],
    [data-module="future-leads"],
    [data-module="lost-leads"]
  ) .row-actions > .row-action {
  position: relative;
  isolation: isolate;
  border: 1px solid #d5e0e8 !important;
  border-radius: 10px !important;
  background: linear-gradient(180deg, #ffffff 0%, #f2f6f8 100%) !important;
  color: #243d51 !important;
  box-shadow:
    0 1px 2px rgba(11, 39, 59, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.92) !important;
  font-family: var(--nvx-display-font) !important;
  font-weight: 650 !important;
  letter-spacing: -0.025em;
  transition:
    transform 150ms ease,
    border-color 150ms ease,
    background 150ms ease,
    color 150ms ease,
    box-shadow 150ms ease !important;
}

body .module-register-workspace:is(
    [data-module="leads"],
    [data-module="proposal-sent"],
    [data-module="followups"],
    [data-module="future-leads"],
    [data-module="lost-leads"]
  ) .row-actions > .row-action:hover:not(:disabled) {
  transform: translateY(-1px);
  border-color: #b9cad6 !important;
  box-shadow:
    0 6px 14px rgba(11, 39, 59, 0.11),
    inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

body .module-register-workspace:is(
    [data-module="leads"],
    [data-module="proposal-sent"],
    [data-module="followups"],
    [data-module="future-leads"],
    [data-module="lost-leads"]
  ) .row-actions > .row-action:focus-visible {
  outline: 2px solid #79afd0 !important;
  outline-offset: 2px;
}

/* Quick Proposal is the premium primary action. Its existing hook is kept. */
body .module-register-workspace:is(
    [data-module="leads"],
    [data-module="proposal-sent"],
    [data-module="followups"],
    [data-module="future-leads"],
    [data-module="lost-leads"]
  ) .row-actions > .nvx-quick-proposal-row {
  border-color: #123f5e !important;
  background: linear-gradient(135deg, #092d49 0%, #0b5275 58%, #0c6689 100%) !important;
  color: #ffffff !important;
  box-shadow:
    0 5px 13px rgba(8, 49, 76, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
}

body .module-register-workspace:is(
    [data-module="leads"],
    [data-module="proposal-sent"],
    [data-module="followups"],
    [data-module="future-leads"],
    [data-module="lost-leads"]
  ) .row-actions > .nvx-quick-proposal-row::before {
  color: #eaf7fb;
  background: rgba(255, 255, 255, 0.13);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.11);
}

/* Add progress: quiet sapphire. */
body .module-register-workspace:is(
    [data-module="leads"],
    [data-module="proposal-sent"],
    [data-module="followups"],
    [data-module="future-leads"],
    [data-module="lost-leads"]
  ) .row-actions > .row-action.blue:not(.nvx-quick-proposal-row) {
  border-color: #c5dce9 !important;
  background: linear-gradient(180deg, #f4f9fc 0%, #e8f2f8 100%) !important;
  color: #0c5e8b !important;
}

/* Site visit: restrained teal. */
body .module-register-workspace:is(
    [data-module="leads"],
    [data-module="proposal-sent"],
    [data-module="followups"],
    [data-module="future-leads"],
    [data-module="lost-leads"]
  ) .row-actions > .nvx-site-visit-row {
  border-color: #c1ddd4 !important;
  background: linear-gradient(180deg, #f3faf8 0%, #e5f3ef 100%) !important;
  color: #166a5a !important;
}

/* Assignment: muted warm metal, not a loud orange. */
body .module-register-workspace:is(
    [data-module="leads"],
    [data-module="proposal-sent"],
    [data-module="followups"],
    [data-module="future-leads"],
    [data-module="lost-leads"]
  ) .row-actions > .row-action.orange {
  border-color: #e4d5b8 !important;
  background: linear-gradient(180deg, #fbf8f0 0%, #f4eddf 100%) !important;
  color: #80591d !important;
}

/* Future queue: mineral violet kept as a small semantic cue. */
body .module-register-workspace:is(
    [data-module="leads"],
    [data-module="proposal-sent"],
    [data-module="followups"],
    [data-module="future-leads"],
    [data-module="lost-leads"]
  ) .row-actions > .row-action.purple {
  border-color: #d4cfe7 !important;
  background: linear-gradient(180deg, #f7f5fb 0%, #eeeaf6 100%) !important;
  color: #574d82 !important;
}

/* Destructive action: ruby tint instead of a solid warning block. */
body .module-register-workspace:is(
    [data-module="leads"],
    [data-module="proposal-sent"],
    [data-module="followups"],
    [data-module="future-leads"],
    [data-module="lost-leads"]
  ) .row-actions > .row-action.red {
  border-color: #e7c8cc !important;
  background: linear-gradient(180deg, #fff8f8 0%, #f9ebed 100%) !important;
  color: #983b45 !important;
}

/* Convert / reactivate: the second decisive action. */
body .module-register-workspace:is(
    [data-module="leads"],
    [data-module="proposal-sent"],
    [data-module="followups"],
    [data-module="future-leads"],
    [data-module="lost-leads"]
  ) .row-actions > .row-action.green:not(.nvx-site-visit-row) {
  border-color: #165f4f !important;
  background: linear-gradient(135deg, #0d4e43 0%, #126d59 100%) !important;
  color: #ffffff !important;
  box-shadow:
    0 5px 12px rgba(11, 80, 65, 0.17),
    inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
}

body .module-register-workspace:is(
    [data-module="leads"],
    [data-module="proposal-sent"],
    [data-module="followups"],
    [data-module="future-leads"],
    [data-module="lost-leads"]
  ) .row-actions > .row-action:disabled {
  opacity: 0.52;
  cursor: not-allowed;
  transform: none;
  box-shadow: none !important;
}

/* Proposal Sent ships with an older high-specificity color layer. These
 * scoped overrides keep it visually aligned with the other Sales registers. */
body.nvx-proposal-sent-active
  section.module-workspace.module-register-workspace[data-module="proposal-sent"]
  td[data-label="Action"]
  .row-actions > .row-action {
  border: 1px solid #d5e0e8 !important;
  background: linear-gradient(180deg, #ffffff 0%, #f2f6f8 100%) !important;
  color: #243d51 !important;
  box-shadow:
    0 1px 2px rgba(11, 39, 59, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.92) !important;
  font-family: var(--nvx-display-font) !important;
  font-weight: 650 !important;
}

body.nvx-proposal-sent-active
  section.module-workspace.module-register-workspace[data-module="proposal-sent"]
  td[data-label="Action"]
  .row-actions > .nvx-quick-proposal-row {
  border-color: #123f5e !important;
  background: linear-gradient(135deg, #092d49 0%, #0b5275 58%, #0c6689 100%) !important;
  color: #ffffff !important;
  box-shadow:
    0 5px 13px rgba(8, 49, 76, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
}

body.nvx-proposal-sent-active
  section.module-workspace.module-register-workspace[data-module="proposal-sent"]
  td[data-label="Action"]
  .row-actions > .row-action.blue:not(.nvx-quick-proposal-row) {
  border-color: #c5dce9 !important;
  background: linear-gradient(180deg, #f4f9fc 0%, #e8f2f8 100%) !important;
  color: #0c5e8b !important;
}

body.nvx-proposal-sent-active
  section.module-workspace.module-register-workspace[data-module="proposal-sent"]
  td[data-label="Action"]
  .row-actions > .nvx-site-visit-row {
  border-color: #c1ddd4 !important;
  background: linear-gradient(180deg, #f3faf8 0%, #e5f3ef 100%) !important;
  color: #166a5a !important;
}

body.nvx-proposal-sent-active
  section.module-workspace.module-register-workspace[data-module="proposal-sent"]
  td[data-label="Action"]
  .row-actions > .row-action.orange {
  border-color: #e4d5b8 !important;
  background: linear-gradient(180deg, #fbf8f0 0%, #f4eddf 100%) !important;
  color: #80591d !important;
}

body.nvx-proposal-sent-active
  section.module-workspace.module-register-workspace[data-module="proposal-sent"]
  td[data-label="Action"]
  .row-actions > .row-action.purple {
  border-color: #d4cfe7 !important;
  background: linear-gradient(180deg, #f7f5fb 0%, #eeeaf6 100%) !important;
  color: #574d82 !important;
}

body.nvx-proposal-sent-active
  section.module-workspace.module-register-workspace[data-module="proposal-sent"]
  td[data-label="Action"]
  .row-actions > .row-action.red {
  border-color: #e7c8cc !important;
  background: linear-gradient(180deg, #fff8f8 0%, #f9ebed 100%) !important;
  color: #983b45 !important;
}

body.nvx-proposal-sent-active
  section.module-workspace.module-register-workspace[data-module="proposal-sent"]
  td[data-label="Action"]
  .row-actions > .row-action.green:not(.nvx-site-visit-row) {
  border-color: #165f4f !important;
  background: linear-gradient(135deg, #0d4e43 0%, #126d59 100%) !important;
  color: #ffffff !important;
  box-shadow:
    0 5px 12px rgba(11, 80, 65, 0.17),
    inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
}

/* Proposal Sent contains a wide, action-rich register. Never clip its
 * horizontal content; keep the scroll inside the table surface. */
body .module-register-workspace[data-module="proposal-sent"] .register-table-wrap {
  overflow-x: auto !important;
  overscroll-behavior-x: contain;
  scrollbar-gutter: stable;
}

/* Keep the install control available without covering records or Dashboard
 * shortcuts. It expands only while a desktop user intentionally engages it. */
.crm-install-button {
  width: 48px !important;
  min-width: 48px !important;
  max-width: 48px !important;
  padding-inline: 0 !important;
  gap: 0 !important;
  overflow: hidden;
  justify-content: center !important;
  white-space: nowrap;
  font-size: 0 !important;
  transition:
    width 170ms ease,
    max-width 170ms ease,
    padding 170ms ease,
    box-shadow 170ms ease !important;
}

.crm-install-button::before {
  margin: 0 !important;
  font-size: 15px !important;
}

.workspace-scroll {
  scroll-padding-bottom: 72px;
}

/* NVX_BALANCED_WINDOW_GUTTERS_V1
 * Keep every main CRM window aligned to equal responsive side gutters. */
@media (min-width: 701px) {
  .workspace-scroll {
    padding-right: clamp(18px, 2.4vw, 36px) !important;
  }
}

@media (hover: hover) and (pointer: fine) {
  .crm-install-button:hover,
  .crm-install-button:focus-visible {
    width: 184px !important;
    max-width: 184px !important;
    padding-inline: 15px !important;
    gap: 8px !important;
    font-size: 10px !important;
  }
}

/* Command Dashboard quick access --------------------------------------- */

.nvx-command-shortcuts {
  position: relative;
  isolation: isolate;
  margin: 0 0 17px;
  padding: 18px;
  overflow: hidden;
  border: 1px solid #d6e3eb;
  border-radius: 17px;
  background:
    radial-gradient(circle at 96% -15%, rgba(29, 122, 168, 0.13), transparent 35%),
    linear-gradient(135deg, #f8fbfd 0%, #ffffff 58%, #f3f8fa 100%);
  box-shadow:
    0 12px 32px rgba(9, 47, 75, 0.07),
    inset 0 1px 0 rgba(255, 255, 255, 0.96);
}

.nvx-command-shortcuts::before {
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  content: "";
  background: linear-gradient(180deg, #0b6f9c, #31a797 55%, #d8a74a);
}

.nvx-command-shortcuts-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  margin: 0 0 15px;
}

.nvx-command-shortcuts-copy {
  min-width: 0;
}

.nvx-command-kicker {
  margin: 0 0 4px;
  color: #23759d;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.nvx-command-shortcuts h2 {
  margin: 0;
  color: #0b2e49;
  font-size: clamp(17px, 1.35vw, 21px);
  font-weight: 760;
  letter-spacing: -0.04em;
  line-height: 1.15;
}

.nvx-command-shortcuts-intro {
  max-width: 560px;
  margin: 5px 0 0;
  color: #687d8e;
  font-size: 9.5px;
  line-height: 1.55;
  font-family: var(--nvx-body-font) !important;
}

.nvx-command-shortcuts-pill {
  flex: 0 0 auto;
  padding: 7px 10px;
  border: 1px solid #cbdde8;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.78);
  color: #446276;
  font-size: 8px;
  font-weight: 760;
  letter-spacing: 0.04em;
  box-shadow: inset 0 1px 0 #ffffff;
}

.nvx-command-shortcut-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.nvx-command-shortcut {
  --nvx-shortcut-accent: #1a678d;
  position: relative;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-width: 0;
  min-height: 78px;
  padding: 12px;
  text-align: left;
  border: 1px solid #dce6ed;
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.9);
  color: #173448;
  box-shadow:
    0 4px 13px rgba(14, 49, 72, 0.05),
    inset 0 1px 0 #ffffff;
  transition:
    transform 160ms ease,
    border-color 160ms ease,
    box-shadow 160ms ease,
    background 160ms ease;
}

.nvx-command-shortcut:hover {
  transform: translateY(-2px);
  border-color: #a9c2d2;
  border-color: color-mix(in srgb, var(--nvx-shortcut-accent) 38%, #dce6ed);
  background: #ffffff;
  box-shadow:
    0 10px 24px rgba(10, 51, 77, 0.1),
    inset 0 1px 0 #ffffff;
}

.nvx-command-shortcut:focus-visible {
  outline: 2px solid #78aeca;
  outline: 2px solid color-mix(in srgb, var(--nvx-shortcut-accent) 65%, white);
  outline-offset: 2px;
}

.nvx-command-shortcut[data-tone="teal"] {
  --nvx-shortcut-accent: #257a6c;
}

.nvx-command-shortcut[data-tone="violet"] {
  --nvx-shortcut-accent: #65588f;
}

.nvx-command-shortcut[data-tone="bronze"] {
  --nvx-shortcut-accent: #8b672d;
}

.nvx-command-shortcut-mark {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid #d3e2ea;
  border-color: color-mix(in srgb, var(--nvx-shortcut-accent) 24%, white);
  border-radius: 10px;
  background: #f0f6f9;
  background: color-mix(in srgb, var(--nvx-shortcut-accent) 10%, white);
  color: var(--nvx-shortcut-accent);
  font-size: 8px;
  font-weight: 850;
  letter-spacing: 0.05em;
}

.nvx-command-shortcut-copy {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.nvx-command-shortcut-group {
  color: var(--nvx-shortcut-accent);
  font-size: 7px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.nvx-command-shortcut strong {
  overflow: hidden;
  color: #143047;
  font-size: 10.5px;
  font-weight: 760;
  letter-spacing: -0.018em;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nvx-command-shortcut small {
  overflow: hidden;
  color: #718494;
  font-size: 8px;
  font-weight: 520;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: var(--nvx-body-font) !important;
}

.nvx-command-shortcut-tail {
  display: grid;
  align-self: stretch;
  justify-items: end;
  align-content: space-between;
  min-width: 22px;
}

.nvx-command-shortcut-count {
  min-width: 22px;
  padding: 3px 6px;
  border: 1px solid #d8e3ea;
  border-radius: 999px;
  background: #f5f8fa;
  color: #4a6578;
  font-size: 7px;
  font-weight: 800;
  line-height: 1;
  text-align: center;
}

.nvx-command-shortcut-count[hidden] {
  display: none;
}

.nvx-command-shortcut-arrow {
  color: var(--nvx-shortcut-accent);
  font-size: 13px;
  font-weight: 700;
  transition: transform 160ms ease;
}

.nvx-command-shortcut:hover .nvx-command-shortcut-arrow {
  transform: translateX(2px);
}

@media (max-width: 1250px) {
  .nvx-command-shortcut-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .nvx-command-shortcuts {
    padding: 15px;
    border-radius: 15px;
  }

  .nvx-command-shortcuts-head {
    align-items: start;
    flex-direction: column;
    gap: 10px;
  }

  .nvx-command-shortcut-grid {
    grid-template-columns: 1fr;
  }

  body .module-register-workspace:is(
      [data-module="leads"],
      [data-module="proposal-sent"],
      [data-module="followups"],
      [data-module="future-leads"],
      [data-module="lost-leads"]
    ) .row-actions {
    padding: 4px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .nvx-command-shortcut,
  .nvx-command-shortcut-arrow,
  body .module-register-workspace .row-action {
    transition: none !important;
  }
}
