/**
 * Bokka Theme Master Configuration
 *
 * This file contains the core brand variables that are likely to change
 * between different clients. Update this file to customize the theme
 * for a specific client/brand.
 *
 * These variables are used by:
 * - tailwind.config.js (for CSS classes)
 * - PHP functions (for dynamic styling)
 * - JavaScript (for runtime theming)
 */

const themeConfig = {
  // ====================================
  // CORE BRAND COLORS
  // ====================================
  // These are the main brand colors that define the client's identity
  // Update these for each client

  colors: {
    brand: {
      primary: "#001e61", // Main brand color (CAH navy blue)
      secondary: "#1a428a", // Secondary brand color (CAH blue)
      tertiary: "#3679be", // Tertiary brand color (CAH bright blue)
    },

    accent: {
      primary: "#e2672a", // Primary accent (CAH orange)
      secondary: "#a7d8f2", // Secondary accent (CAH green)
      tertiary: "#8bd1ff", // Tertiary accent (CAH light blue)
      quaternary: "#a93033", // Quaternary accent (CAH red)
    },

    neutrals: {
      white: "#ffffff", // White - BGs
      lightColor: "#f1f1f1", // Light Color - BGs
      lightGray: "#f8f8f8", // Light Gray - BGs
      mediumGray: "#898b8e", // Medium Gray - Text (CAH)
      darkGray: "#373a36", // Dark Gray - Text (CAH)
      black: "#000000", // Black
    },

    overlay: {
      primary: "#1a428a", // Brand Secondary - Opacity 90% (BW Box Overlay) (CAH)
      secondary: "#000000", // Black - Opacity 30% (BW Text Overlay)
      tertiary: "#f1f1f1", // Light Gray - Opacity 70% (CAH)
    },

    // Trigger/Hover states (CAH hover colors)
    trigger: {
      primary: "#2e69a6", // Primary trigger/hover state (CAH)
      secondary: "#cb5b24", // Secondary trigger/hover state (CAH)
      tertiary: "#bf8c50", // Tertiary trigger/hover state (keeping Cook Bros - CAH missing)
      quaternary: "#6f0912", // Quaternary trigger/hover state (keeping Cook Bros - CAH missing)
    },

    // LEGACY: Hover states (kept for backward compatibility)
    hover: {
      primary: "#001450", // brand.primary hover state (darker CAH navy)
      secondary: "#cb5b24", // accent.primary hover state (CAH orange hover)
      tertiary: "#3d7e33", // accent.secondary hover state (darker CAH green)
      quaternary: "#6fbdff", // accent.tertiary hover state (darker CAH light blue)
      "accent-secondary": "#3d7e33", // Button/Tertiary/Hover from Figma (CAH green hover)
    },

    button: {
      primary: "#2e69a6", // Button/Primary/Default (CAH orange)
      secondary: "#ffffff", // Button/Secondary/Default (CAH blue)
      tertiary: "#E2672A", // Button/Tertiary/Default (CAH orange)
      // quaternary moved to missing section below
    },

    // ====================================
    // MISSING FIGMA VARIABLES (v1.2.0)
    // ====================================
    // Button quaternary system
    buttonQuaternary: {
      default: "#a93033", // Button/Quaternary/Default (CAH red)
      hover: "#8a2528", // Button/Quaternary/Hover (darker CAH red)
    },

    // Filter system backgrounds
    filter: {
      hover: "#F8F8F8", // BG/Filter/Hover
      selection: "#FFFFFF", // BG/Filter/Selection BG
    },

    // Medium text variants
    textMedium: {
      primary: "#1e1e1e", // Text/Paragraph/Primary
      heading: "#6B7280", // Text/Heading/Base/Medium
      paragraph: "#373A36", // Text/Paragraph/Medium
      linkDark: "#3679be", // Text/Link/Dark (CAH tertiary blue)
    },

    // Extended organism backgrounds
    organismExtended: {
      medium: "#3679be", // BG/ORG/All Others/Medium (CAH tertiary blue)
      lightColor: "#f1f1fd", // BG/ORG/All Others/Light Color (CAH missing, keeping Cook Bros)
      bwTextLight: "#f1f1f1", // BG/ORG/BWs/Text Overlay/Light (CAH gray)
    },

    // Molecule components
    molecules: {
      snipeTertiary: "#1a428a", // Molecules/Snipe/Tertiary (CAH secondary blue)
      snipePrimary: "#3679be", // Molecules/Snipe/Primary
      snipeSecondary: "#e2672a", // Molecules/Snipe/Secondary (CAH orange)
      paginationSelected: "#e2672a", // Molecules/Pagination BG/Tailwind/Selected (CAH accent primary)
      paginationDeselected: "#ffffff", // Molecules/Pagination BG/Tailwind/Deselected
      borderPrimary: "#9CA3AF", // Molecules/Borders/Primary (CAH gray)
    },
  },

  // ====================================
  // TYPOGRAPHY
  // ====================================
  // Font families and their sources
  // Update these for each client's brand fonts

  fonts: {
    primary: {
      name: "Josefin Sans",
      family: ['"Josefin Sans"', "sans-serif"],
      // Variable font - supports weight range 100-700
      // Font files: JosefinSans-VariableFont_wght.*
      isVariable: true,
      weights: {
        thin: 100,
        extralight: 200,
        light: 300,
        regular: 400,
        medium: 500,
        semibold: 600,
        bold: 700,
      },
    },

    secondary: {
      name: "Akrobat",
      family: ['"Akrobat"', "sans-serif"],
      // Static fonts - only specific weights available
      // Font files: Akrobat-Light.*, Akrobat-Regular.*, Akrobat-Black.*
      isVariable: false,
      weights: {
        light: 300, // Akrobat-Light
        regular: 400, // Akrobat-Regular
        black: 900, // Akrobat-Black
      },
    },

    // Tertiary font for body text and readability
    tertiary: {
      name: "Merriweather",
      family: ['"Merriweather"', "serif"],
      // Variable font - supports weight range 300-900, optical sizing 18-144, and italic
      // Font loaded via Google Fonts
      // @import url("https://fonts.googleapis.com/css2?family=Merriweather:ital,opsz,wght@0,18..144,300..900;1,18..144,300..900&display=swap");
      isVariable: true,
      weights: {
        light: 300,
        regular: 400,
        medium: 500,
        semibold: 600,
        bold: 700,
        extrabold: 800,
        black: 900,
      },
    },

    // Utility font for decorative elements
    utility: {
      name: "Caveat",
      family: ['"Caveat"', "cursive"],
      // Variable font - supports weight range 400-700
      // Font files: Caveat-VariableFont_wght.*
      isVariable: true,
      weights: {
        regular: 400,
        medium: 500,
        semibold: 600,
        bold: 700,
      },
    },
  },

  // ====================================
  // SPACING & LAYOUT
  // ====================================
  // These usually stay consistent but can be adjusted per client

  spacing: {
    // Container max widths
    container: {
      sm: "640px",
      md: "768px",
      lg: "1024px",
      xl: "1280px",
      "2xl": "1536px",
    },

    // Semantic spacing scale (meaningful names for design system)
    custom: {
      "section-padding": "4rem", // Standard section padding
      "component-gap": "2rem", // Gap between components
      // Note: For specific pixel values, use Tailwind's arbitrary syntax: p-[12px], m-[24px], etc.
    },
  },

  // ====================================
  // COMPONENT CUSTOMIZATION
  // ====================================
  // Client-specific component styling preferences

  components: {
    buttons: {
      // Default button radius from Figma Semantic/Radius
      borderRadius: "6px", // Radius/Button

      // Button size variations
      padding: {
        small: "0.5rem 1rem",
        medium: "0.75rem 1.5rem",
        large: "1rem 2rem",
      },
    },

    cards: {
      borderRadius: "12px",
      shadow: "0 4px 6px -1px rgba(0, 0, 0, 0.1)",
    },

    forms: {
      borderRadius: "6px",
      borderColor: "#e5e7eb",
      focusColor: "#e2672a", // Usually maps to accent.primary (CAH orange)
    },

    // Complete radius system from Figma Core/Radius and Semantic/Radius
    radius: {
      // Core radius values
      small: "4px", // Radius/Small
      default: "6px", // Radius/Default
      large: "12px", // Radius/Large
      round: "9999px", // Radius/Round
      // Semantic radius mappings
      button: "6px", // Radius/Button
      card: "12px", // Radius/Card
      tab: "6px", // Radius/Tab
      pagination: "4px", // Radius/Pagination
      label: "9999px", // Radius/Label
    },

    // Advanced UI Components from Figma Design System
    tabs: {
      selectedBackground: "#f8f8f8", // Tab/Background/Selected
      unselectedBackground: "#3679be", // Tab/Background/Unselected (CAH tertiary blue)
      selectedText: "#3679be", // Tab/Text/Selected (CAH tertiary blue)
      unselectedText: "#f8f8f8", // Tab/Text/Unselected
    },

    pagination: {
      activeBackground: "#001e61", // Circle/Pagination/Active (80% opacity applied in CSS) (CAH primary)
      inactiveBackground: "#001e61", // Circle/Pagination/Inactive (20% opacity applied in CSS) (CAH primary)
    },

    organisms: {
      // BW (Box/Text Overlay) Components
      bwBoxOverlay: "#1a428a", // BG/ORG/BW/Box Overlay (90% opacity applied in CSS) (CAH secondary)
      bwTextOverlay: "#000000", // BG/ORG/BW/Text Overlay (30% opacity applied in CSS)
      bwSlant: "#f8f8f8", // BG/ORG/BW/Slant

      // Featured Media Components
      featuredMediaDark: "#001e61", // BG/ORG/Featured Media/Dark (CAH primary)
      featuredMediaLight: "#f8f8f8", // BG/ORG/Featured Media/Light

      // Split Content Components
      splitContentLight: "#f8f8f8", // BG/ORG/Split Content/Light
      splitContentDark: "#001e61", // BG/ORG/Split Content/Dark (CAH primary)
      splitContentWhite: "#ffffff", // BG/ORG/Split Content/White
    },

    // Border width system from Figma Core/Border Width
    borders: {
      "border-1": "1px", // Border Width/1
      "border-2": "2px", // Border Width/2
    },
  },

  // ====================================
  // BRAND ASSETS
  // ====================================
  // Paths to client-specific assets

  assets: {
    logo: {
      primary: "/assets/build/images/header-logo.svg",
      secondary: "/assets/build/images/header-logo.svg",
      white: "/assets/build/images/header-logo.svg",
    },

    favicon: "/assets/images/favicon.ico",

    // Default placeholder images
    placeholders: {
      hero: "/assets/images/hero-placeholder.jpg",
      property: "/assets/images/property-placeholder.jpg",
      community: "/assets/images/community-placeholder.jpg",
    },
  },

  // ====================================
  // CLIENT INFORMATION
  // ====================================
  // Basic client/brand information

  client: {
    name: "CAH Homes", // Updated for CAH client
    tagline: "Building Excellence, Creating Community",

    // Contact information (can be used in footers, contact forms, etc.)
    contact: {
      phone: "(555) 123-4567",
      email: "info@bokkahomes.com",
      address: {
        street: "123 Builder Lane",
        city: "Construction City",
        state: "CA",
        zip: "90210",
      },
    },

    // Social media (if applicable)
    social: {
      facebook: "https://facebook.com/bokkahomes",
      instagram: "https://instagram.com/bokkahomes",
      twitter: "https://twitter.com/bokkahomes",
      linkedin: "https://linkedin.com/company/bokkahomes",
    },
  },

  // ====================================
  // FEATURE FLAGS
  // ====================================
  // Enable/disable features per client

  features: {
    // UI Features
    darkModeToggle: false,
    animations: true,
    parallax: true,

    // Content Features
    blog: true,
    testimonials: true,
    virtualTours: true,
    mapIntegration: true,

    // E-commerce/Lead Gen
    favoritesList: true,
    inquiryForms: true,
    pricingDisplay: true,
  },
};

// Export for use in Node.js (Tailwind config, build scripts)
if (typeof module !== "undefined" && module.exports) {
  module.exports = themeConfig;
}

// Export for use in browsers
if (typeof window !== "undefined") {
  window.BokkaThemeConfig = themeConfig;
}