/**
 * Fiber Direkt — Shared Theme Utilities
 *
 * Extracts the repeated sectionBgMap / headingColor / bodyColor logic
 * that was duplicated across 15+ block components into a single source of truth.
 *
 * Usage in any block:
 *   import { sectionBg, isExplicitDark, headingColor, bodyColor, mutedColor } from '@/utilities/fdTheme'
 *
 *   const bg   = sectionBg(sectionBackground)
 *   const dark = isExplicitDark(sectionBackground)
 *   const hClr = headingColor(dark)
 */

/* ── Section backgrounds ─────────────────────────────────────────────── */

const sectionBgMap: Record<string, string> = {
  white:        'bg-white dark:bg-fd-navy',
  gray:         'bg-fd-gray-light dark:bg-fd-navy',
  navy:         'bg-fd-navy',
  yellow:       'bg-fd-yellow',
  navyGradient: 'bg-gradient-to-br from-fd-navy via-fd-navy-700 to-fd-navy',
  transparent:  'bg-transparent',
}

export const sectionBg = (bg?: string | null): string =>
  sectionBgMap[bg || 'white'] || sectionBgMap.white

/* ── Dark detection ──────────────────────────────────────────────────── */

export const isExplicitDark = (bg?: string | null): boolean =>
  bg === 'navy' || bg === 'navyGradient'

/* ── Text colors ─────────────────────────────────────────────────────── */

/** Heading: yellow on dark, navy on light (auto-adapts to OS dark mode) */
export const headingColor = (dark: boolean): string =>
  dark ? 'text-fd-yellow' : 'text-fd-navy dark:text-fd-yellow'

/** Body: white on dark, navy on light */
export const bodyColor = (dark: boolean): string =>
  dark ? 'text-white' : 'text-fd-navy dark:text-white'

/** Muted / secondary body text */
export const mutedColor = (dark: boolean): string =>
  dark ? 'text-white/60' : 'text-fd-navy/60 dark:text-white/60'

/** Subdued body (80% opacity) */
export const bodySubduedColor = (dark: boolean): string =>
  dark ? 'text-white/80' : 'text-fd-navy/80 dark:text-white/80'

/** Border color */
export const borderColor = (dark: boolean): string =>
  dark ? 'border-white/20' : 'border-fd-navy/10 dark:border-white/20'

/** Link color */
export const linkColor = (dark: boolean): string =>
  dark
    ? 'underline underline-offset-2 hover:text-fd-yellow transition-colors'
    : 'underline underline-offset-2 hover:text-fd-navy dark:hover:text-fd-yellow transition-colors'

/** Label text (for form labels etc.) */
export const labelColor = (dark: boolean): string =>
  dark ? 'text-white' : 'text-fd-navy dark:text-white'

/** Error text */
export const errorColor = (dark: boolean): string =>
  dark ? 'text-red-300' : 'text-red-600 dark:text-red-300'

/* ── Responsive border-radius ────────────────────────────────────────── */

/** Signature FD card radius — responsive so 375px screens don't get capsule cards */
export const fdCardRadius = 'rounded-[32px] md:rounded-[50px] lg:rounded-[70px]'

/** Smaller radius for sub-elements (images inside cards, data tables, etc.) */
export const fdCardRadiusSm = 'rounded-[20px] md:rounded-[30px] lg:rounded-[40px]'

/* ── Layout ───────────────────────────────────────────────────────────── */

/** Standard page container — max width + horizontal padding */
export const fdContainer = 'max-w-[1200px] mx-auto px-6 md:px-8'

/* ── Overlay utilities ────────────────────────────────────────────────── */

/** Sepia colour overlay for images */
export const fdSepiaOverlay = 'bg-fd-sepia/30'