/* ============================================
   L&K ELECTRICAL - TOKEN BRIDGE (block theme)

   The real source of truth for this theme is theme.json, which exposes
   colours as --wp--preset--color--*. The shared component CSS
   (catalogue.css, landing.css - byte-identical to the Astra child's)
   is written against --lk-* tokens.

   This file maps one to the other, so a single set of component styles
   works in both themes. Fallbacks are the literal brand values, so the
   CSS still renders correctly if theme.json ever fails to load.
   ============================================ */

:root {
    /* ---- Brand reds ---- */
    --lk-primary:        var(--wp--preset--color--lk-primary, #C62828);
    --lk-secondary:      var(--wp--preset--color--lk-secondary, #8B1F1F);
    --lk-accent:         var(--wp--preset--color--lk-accent, #D32F2F);
    --lk-accent-bright:  var(--wp--preset--color--lk-accent-bright, #E53935);

    /* ---- Dark base ---- */
    --lk-bg-dark:        var(--wp--preset--color--lk-bg-dark, #1a1a1a);
    --lk-bg-darker:      var(--wp--preset--color--lk-bg-darker, #0d0d0d);
    --lk-bg-panel:       var(--wp--preset--color--lk-bg-panel, #232323);
    --lk-bg-panel-hover: #2c2c2c;

    /* ---- Text ---- */
    --lk-text-light:     var(--wp--preset--color--lk-text-light, #ffffff);
    --lk-text-mid:       var(--wp--preset--color--lk-text-mid, #e0e0e0);
    --lk-text-dim:       var(--wp--preset--color--lk-text-dim, #9a9a9a);

    /* ---- Lines ---- */
    --lk-border:         var(--wp--preset--color--lk-border, #333333);
    --lk-border-light:   #3d3d3d;
    --lk-grid-line:      rgba(211, 47, 47, 0.15);

    /* ---- Typography ---- */
    --lk-font-heading: var(--wp--preset--font-family--lk-heading, 'Archivo Black', Impact, sans-serif);
    --lk-font-body:    var(--wp--preset--font-family--lk-body, 'Work Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif);

    /* ---- Spacing ---- */
    --lk-space-xs: 0.25rem;
    --lk-space-sm: 0.5rem;
    --lk-space-md: 1rem;
    --lk-space-lg: 1.5rem;
    --lk-space-xl: 2rem;

    /* ---- Radius / shadow ---- */
    --lk-radius-sm: 3px;
    --lk-radius-md: 6px;
    --lk-shadow:    0 2px 8px rgba(0, 0, 0, 0.35);

    --lk-transition: 0.18s ease;
}