/* Design tokens from the Prac-Portal-Prototype Figma file
** (IrjJxSRM8c1FXI5YV16fCd). The first block is the fifteen named
** variables the file actually defines; the second is colours the
** designs use as literals with no variable behind them.
**
** Loaded before app.css so app.css can consume these. Nothing here
** selects an element - it is values only, so adding it changed no
** existing page's appearance.
**
** NOTE: no space before ( in rgba()/linear-gradient() etc. The
** portal's "space before (" rule is a PHP/JS rule; browsers drop a
** CSS declaration written that way.
*/

:root {

/* --- the fifteen Figma variables ------------------------------- */
   --usb-primary:          #1D248A;  /* "Primary (POP!) color" */
   --usb-normal-status:    #3F459C;
   --usb-strong-text:      #03040E;
   --usb-body:             #444444;
   --usb-light-text:       #4B5768;
   --usb-unactivated-icon: #414C4E;
   --usb-light-bg:         #F4F4F9;
   --usb-less-light-bg:    #E8E9F3;
   --usb-status-bg:        #EDF9FC;
   --usb-success:          #1D786D;  /* also "Green" */
   --usb-success-bg:       #E8F2F0;
   --usb-fail:             #DC2626;
   --usb-fail-bg:          #FEF2F2;
   --usb-warning:          #D97706;
   --usb-warning-bg:       #FFFBEB;

/* --- literals the designs use without a variable ---------------- */
   --usb-accent:       #4EC3E0;  /* banner gradient end, sub bullets */
   --usb-hover-button: #DCF3F9;
   --usb-hover-text:   #313944;
   --usb-open-panel:   #F6FCFD;  /* expanded nav group background */
   --usb-page-bg:      #F0F4F8;
   --usb-row-bg:       #FAFBFC;
   --usb-border:       #E2E8F0;
   --usb-divider:      #F1F5F9;
   --usb-muted:        #94A3B8;  /* table column headings */
   --usb-ink:          #1A202C;  /* strongest body text in cards */
   --usb-subtle:       #64748B;  /* secondary cell text */

/* --- shape and depth ------------------------------------------- */
   --usb-radius-card: 12px;
   --usb-radius-pill: 20px;
   --usb-radius-nav:  8px;
   --usb-shadow-card: 0 2px 6px rgba(0,0,0,0.06);
   --usb-shadow-banner: 0 4px 8px rgba(0,0,0,0.1);

/* Body copy in the Figma is Lato 18/400; the portal already loads
** Inter and every UI label in the designs is Inter. Lato is used for
** exactly one string ("Latest Notifications"), so it is opt-in rather
** than a body default - see .dash-panel-title in dashboard.css. */
   --usb-font-display: 'Lato', 'Inter', sans-serif;
}
