/**
 * 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: "#003762", // Main brand color (navy blue)
      secondary: "#E12121", // Secondary brand color (blue)
      tertiary: "#003762", // Tertiary brand color (bright blue)
    },

    accent: {
      primary: "#E12121", // Primary accent (orange)
      secondary: "#FFB920", // Secondary accent (warm charcoal)
      tertiary: "#E12121", // Tertiary accent (warm charcoal light)
      quaternary: "#FFB920", // Quaternary accent (red)
    },

    neutrals: {
      white: "#ffffff", // White - BGs
      lightColor: "#F4F4F4", // Light Color - BGs
      lightGray: "#F4F4F4", // Light Gray - BGs
      mediumGray: "#A0A0A0", // Medium Gray - Text
      darkGray: "#1C1C1A", // Dark Gray - Text
      black: "#000000", // Black
    },

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

    // Trigger/Hover states
    trigger: {
      primary: "#2e69a6", // Primary trigger/hover state
      secondary: "#cb5b24", // Secondary trigger/hover state
      tertiary: "#bf8c50", // Tertiary trigger/hover state
      quaternary: "#c91c1c", // Quaternary trigger/hover state
    },

    // LEGACY: Hover states (kept for backward compatibility)
    hover: {
      primary: "#B31B1B", // brand.primary hover state (darker red)
      secondary: "#002A4A", // accent.primary hover state (orange navy)
      tertiary: "#F4F4F4", // accent.secondary hover state (darker green)
      quaternary: "#D69900", // accent.tertiary hover state (darker yellow)
      "accent-secondary": "#3d7e33", // Button/Tertiary/Hover from Figma
    },

    button: {
      primary: "#E12121", // Button/Primary/Default
      secondary: "#003762", // Button/Secondary/Default
      tertiary: "#FFB920", // Button/Tertiary/Default
      // quaternary moved to missing section below
    },

    buttonHover: {
      primary: "#c91c1c", // Button/Primary/Hover
      secondary: "#002A4A", // Button/Secondary/Hover
      tertiary: "#D69900", // Button/Tertiary/Hover
    },

    border: {
      primary: "#e5e7eb", // Border/Primary
    },

    // ====================================
    // MISSING FIGMA VARIABLES (v1.2.0)
    // ====================================
    // Button quaternary system
    buttonQuaternary: {
      default: "#B21e1e", // Button/Quaternary/Default
      hover: "#B21e1e", // Button/Quaternary/Hover
    },

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

    // Medium text variants
    textMedium: {
      primary: "#1C1C1A", // Text/Paragraph/Primary
      headingPrimary: "#003762", // Text/Heading/Primary
      heading: "#747474", // Text/Heading/Base/Medium
      paragraph: "#747474", // Text/Paragraph/Medium
      paragraphMediumDark: "#555555", // Text/Paragraph/Medium-Dark (product-grid card stats)
      linkDark: "#003762", // Text/Link/Dark
    },

    // Extended organism backgrounds
    organismExtended: {
      medium: "#3679be", // BG/ORG/All Others/Medium
      lightColor: "#f1f1fd", // BG/ORG/All Others/Light Color
      bwTextLight: "#f1f1f1", // BG/ORG/BWs/Text Overlay/Light
    },

    // Molecule components
    molecules: {
      snipeTertiary: "#003762", // Molecules/Snipe/Tertiary (brand primary navy)
      snipePrimary: "#003762", // Molecules/Snipe/Primary (brand primary navy)
      snipeSecondary: "#003762", // Molecules/Snipe/Secondary (brand primary navy)
      paginationSelected: "#e2672a", // Molecules/Pagination BG/Tailwind/Selected
      paginationDeselected: "#ffffff", // Molecules/Pagination BG/Tailwind/Deselected
      borderPrimary: "#9CA3AF", // Molecules/Borders/Primary
    },
  },

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

  fonts: {
    primary: {
      name: "Source Sans 3",
      family: ['"Source Sans 3"', "sans-serif"],
      // Variable font - supports weight range 200-900
      // Loaded via Google Fonts
      isVariable: true,
      weights: {
        extralight: 200,
        light: 300,
        regular: 400,
        medium: 500,
        semibold: 600,
        bold: 700,
        extrabold: 800,
        black: 900,
      },
    },

    secondary: {
      name: "Source Sans 3",
      family: ['"Source Sans 3"', "sans-serif"],
      // Variable font - supports weight range 200-900
      // Loaded via Google Fonts
      isVariable: true,
      weights: {
        extralight: 200,
        light: 300,
        regular: 400,
        medium: 500,
        semibold: 600,
        bold: 700,
        extrabold: 800,
        black: 900,
      },
    },

    // 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: "Source Sans 3",
      family: ['"Source Sans 3"', "sans-serif"],
      // Variable font - supports weight range 200-900
      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
    },

    // 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
      selectedText: "#3679be", // Tab/Text/Selected
      unselectedText: "#f8f8f8", // Tab/Text/Unselected
    },

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

    organisms: {
      // BW (Box/Text Overlay) Components
      bwBoxOverlay: "#1a428a", // BG/ORG/BW/Box Overlay (90% opacity applied in CSS)
      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
      featuredMediaLight: "#f8f8f8", // BG/ORG/Featured Media/Light

      // Split Content Components
      splitContentLight: "#f8f8f8", // BG/ORG/Split Content/Light
      splitContentDark: "#001e61", // BG/ORG/Split Content/Dark
      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/sjv-logo.webp",
      secondary: "/assets/build/images/sjv-logo.webp",
      white: "/assets/build/images/sjv-logo.webp",
    },

    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: "Bokka Homes", // Update per client
    tagline: "Building Excellence, Creating Community",

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

    // Social media (if applicable)
    // Set URLs per client. Empty string = hidden in footer.
    social: {
      facebook: "https://www.facebook.com/sjvhomes",
      instagram: "https://www.instagram.com/sanjoaquinvalleyhomes/",
      linkedin: "https://www.linkedin.com/company/sjvhomes",
      twitter: "https://twitter.com/SJVHomes"
    }
  },

  // ====================================
  // COLLECTIONS
  // ====================================
  // Collection system configuration (e.g., home collections)
  // Update for each client's product groupings

  collections: {
    items: [
      {
        name: "Essentials",
        slug: "essentials",
        path: "/our-homes/home-collections/essentials-collection",
        description: "",
      },
      {
        name: "Select",
        slug: "select",
        path: "/our-homes/home-collections/select-collection",
        description: "",
      },
      {
        name: "Signature",
        slug: "signature",
        path: "/our-homes/home-collections/signature-collection",
        description: "",
      },
      {
        name: "Executive",
        slug: "executive",
        path: "/our-homes/home-collections/executive-collection",
        description: "",
      },
    ],
    mediaTypes: ["exterior", "interior", "video", "tour"],
    urlPattern: "/our-homes/home-collections/{slug}-collection",
    // Default collection slug used when collections are disabled
    defaultSlug: "essentials",
    // Label shown in the collection filter dropdown placeholder
    filterLabel: "Home Collection",
  },

  // ====================================
  // PAGE URLS
  // ====================================
  // Key page paths used throughout templates
  // Update for each client's site structure

  pages: {
    contact: "/contact/",
    contactUs: "/contact-us/",
    realtors: "/realtors/",
    newHomeSearch: "/new-home-search/",
    myFavorites: "/my-favorites/",
    blog: "/blog/",
    home: "/",
  },

  // ====================================
  // SITE CONFIGURATION
  // ====================================
  // Site-level settings

  site: {
    // Set to production upload URL to enable image fallback (e.g., 'https://example.com/wp-content/uploads')
    // Leave empty to disable
    productionUrl: "",
  },

  // ====================================
  // MAP DEFAULTS
  // ====================================
  // Default map center and zoom when no communities are loaded
  // Update per client's geographic area

  map: {
    defaultLatitude: "36.3302",
    defaultLongitude: "-119.2921",
    defaultZoom: 10,
    minZoom: 9,
    maxZoom: 19,
  },

  // ====================================
  // PAGINATION
  // ====================================
  // Posts-per-page defaults for various listing pages

  pagination: {
    homesPerPage: 24,
    plansPerPage: 24,
    blogFilterResults: 20,
    blogArchive: 6,
    popularPosts: 5,
  },

  // ====================================
  // CONTENT
  // ====================================
  // Configurable UI text and content elements
  // Update for each client's CTA text, phone numbers, etc.

  content: {
    header: {
      ctaText: "CALL US",
      ctaTitle: "Call Us",
      ctaUrl: "/contact/", // References pages.contact
      realtorsText: "FOR REALTORS",
    },
    footer: {
      askQuestionText: "Ask a Question Now",
      visitUsText: "Visit Us",
      callUsText: "CALL US",
      phoneNumber: "(559) 732-2660",
      phoneTel: "5597322660",
      copyrightEntity: "", // Uses get_bloginfo('name') if empty
      repImage: "footer-rep.png", // "Questions?" card rep image in assets/build/images/
    },
    forms: {
      oscImage: "form-osc.jpg", // Online Sales Counselor image in assets/build/images/
      legalDisclaimer: "", // Legal text for map embeds. Uses client.name if empty.
    },
  },

  // ====================================
  // INTEGRATIONS
  // ====================================
  // Third-party service configuration
  // Set per client; empty values = disabled

  integrations: {
    hubspot: {
      portalId: "50553882", // HubSpot portal ID. Empty = disabled.
      region: "na1",
    },

    // HubSpot form IDs by usage location.
    // Each key represents a specific place a form appears in the theme.
    // ACF field overrides (per-post) take priority over these defaults when present.
    hubspotForms: {
      blog: {
        archiveBeTheFirst: "606fb133-e4fe-464d-a43b-90e96afea130", // Blog archive "Be the First" modal
        sidebarSubscribe: "4e9acc6b-91ab-4325-8fea-382369209ff5", // Blog sidebar subscribe widget
      },
      map: {
        overviewGetUpdates: "606fb133-e4fe-464d-a43b-90e96afea130", // Overview map "Get Updates" modal
        collectionGetUpdates: "606fb133-e4fe-464d-a43b-90e96afea130", // Communities-by-collection map "Get Updates" modal
      },
      community: {
        contactForm: "02c8d017-a0dd-4ac3-9410-ad3c30ff7d7d", // Single community page contact form
        beTheFirstModal: "606fb133-e4fe-464d-a43b-90e96afea130", // Single community page "Be the First" modal
      },
      event: {
        detailsModal: "606fb133-e4fe-464d-a43b-90e96afea130", // Single event page modal
      },
      home: {
        beTheFirstModal: "6696943d-9467-476d-b6e8-7aacde612afb", // Single home page "Be the First" modal
        curiousFormCta: "6696943d-9467-476d-b6e8-7aacde612afb", // Single home page "Curious about this home?" form-CTA
      },
      model: {
        beTheFirstModal: "6696943d-9467-476d-b6e8-7aacde612afb", // Single model page "Be the First" modal
      },
      plan: {
        beTheFirstModal: "dbe20caa-f2b9-408a-a260-cdb924a9c96e", // Single plan page "Be the First" modal
        becomeVipModal: "dbe20caa-f2b9-408a-a260-cdb924a9c96e", // Single plan page "Become a VIP" modal
        formCta: "dbe20caa-f2b9-408a-a260-cdb924a9c96e", // Single plan page form-CTA sidebar
      },
    },

    // HubSpot form field overrides (CSS)
    // These form IDs have CSS rules in assets/src/css/base/theme.css
    // that hide specific fields. Update both config AND CSS selectors when changing.
    hubspotFormFieldOverrides: {
      hideCollectionAndCommunities: "767c334f-0893-4757-8fa6-fd4b253bd691", // Hides collection_type + communities_of_interest
      hideCollectionType: "b9a7758f-c4c1-4c65-910d-9af6999fb707", // Hides collection_type
      hideWebsite: "906da098-a598-4b25-99c3-14c6641a26d4", // Hides website
      hideWebsiteAndLeadsource: "7ab5ef34-90a3-48c8-897d-eac47fdac277", // Hides website + leadsource
      hideCommunitiesAndLeadsource: "838f9c32-90c6-400d-b37f-a51e6e72dd96", // Hides communities_of_interest + leadsource
    },
  },

  // ====================================
  // META / SEO
  // ====================================
  // Default meta tags and SEO configuration

  meta: {
    ogImage: "meta-default.jpg", // Default OG image filename in assets/build/images/
  },

  // ====================================
  // 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;
}