/*
Theme Name: Epidermist
Theme URI: https://epidermist.com
Author: Epidermist
Author URI: https://epidermist.com
Description: A premium, minimal, elegant WordPress theme for the Epidermist skincare brand. Built for WooCommerce with Elementor compatibility.
Version: 1.0.3
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: epidermist
Tags: e-commerce, woocommerce, skincare, premium, minimal, elegant
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
*/

:root {
  /* Background Colors - Warm Luminous Cashmere & Silk */
  --ep-bg-primary: #FCF9F5;
  --ep-bg-secondary: #F6EDE2;
  --ep-bg-tertiary: #EFE4D6;
  --ep-bg-white: #FFFFFF;

  /* Text Colors - Rich Warm Espresso & Hazel */
  --ep-text-dark: #1F1712;
  --ep-text-medium: #544439;
  --ep-text-light: #8E7B6E;

  /* Accent Colors - Radiant Amber Gold & Warm Bronze matching pro.png */
  --ep-accent: #B88E58;
  --ep-accent-hover: #9E743E;
  --ep-accent-light: #F7EFE5;
  --ep-accent-glow: rgba(184, 142, 88, 0.25);
  --ep-gold: #C59B68;
  --ep-bronze: #8F6533;

  /* Border Colors */
  --ep-border: #E8DCCF;
  --ep-border-light: #F2E8DC;

  /* Footer Colors */
  --ep-footer-bg: #1B1511;
  --ep-footer-text: #BDB0A4;
  --ep-footer-heading: #FFFFFF;

  /* Status Colors */
  --ep-success: #3E7353;
  --ep-error: #B84737;
  --ep-sale: #A64B35;

  /* Typography */
  --ep-font-heading: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --ep-font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* Font Sizes */
  --ep-text-xs: 12px;
  --ep-text-sm: 14px;
  --ep-text-base: 16px;
  --ep-text-md: 18px;
  --ep-text-lg: 20px;
  --ep-text-xl: 24px;
  --ep-text-2xl: 28px;
  --ep-text-3xl: 36px;
  --ep-text-4xl: 42px;
  --ep-text-5xl: 48px;
  --ep-text-6xl: 56px;

  /* Spacing */
  --ep-section-padding: 120px;
  --ep-section-padding-tablet: 80px;
  --ep-section-padding-mobile: 60px;
  --ep-container-max: 1200px;
  --ep-container-padding: 40px;
  --ep-container-padding-mobile: 24px;
  --ep-grid-gap: 30px;

  /* Effects */
  --ep-radius-sm: 4px;
  --ep-radius-md: 8px;
  --ep-radius-lg: 12px;
  --ep-shadow-card: 0 4px 20px rgba(0, 0, 0, 0.06);
  --ep-shadow-hover: 0 8px 30px rgba(0, 0, 0, 0.10);
  --ep-transition: all 0.3s ease;

  /* Header */
  --ep-header-height: 80px;
  --ep-header-height-scrolled: 64px;
}