@import url("fonts/fonts.456cfc63230f.css");
/* FJN System — design tokens v1.2 (brand red #EE2E3C from the SVG logo) (E0, approved 2026-09-25, decisions D1–D25). */
:root {
  /* Action colour (primary buttons, links, selections) — D17 */
  --fjn-brand-700: #173F6F;   /* hover */
  --fjn-brand-800: #122F53;   /* active */
  --fjn-brand-600: #1E4F8A;   /* primary */
  --fjn-brand-100: #E3ECF7;
  --fjn-brand-50:  #F1F5FB;
  /* felgijaknowe.pl brand — logo, navigation and "Brak dostępu" only (D13, D14, D17) */
  --fjn-red-600: #EE2E3C;
  --fjn-red-100: #FDE7E9;
  /* Keyboard focus ring (clearly visible on navy and white) */
  --fjn-focus-ring: #C4520F;
  --fjn-highlight: #FBE7DA;   /* search match highlight */

  /* Side navigation (D14, D15) */
  --fjn-nav-bg: #1F2329;
  --fjn-nav-logo-bg: #000000;
  --fjn-nav-text: #F1F3F5;
  --fjn-nav-hover: #2C3139;
  --fjn-nav-active-bg: #EE2E3C;
  --fjn-nav-active-text: #FFFFFF;
  --fjn-nav-divider: #353B43;

  /* Interaction states and auxiliary backgrounds (D35) — previously only in the prototype */
  --fjn-btn-disabled-bg: #E4E7EB;   /* disabled button background */
  --fjn-text-disabled:   #8A929C;   /* disabled text (buttons, fields, pagination) */
  --fjn-icon-disabled:   #B7BDC5;   /* disabled icon (pagination, icon button) */
  --fjn-btn-secondary-active: #E1E4E8; /* secondary: active (pressed); also skeleton midtone */
  --fjn-danger-800: #8F1E18;        /* danger: hover */
  --fjn-danger-900: #731813;        /* danger: active */
  --fjn-brand-on-dark-2: #C9D7EA;   /* caption on brand-600 background ("Dodaj klienta" tile) */
  --fjn-row-changed:  #FFF8EB;      /* changed row (new price list version) */
  --fjn-row-pending:  #FFFBF2;      /* pending row (device awaiting approval) */
  --fjn-row-unread:   #F7F9FC;      /* unread notification */
  --fjn-table-group:  #FAFAFB;      /* table group header (price list: Renowacja…) */
  --fjn-placeholder-1: #1E2328;     /* photo placeholder stripes on a dark background */
  --fjn-placeholder-2: #232930;
  --fjn-canvas: #E9EBEE;            /* overview page background (documentation only) */

  /* Neutrals */
  --fjn-bg:        #F4F5F6;
  --fjn-surface:   #FFFFFF;
  --fjn-surface-2: #EEF0F2;
  --fjn-border:    #D8DCE1;
  --fjn-border-strong: #AEB5BE;
  --fjn-text:      #15181C;
  --fjn-text-2:    #454D57;
  --fjn-text-3:    #626B77;   /* min. 4.5:1 on #FFF */
  --fjn-text-inverse: #FFFFFF;

  /* Statuses — always together with text */
  --fjn-success-700: #1B6B41; --fjn-success-100: #E2F2E8;
  --fjn-warning-700: #8A5300; --fjn-warning-100: #FCEFD6;
  --fjn-danger-700:  #B3261E; --fjn-danger-100:  #FBE6E4;
  --fjn-info-700:    #0B6477; --fjn-info-100:    #DFF1F5;
  --fjn-neutral-700: #454D57; --fjn-neutral-100: #ECEEF1;
  --fjn-status-review: #4A2F7A; --fjn-status-review-bg: #EDE7F6;  /* D155 (14): E3 „Kontrola” */

  --fjn-focus: 0 0 0 3px rgba(30,79,138,.30);            /* form fields */
  --fjn-focus-btn: 0 0 0 2px #FFFFFF, 0 0 0 4px #C4520F; /* buttons */

  /* Typography */
  --fjn-font: "Atkinson Hyperlegible Next", system-ui, sans-serif;
  --fjn-font-mono: "Atkinson Hyperlegible Mono", ui-monospace, monospace; /* registration no., VIN, NIP, amounts */
  --fjn-fs-display: 32px; --fjn-lh-display: 40px;  /* hall: numbers, statuses */
  --fjn-fs-h1: 24px;      --fjn-lh-h1: 32px;
  --fjn-fs-h2: 18px;      --fjn-lh-h2: 26px;
  --fjn-fs-body: 15px;    --fjn-lh-body: 22px;
  --fjn-fs-small: 13px;   --fjn-lh-small: 18px;
  --fjn-fs-label: 12px;   --fjn-lh-label: 16px;    /* labels, uppercase +0.04em */
  --fjn-fw-regular: 400; --fjn-fw-medium: 500; --fjn-fw-bold: 700;

  /* Spacing (4 px grid) */
  --fjn-sp-1: 4px; --fjn-sp-2: 8px; --fjn-sp-3: 12px; --fjn-sp-4: 16px;
  --fjn-sp-5: 20px; --fjn-sp-6: 24px; --fjn-sp-8: 32px; --fjn-sp-10: 40px; --fjn-sp-12: 48px;

  /* Control sizes */
  --fjn-ctl-sm: 32px;   /* desktop, dense tables */
  --fjn-ctl-md: 40px;   /* desktop default */
  --fjn-ctl-touch: 44px;/* tablet / phone (minimum) */
  --fjn-ctl-hall: 56px; /* hall */

  /* Radii, shadows */
  --fjn-r-sm: 4px; --fjn-r-md: 6px; --fjn-r-lg: 10px; --fjn-r-full: 999px;
  --fjn-shadow-1: 0 1px 2px rgba(21,24,28,.06), 0 1px 1px rgba(21,24,28,.04);
  --fjn-shadow-2: 0 4px 12px rgba(21,24,28,.10);
  --fjn-shadow-3: 0 16px 40px rgba(21,24,28,.18);

  /* Layout */
  --fjn-sidebar-w: 232px; --fjn-rail-w: 88px; /* tablet */
  --fjn-topbar-h: 64px; /* desktop/tablet, equal to the logo bar */ --fjn-topbar-h-m: 56px; --fjn-bottomnav-h: 64px;
  --fjn-modal-w: 520px; --fjn-panel-w: 440px;
  --fjn-content-max: 1280px;

  /* Motion */
  --fjn-dur-fast: 120ms; --fjn-dur: 200ms; --fjn-ease: cubic-bezier(.2,.0,.2,1);
}
@keyframes fjn-spin { to { transform: rotate(360deg); } }          /* spinner in the "Zapisywanie…" button: 800ms linear infinite */
@keyframes fjn-shimmer { 0%{background-position:-400px 0} 100%{background-position:400px 0} } /* skeleton: 1.2s linear infinite */
@keyframes fjn-toast-in { from{transform:translateY(-8px);opacity:0} to{transform:none;opacity:1} } /* success bar: 200ms cubic-bezier(.2,0,.2,1) both */
