/*
Theme Name: Business Plan South Africa
Theme URI: https://businessplansouthafrica.co.za
Author: Business Plan South Africa
Author URI: https://businessplansouthafrica.co.za
Description: A premium, investor-focused WordPress theme for selling business plans, financial models, feasibility studies and funding-ready advisory documents. Built for corporate credibility with a KPMG-inspired identity, full Gutenberg/Elementor/WooCommerce compatibility, custom post types, advanced search, schema markup, dark mode and Core Web Vitals optimisation.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: business-plan-sa
Tags: business, corporate, finance, custom-post-types, custom-colors, custom-menu, featured-images, footer-widgets, translation-ready, full-width-template, threaded-comments, blog, e-commerce
*/

/* =========================================================================
   DESIGN SYSTEM — Design tokens
   The full component layer lives in assets/css/main.css & components.css.
   This file carries the required WP theme header + the root token system so
   the theme degrades gracefully even if asset enqueues are filtered.
   ========================================================================= */

:root {
  /* Brand palette (KPMG-inspired) */
  --bpsa-blue-primary: #00338D;
  --bpsa-blue-secondary: #005EB8;
  --bpsa-blue-accent: #0091DA;
  --bpsa-blue-light: #D9E8F5;
  --bpsa-grey-dark: #333333;
  --bpsa-grey-light: #F5F7FA;
  --bpsa-white: #FFFFFF;

  /* Semantic tokens — light mode */
  --bpsa-bg: #FFFFFF;
  --bpsa-bg-alt: #F5F7FA;
  --bpsa-surface: #FFFFFF;
  --bpsa-surface-raised: #FFFFFF;
  --bpsa-text: #1A2233;
  --bpsa-text-muted: #5A6478;
  --bpsa-text-inverse: #FFFFFF;
  --bpsa-heading: #00224F;
  --bpsa-border: #E2E8F2;
  --bpsa-border-strong: #C5D2E6;
  --bpsa-link: #005EB8;
  --bpsa-link-hover: #00338D;
  --bpsa-accent: #0091DA;
  --bpsa-success: #1B8A5A;
  --bpsa-warning: #C9831F;
  --bpsa-danger: #C0392B;

  /* Gradients */
  --bpsa-gradient-hero: linear-gradient(135deg, #00224F 0%, #00338D 45%, #005EB8 100%);
  --bpsa-gradient-accent: linear-gradient(120deg, #005EB8 0%, #0091DA 100%);
  --bpsa-gradient-sheen: linear-gradient(135deg, rgba(0,145,218,0.12), rgba(0,51,141,0.04));

  /* Typography */
  --bpsa-font-heading: "Inter", "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
  --bpsa-font-display: "Montserrat", "Inter", system-ui, sans-serif;
  --bpsa-font-body: "Open Sans", system-ui, -apple-system, "Segoe UI", sans-serif;

  --bpsa-fs-xs: 0.75rem;
  --bpsa-fs-sm: 0.875rem;
  --bpsa-fs-base: 1rem;
  --bpsa-fs-lg: 1.125rem;
  --bpsa-fs-xl: 1.375rem;
  --bpsa-fs-2xl: 1.75rem;
  --bpsa-fs-3xl: 2.25rem;
  --bpsa-fs-4xl: 3rem;
  --bpsa-fs-5xl: clamp(2.6rem, 5vw + 1rem, 4.25rem);

  --bpsa-lh-tight: 1.12;
  --bpsa-lh-snug: 1.3;
  --bpsa-lh-base: 1.65;

  --bpsa-fw-regular: 400;
  --bpsa-fw-medium: 500;
  --bpsa-fw-semibold: 600;
  --bpsa-fw-bold: 700;
  --bpsa-fw-extra: 800;

  /* Spacing scale (8pt) */
  --bpsa-space-1: 0.25rem;
  --bpsa-space-2: 0.5rem;
  --bpsa-space-3: 0.75rem;
  --bpsa-space-4: 1rem;
  --bpsa-space-5: 1.5rem;
  --bpsa-space-6: 2rem;
  --bpsa-space-7: 3rem;
  --bpsa-space-8: 4rem;
  --bpsa-space-9: 6rem;
  --bpsa-space-10: 8rem;

  /* Radius */
  --bpsa-radius-sm: 6px;
  --bpsa-radius: 12px;
  --bpsa-radius-lg: 18px;
  --bpsa-radius-xl: 28px;
  --bpsa-radius-pill: 999px;

  /* Shadows */
  --bpsa-shadow-xs: 0 1px 2px rgba(0, 34, 79, 0.06);
  --bpsa-shadow-sm: 0 2px 10px rgba(0, 34, 79, 0.07);
  --bpsa-shadow: 0 12px 30px -12px rgba(0, 34, 79, 0.18);
  --bpsa-shadow-lg: 0 28px 60px -22px rgba(0, 34, 79, 0.28);
  --bpsa-shadow-accent: 0 16px 40px -16px rgba(0, 145, 218, 0.45);

  /* Layout */
  --bpsa-container: 1200px;
  --bpsa-container-wide: 1380px;
  --bpsa-container-narrow: 760px;
  --bpsa-header-h: 84px;

  /* Motion */
  --bpsa-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --bpsa-dur: 0.45s;
  --bpsa-dur-fast: 0.22s;
}

/* Dark mode tokens — toggled via [data-theme="dark"] on <html> */
[data-theme="dark"] {
  --bpsa-bg: #0C1320;
  --bpsa-bg-alt: #121C2E;
  --bpsa-surface: #131E30;
  --bpsa-surface-raised: #18253B;
  --bpsa-text: #E6ECF5;
  --bpsa-text-muted: #9FAFC6;
  --bpsa-text-inverse: #0C1320;
  --bpsa-heading: #FFFFFF;
  --bpsa-border: #243450;
  --bpsa-border-strong: #2F436A;
  --bpsa-link: #5BB6EC;
  --bpsa-link-hover: #8FD0F5;
  --bpsa-blue-light: #16314F;
  --bpsa-grey-light: #121C2E;
  --bpsa-gradient-sheen: linear-gradient(135deg, rgba(0,145,218,0.18), rgba(0,51,141,0.05));
  --bpsa-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.4);
  --bpsa-shadow-sm: 0 2px 12px rgba(0, 0, 0, 0.45);
  --bpsa-shadow: 0 16px 36px -14px rgba(0, 0, 0, 0.6);
  --bpsa-shadow-lg: 0 30px 64px -22px rgba(0, 0, 0, 0.7);
}

/* Honour OS preference when the user hasn't chosen explicitly */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]):not([data-theme="dark"]) {
    --bpsa-bg: #0C1320;
    --bpsa-bg-alt: #121C2E;
    --bpsa-surface: #131E30;
    --bpsa-surface-raised: #18253B;
    --bpsa-text: #E6ECF5;
    --bpsa-text-muted: #9FAFC6;
    --bpsa-text-inverse: #0C1320;
    --bpsa-heading: #FFFFFF;
    --bpsa-border: #243450;
    --bpsa-border-strong: #2F436A;
    --bpsa-link: #5BB6EC;
    --bpsa-link-hover: #8FD0F5;
    --bpsa-blue-light: #16314F;
    --bpsa-grey-light: #121C2E;
  }
}