/*
Theme Name: Hello Elementor Child V2
Theme URI: https://happybuddha.llc/
Description: Happy Buddha child theme - restructured architecture with modular functions, design tokens, organized CSS/JS
Author: VITA Group
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child-v2
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
*/

/* ============================================================
   Happy Buddha Design Tokens
   ============================================================ */

:root {
  /* ── Brand Colors ── */
  --hb-cream: #fff5f0;
  --hb-cream-dark: #ffe8db;
  --hb-brown: #3d2b1f;
  --hb-brown-muted: rgba(61, 43, 31, 0.5);
  --hb-brown-light: rgba(61, 43, 31, 0.4);
  --hb-green: #4b6b44;
  --hb-amber: #b87d2b;
  --hb-amber-light: #d48a28;
  --hb-red: #d81f29;
  --hb-gold: #f9b617;
  --hb-white: #fff;

  /* ── Gradients ── */
  --hb-gradient-video-overlay: linear-gradient(
    to bottom,
    rgba(216, 31, 41, 0.8) 25%,
    rgba(249, 182, 23, 0.8)
  );
  --hb-gradient-slide-dark: radial-gradient(
    ellipse at center,
    rgba(0, 0, 0, 0.35) 0%,
    rgba(0, 0, 0, 0.65) 60%,
    rgba(0, 0, 0, 0.85) 100%
  );

  --hb-gradient-slide-brand: linear-gradient(180deg, #d81f29 25%, #f9b617 100%);
  --hb-gradient-card: linear-gradient(170.98deg, #fff5f0 0%, #ffe8db 100%);

  /* ── Text ── */
  --hb-text-dark: #3d2b1f;
  --hb-text-muted: rgba(61, 43, 31, 0.5);
  --hb-text-light: rgba(255, 255, 255, 0.6);
  --hb-text-lighter: rgba(255, 255, 255, 0.7);

  /* ── Typography ── */
  --hb-font-title: "Trajan Pro", "Trajan Pro 3", Georgia, serif;
  --hb-font-body: "Plus Jakarta Sans", sans-serif;
  --hb-font-heading: "Crimson Pro", serif;
  --hb-font-poppins: "Poppins", sans-serif;

  /* ── Font Sizes ── */
  --hb-font-size-xs: 12px;
  --hb-font-size-sm: 13px;
  --hb-font-size-base: 14px;
  --hb-font-size-md: 16px;
  --hb-font-size-lg: 18px;
  --hb-font-size-xl: 24px;
  --hb-font-size-2xl: 42px;
  --hb-font-size-3xl: 48px;

  /* ── Font Weights ── */
  --hb-font-weight-normal: 400;
  --hb-font-weight-medium: 500;
  --hb-font-weight-semibold: 600;
  --hb-font-weight-bold: 700;

  /* ── Layout ── */
  --hb-header-top-height: 32px;
  --hb-header-main-height: 96px;
  --hb-header-height: 128px;
  --hb-footer-height: 100px;
  --hb-page-max-width: 1536px;
  --hb-page-padding: 32px;
  --hb-page-padding-mobile: 16px;

  /* ── Card ── */
  --hb-card-radius: 16px;
  --hb-card-radius-lg: 24px;
  --hb-card-padding: 24px;
  --hb-card-padding-lg: 48px;

  /* ── Shadows ── */
  --hb-shadow-sm: 0 4px 6px rgba(0, 0, 0, 0.1);
  --hb-shadow-md: 0 10px 15px rgba(0, 0, 0, 0.1);
  --hb-shadow-lg: 0 20px 25px rgba(0, 0, 0, 0.1), 0 8px 10px rgba(0, 0, 0, 0.1);

  /* ── Transitions ── */
  --hb-transition-fast: 0.15s ease;
  --hb-transition-normal: 0.2s ease;

  /* ── Form Inputs ── */
  --hb-input-height: 40px;
  --hb-input-padding-x: 16px;
  --hb-input-border-color: rgba(61, 43, 31, 0.1);
  --hb-input-border-radius: 14px;
  --hb-input-focus-color: var(--hb-amber-light);
  --hb-input-placeholder-color: rgba(61, 43, 31, 0.3);
  --hb-label-color: rgba(61, 43, 31, 0.7);

  /* ── Breakpoints (for reference, use in media queries) ── */
  /* --hb-breakpoint-mobile: 768px; */
  /* --hb-breakpoint-tablet: 1024px; */
}
