/**
 * Neurofy typography system: Manrope UI scale.
 * Semantic utilities: prefer these over ad-hoc text-[Npx] in templates.
 */

:root {
  --font-sans: 'Manrope', 'Inter', ui-sans-serif, system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;

  --type-meta-size: 12px;
  --type-dense-size: 13px;
  --type-control-size: 14px;
  --type-body-size: 16px;
  --type-section-size: 18px;
  --type-page-size: 24px;
  --type-hero-size: 32px;

  --type-weight-body: 400;
  --type-weight-control: 500;
  --type-weight-heading: 600;
  --type-weight-title: 700;

  --type-muted-color: #92918c;
  --type-tertiary-color: #5e5d58;
  --type-primary-color: #f4f3ee;
  --type-body-color: #edece8;
}

html,
body,
.font-sans {
  font-family: var(--font-sans);
  font-size: var(--type-body-size);
  font-weight: var(--type-weight-body);
  line-height: 1.5;
  font-synthesis-weight: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.font-mono,
code,
kbd,
samp,
pre {
  font-family: var(--font-mono);
}

/*
 * Semantic scale.
 * Size / leading / tracking / role weight stay on the role class so they beat
 * Tailwind preflight heading resets (h1 { font-weight: inherit }).
 * Default colors use :where(...) so co-located text-* utilities can win.
 * Weight utilities paired with type-control / type-meta / type-dense-meta /
 * type-muted / type-label are re-stated below (typography.css loads after
 * style.css, so bare .font-semibold alone cannot override .type-*).
 */
.type-page-title {
  font-size: var(--type-page-size);
  font-weight: var(--type-weight-title);
  line-height: 1.2;
  letter-spacing: -0.02em;
}
:where(.type-page-title) {
  color: var(--type-primary-color);
}

.type-page-hero {
  font-size: var(--type-hero-size);
  font-weight: var(--type-weight-title);
  line-height: 1.15;
  letter-spacing: -0.025em;
}
:where(.type-page-hero) {
  color: var(--type-primary-color);
}

.type-section-title {
  font-size: var(--type-section-size);
  font-weight: var(--type-weight-heading);
  line-height: 1.3;
  letter-spacing: -0.015em;
}
:where(.type-section-title) {
  color: var(--type-primary-color);
}

.type-card-title {
  font-size: var(--type-body-size);
  font-weight: var(--type-weight-heading);
  line-height: 1.35;
}
:where(.type-card-title) {
  color: var(--type-body-color);
}

.type-drawer-title,
.type-modal-title {
  font-size: var(--type-section-size);
  font-weight: var(--type-weight-heading);
  line-height: 1.3;
  letter-spacing: -0.015em;
}
:where(.type-drawer-title),
:where(.type-modal-title) {
  color: var(--type-primary-color);
}

.type-body {
  font-size: var(--type-body-size);
  font-weight: var(--type-weight-body);
  line-height: 1.5;
}
:where(.type-body) {
  color: var(--type-body-color);
}

.type-muted {
  font-size: var(--type-control-size);
  font-weight: var(--type-weight-body);
  line-height: 1.4;
}
:where(.type-muted) {
  color: var(--type-muted-color);
}

.type-dense-meta {
  font-size: var(--type-dense-size);
  font-weight: var(--type-weight-body);
  line-height: 1.4;
}
:where(.type-dense-meta) {
  color: var(--type-muted-color);
}

.type-meta {
  font-size: var(--type-meta-size);
  font-weight: var(--type-weight-body);
  line-height: 1.35;
}
:where(.type-meta) {
  color: var(--type-muted-color);
}

.nf-canonical-breadcrumb {
  font-size: 13px;
}

.type-control {
  font-size: var(--type-control-size);
  font-weight: var(--type-weight-control);
  line-height: 1.35;
}

.type-label {
  font-size: var(--type-meta-size);
  font-weight: var(--type-weight-control);
  line-height: 1.35;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
:where(.type-label) {
  color: var(--type-muted-color);
}

/* Allow intentional Tailwind weight utilities next to type-* roles */
.type-control.font-normal,
.type-meta.font-normal,
.type-dense-meta.font-normal,
.type-muted.font-normal,
.type-label.font-normal {
  font-weight: 400;
}
.type-control.font-medium,
.type-meta.font-medium,
.type-dense-meta.font-medium,
.type-muted.font-medium,
.type-label.font-medium {
  font-weight: 500;
}
.type-control.font-semibold,
.type-meta.font-semibold,
.type-dense-meta.font-semibold,
.type-muted.font-semibold,
.type-label.font-semibold {
  font-weight: 600;
}
.type-control.font-bold,
.type-meta.font-bold,
.type-dense-meta.font-bold,
.type-muted.font-bold,
.type-label.font-bold {
  font-weight: 700;
}

/* Surface components wired to the scale */
.companion-btn {
  font-size: var(--type-control-size);
}

#initiative-drawer-content,
#task-modal-content,
#bug-modal-content {
  font-size: var(--type-body-size);
}

button,
[type='button'],
[type='submit'],
[type='reset'],
.btn-primary {
  font-family: inherit;
  font-size: var(--type-control-size);
}

table th,
table td {
  font-size: var(--type-control-size);
}

/* Tailwind alias alignment (CDN config mirrors these names) */
.text-meta {
  font-size: var(--type-meta-size);
  line-height: 1.35;
}

.text-dense {
  font-size: var(--type-dense-size);
  line-height: 1.4;
}

.text-control {
  font-size: var(--type-control-size);
  line-height: 1.35;
}

.text-section {
  font-size: var(--type-section-size);
  line-height: 1.3;
}

.text-page {
  font-size: var(--type-page-size);
  line-height: 1.2;
}

.text-hero {
  font-size: var(--type-hero-size);
  line-height: 1.15;
}

/* Floor for legacy sub-12px utility classes */
[class*='text-[9px]'],
[class*='text-[10px]'] {
  font-size: var(--type-meta-size) !important;
}

[class*='text-[11px]'] {
  font-size: var(--type-dense-size) !important;
}
