@import url('./cybox-local-fonts.css?v=20260921-cormorant1');

/* Shared font families; font sizes, line heights and tracking come from each
   page/component, including its original responsive breakpoints. */
:root {
  --cy-premium-font-body: 'Onest', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --cy-premium-font-heading: 'Unbounded', sans-serif;
}

/* Keep standalone premium views aligned with the shared font renderer.
   Former Onest heading pairs resolve to Unbounded there before first paint;
   this fallback also covers manually supplied theme attributes.
   Body text stays Onest; no stored personal preference is rewritten. */
html[data-cy-font-body="jura"][data-cy-font-headings="unbounded"] body.cybox-premium-ui,
html[data-cy-font-body="onest"][data-cy-font-headings="manrope"] body.cybox-premium-ui,
html[data-cy-font-body="onest"][data-cy-font-headings="cormorant"] body.cybox-premium-ui {
  --cy-font-body: var(--cy-premium-font-body);
  --cy-font-heading: var(--cy-premium-font-heading);
}

/* Public entry screens have no personal account typography yet. */
body.cybox-premium-ui:is(.auth-site-page, .cybox-auth-register) {
  --cy-font-body: var(--cy-premium-font-body);
  --cy-font-heading: var(--cy-premium-font-heading);
  --auth-body: var(--cy-premium-font-body);
  --auth-heading: var(--cy-premium-font-heading);
}

/* Entry screens keep their original academy heading face; the panel's wider
   display face does not fit the artwork reserved by their mobile layout. */
body.cybox-premium-ui:is(.auth-login-page, .auth-recovery-page) {
  --cy-font-heading: 'Tenor Sans', 'Onest', Arial, sans-serif;
  --auth-heading: var(--cy-font-heading);
}

@layer cybox-premium-typography {
  body.cybox-premium-ui {
    font-family: var(--cy-font-body, var(--cy-premium-font-body)) !important;
    font-weight: 450;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-hyphens: none;
    hyphens: none;
  }

  /* Keep icon glyphs and every code-editor layer outside proportional UI type. */
  body.cybox-premium-ui *:not(:where(
    i, [class*="fa-"], [class*="mdi"], [class*="material-icons"], [class*="material-symbols"], [data-lucide],
    svg, svg *, code, code *, pre, pre *, kbd, samp, .code-rain *,
    .ace_editor, .ace_editor *, [class*="ace_"], #editor, .editor-mobile, .admin-code-area, .admin-sql-textarea,
    .CodeMirror, .CodeMirror *, .cm-editor, .cm-editor *, .monaco-editor, .monaco-editor *,
    #code-editor, .code-editor-highlight, .code-editor-highlight *, .code-syntax, .code-syntax *,
    .code-line, .code-line *, .code-line-numbers, .code-line-numbers *, .code-example, .code-inline-token,
    .arena-code-editor, .arena-code-editor *, .arena-code-output, .arena-code-output *
  )) {
    font-family: var(--cy-font-body, var(--cy-premium-font-body)) !important;
  }

  body.cybox-premium-ui :is(h1, h2, h3, h4, h5, h6, .welcome-title, .ana-title,
    .page-title, .section-title, .profile-identity-name, .hw-title, .wl-title, .hello-title,
    .achievement-heading-main, .achievement-heading-script) {
    font-family: var(--cy-font-heading, var(--cy-premium-font-heading)) !important;
    font-weight: 600 !important;
    -webkit-hyphens: none !important;
    hyphens: none !important;
    word-break: normal !important;
    overflow-wrap: anywhere;
    text-wrap: balance;
  }
  body.cybox-premium-ui :is(h1, h2, h3, h4, h5, h6, .welcome-title, .ana-title, .wl-title, .hello-title)
    :where(span, strong, b, em, a):not(:where([class*="fa-"], [class*="mdi"], [class*="material-icons"], [class*="material-symbols"], [data-lucide])) {
    font-family: inherit !important;
  }


  body.cybox-premium-ui:is(.auth-login-page, .auth-recovery-page) :is(h1, h2, h3) {
    font-weight: 700 !important;
    overflow-wrap: normal;
  }

  /* Native system password bullets stay compact, including after reveal. */
  body.cybox-premium-ui:is(.auth-login-page, .auth-recovery-page) :is(.login-password-wrap, .recovery-password-wrap) input {
    font-family: Arial, sans-serif !important;
    font-size: 16px;
    font-weight: 400 !important;
    letter-spacing: normal !important;
  }

  /* The compact profile identity is interface text, not a display heading. */
  body.cybox-premium-ui #profile-workspace-title {
    font-family: var(--cy-font-body, var(--cy-premium-font-body)) !important;
  }

  /* Community sections match the Social networks heading in settings,
     including section labels whose markup is a div rather than h2/h3. */
  body.cybox-premium-ui #friends-overlay .friends-modal :is(.fr-block-title, .ref-primary-title, .ref-invitees h5) {
    font-family: var(--cy-font-heading, var(--cy-premium-font-heading)) !important;
    font-weight: 600 !important;
  }

  body.cybox-premium-ui :is(button, [role="button"], [role="tab"], label,
    .menu-text, .menu-title, .form-label, .login-back, .recovery-back) {
    -webkit-hyphens: none !important;
    hyphens: none !important;
    word-break: normal !important;
  }
  body.cybox-premium-ui :is(button, [role="button"], [role="tab"], .form-label,
    .login-form-row > label, .recovery-form-row > label) {
    font-weight: 600;
  }
}