/* Jay Group Portal — design tokens (shared desktop / mobile entrypoints) */
:root {
  --jp-navy-950: #050d1c;
  --jp-navy-900: #08152f;
  --jp-navy-800: #0f2347;
  --jp-blue: #2f65d9;
  --jp-blue-hover: #2555bc;
  --jp-blue-soft: #e8eefc;
  --jp-text: #0f172a;
  --jp-text-muted: #64748b;
  --jp-border: #dbe4ef;
  --jp-surface: #ffffff;
  --jp-surface-subtle: #f4f7fb;
  --jp-font-sans: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, "Helvetica Neue", Arial, sans-serif;
  --jp-radius-sm: 8px;
  --jp-radius-md: 12px;
  --jp-radius-lg: 14px;
  --jp-shadow: 0 4px 24px rgba(5, 13, 28, 0.12);
  --jp-shadow-lg: 0 12px 40px rgba(5, 13, 28, 0.18);
  /* Shared page width / horizontal padding (used by .jp-main) */
  --jp-page-max: 1280px;
  --jp-page-pad: clamp(16px, 3vw, 40px);
  /* ---- Branding & Theme tokens — overridden by Admin → Settings → Branding & Theme ---- */

  /* Page / app background */
  --portal-page-bg: linear-gradient(180deg, var(--jp-navy-800) 0%, #0a1628 100%);

  /* Login page */
  --portal-login-bg: radial-gradient(120% 100% at 50% 0%, #132a52 0%, var(--jp-navy-900) 45%, var(--jp-navy-950) 100%);
  --portal-login-card-bg: var(--jp-surface);
  --portal-login-card-border: rgba(255, 255, 255, 0.08);
  --portal-login-heading: var(--jp-text);
  --portal-login-button-bg: var(--portal-button-bg);
  --portal-login-button-text: var(--portal-button-text);

  /* Header */
  --portal-header-bg: var(--jp-navy-900);
  --portal-header-text: #ffffff;
  --portal-header-icon: rgba(214, 226, 255, 0.85);

  /* Buttons */
  --portal-button-bg: var(--jp-blue);
  --portal-button-bg-hover: var(--jp-blue-hover);
  --portal-button-text: #ffffff;

  /* Cards & panels */
  --portal-card-bg: var(--jp-surface);
  --portal-card-border: rgba(15, 23, 42, 0.06);
  --portal-card-text: var(--jp-text-muted);
  --portal-card-heading: var(--jp-text);
  --portal-card-accent: var(--jp-blue);

  /* Global text */
  --portal-text-main: var(--jp-text);
  --portal-text-muted: var(--jp-text-muted);
  --portal-heading-text: var(--jp-text);
  --portal-subheading-text: var(--jp-text-muted);

  /* Links */
  --portal-link-colour: #861f54;
  --portal-link-hover-colour: #6b1843;
  --portal-link-visited-colour: #861f54;

  /* Secondary buttons */
  --portal-button-secondary-bg: rgba(255, 255, 255, 0.08);
  --portal-button-secondary-text: #ffffff;
  --portal-button-secondary-border: rgba(255, 255, 255, 0.14);
  --portal-button-disabled-bg: rgba(203, 213, 225, 0.5);
  --portal-button-disabled-text: #94a3b8;

  /* Forms & inputs */
  --portal-input-bg: var(--jp-surface-subtle);
  --portal-input-text: var(--jp-text);
  --portal-input-border: #cfd6e0;
  --portal-input-focus-border: var(--jp-blue);
  --portal-label-text: var(--jp-text);
  --portal-placeholder-text: var(--jp-text-muted);
  --portal-help-text: var(--jp-text-muted);

  /* Tables */
  --portal-table-bg: var(--jp-surface);
  --portal-table-header-bg: var(--jp-surface-subtle);
  --portal-table-header-text: #6b7280;
  --portal-table-row-text: #1f2937;
  --portal-table-row-hover-bg: var(--jp-surface-subtle);
  --portal-table-border: #e5e7eb;

  /* Content area & card extras */
  --portal-content-bg: var(--jp-surface-subtle);
  --portal-card-muted: var(--jp-text-muted);
  --portal-card-icon-bg: rgba(134, 31, 84, 0.08);
  --portal-login-card-text: var(--jp-text);

  /* Status colours */
  --portal-success: #047857;
  --portal-warning: #d97706;
  --portal-danger: #b91c1c;
  --portal-info: var(--jp-blue);
}

/*
 * Universal theme entry (Phase B): consumer styles live in portal.css.
 * Global shell (header, .jp-main, buttons, modals, etc.) references the tokens above.
 * Primary nav link markup: templates/shared/_portal_header_nav_links.html.
 * Header logo link: templates/shared/_portal_header_logo.html.
 * Dashboard cards + tips aside: templates/shared/_dashboard_primary_areas.html.
 * Auth jp-login-card logo + flash: templates/shared/_portal_login_card_logo.html,
 *   templates/shared/_portal_login_flash_alerts.html.
 * Tools / job hub shared bodies (desktop+mobile byte-identical post-header): _internal_tools_index_body.html,
 *   _work_diary_hub_body.html, _internal_tools_import_body.html, _job_dashboard_body.html, _tools_index_body.html.
 * Admin shared bodies: _admin_index_body.html, _admin_audit_body.html, _admin_settings_body.html, _admin_users_body.html.
 * Staff shared bodies: _staff_index_body.html, _staff_org_body.html, _staff_profile_body.html, _staff_leave_body.html,
 *   _staff_certs_body.html, _staff_edit_body.html, _staff_summary_body.html.
 * Internal tools / trackers (batch — reports + ceiling): _internal_tools_reports_store_body.html,
 *   _internal_tools_reports_index_body.html, _ceiling_tracker_body.html.
 * Internal tools / trackers (batch — record + sales + diary + schedule): _internal_tools_record_body.html,
 *   _sales_tracker_body.html, _work_diary_entry_body.html, _works_schedule_week_body.html.
 * Intentionally NOT deduped into a shared *_body.html (desktop vs mobile post-header slices differ; inline/dynamic
 *   report UI): internal_tools_attendance_record.html — do not extract in this phase; keep D/M padding as-is.
 * CCTV QUIC report (/tools/cctv-quic-report): intentionally skipped from theme/structure centralisation — high-risk
 *   integration (portal.css .cctv-*, documents-explorer.css + jp_documents_folder_picker.js, site_marker folder API,
 *   export/photos JS, autosave, inline scripts, XLSX routes). Do not refactor without explicit approval.
 * Do not rebind tokens in a way that changes computed styles without a full visual regression pass.
 */