/* ============================================================
   teVitaForge — Design tokens
   Maxxa portal web (B2B)
   ============================================================ */

/* ---------- Plus Jakarta Sans (brand fonts, local) ---------- */
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('fonts/PlusJakartaSans-ExtraLight.ttf') format('truetype');
  font-weight: 200; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('fonts/PlusJakartaSans-ExtraLightItalic.ttf') format('truetype');
  font-weight: 200; font-style: italic; font-display: swap;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('fonts/PlusJakartaSans-Light.ttf') format('truetype');
  font-weight: 300; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('fonts/PlusJakartaSans-LightItalic.ttf') format('truetype');
  font-weight: 300; font-style: italic; font-display: swap;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('fonts/PlusJakartaSans-Regular.ttf') format('truetype');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('fonts/PlusJakartaSans-Italic.ttf') format('truetype');
  font-weight: 400; font-style: italic; font-display: swap;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('fonts/PlusJakartaSans-Medium.ttf') format('truetype');
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('fonts/PlusJakartaSans-MediumItalic.ttf') format('truetype');
  font-weight: 500; font-style: italic; font-display: swap;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('fonts/PlusJakartaSans-SemiBold.ttf') format('truetype');
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('fonts/PlusJakartaSans-SemiBoldItalic.ttf') format('truetype');
  font-weight: 600; font-style: italic; font-display: swap;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('fonts/PlusJakartaSans-Bold.ttf') format('truetype');
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('fonts/PlusJakartaSans-BoldItalic.ttf') format('truetype');
  font-weight: 700; font-style: italic; font-display: swap;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('fonts/PlusJakartaSans-ExtraBold.ttf') format('truetype');
  font-weight: 800; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('fonts/PlusJakartaSans-ExtraBoldItalic.ttf') format('truetype');
  font-weight: 800; font-style: italic; font-display: swap;
}

:root {
  /* ---------- Type ---------- */
  --tvf-font-family: 'Plus Jakarta Sans', ui-sans-serif, system-ui,
    -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  --tvf-fs-12: 12px;
  --tvf-fs-16: 16px;
  --tvf-fs-20: 20px;
  --tvf-fs-24: 24px;
  --tvf-fs-32: 32px;

  --tvf-lh-16: 16px;
  --tvf-lh-24: 24px;
  --tvf-lh-32: 32px;
  --tvf-lh-40: 40px;

  --tvf-fw-regular: 400;
  --tvf-fw-medium: 500;
  --tvf-fw-semibold: 600;
  --tvf-fw-bold: 700;

  /* ---------- Neutrals (10 levels) ---------- */
  --tvf-neutral-50:  #F8F9FB;
  --tvf-neutral-100: #F1F2F5;
  --tvf-neutral-200: #E4E6EA;
  --tvf-neutral-300: #C6CAD2;
  --tvf-neutral-400: #98A0AC;
  --tvf-neutral-500: #6E7785;
  --tvf-neutral-600: #44505F;
  --tvf-neutral-700: #253143;
  --tvf-neutral-800: #0E1C30;
  --tvf-neutral-900: #021124;

  /* ---------- States ---------- */
  --tvf-success-dark:  #2F6B2C;
  --tvf-success-base:  #73BF58;
  --tvf-success-light: #E2F3DC;

  --tvf-warning-dark:  #7A5A00;
  --tvf-warning-base:  #F2B705;
  --tvf-warning-light: #FFF1C9;

  --tvf-error-dark:    #B6363C;
  --tvf-error-base:    #E5484D;
  --tvf-error-light:   #FFE6E7;

  --tvf-info-dark:     #0A4E66;
  --tvf-info-base:     #17A2D4;
  --tvf-info-light:    #D5F0FA;

  /* ---------- Brand ---------- */
  --tvf-legacy-navy:   #021124;        /* PANTONE 296 C */
  --tvf-signal-orange: #FF8A3D;        /* PANTONE 1645 C */

  --tvf-active-blue-100: #1F6FFF;
  --tvf-active-blue-80:  #4C8CFF;
  --tvf-active-blue-60:  #79A9FF;
  --tvf-active-blue-40:  #A6C5FF;

  --tvf-deep-support-100: #2F4F99;
  --tvf-deep-support-80:  #5972AD;
  --tvf-deep-support-60:  #8295C2;
  --tvf-deep-support-40:  #ACB8D6;

  /* Selected-row tint used by paginación + select option */
  --tvf-active-blue-tint: #DFE9FF;

  /* ---------- Spacing (rule of 8) ---------- */
  --tvf-space-8: 8px;
  --tvf-space-16: 16px;
  --tvf-space-24: 24px;
  --tvf-space-32: 32px;
  --tvf-space-40: 40px;
  --tvf-space-48: 48px;
  --tvf-space-56: 56px;
  --tvf-space-64: 64px;

  /* ---------- Radius ---------- */
  --tvf-radius-4: 4px;
  --tvf-radius-8: 8px;
  --tvf-radius-12: 12px;

  /* ---------- Borders ---------- */
  --tvf-border-1: 1px;
  --tvf-border-4: 4px;

  /* ---------- Layout ---------- */
  --tvf-app-max-width: 1366px;
  --tvf-card-body-max-width: 800px;
  --tvf-header-height: 42px;

  /* ---------- Motion ---------- */
  --tvf-duration-200: 200ms;
  --tvf-easing-ease: ease;
}

/* Base body color per spec */
html, body {
  font-family: var(--tvf-font-family);
  color: var(--tvf-neutral-900);
}
body {
  margin: 0;
  background: #FFF;
  -webkit-font-smoothing: antialiased;
}