/*
 Theme Name:   Blocksy Art Child
 Theme URI:    https://yoursite.com
 Description:  Child theme for Blocksy - Islamic Art E-commerce Store (WooCommerce + TranslatePress)
 Author:       Your Name
 Author URI:   https://yoursite.com
 Template:     blocksy
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  blocksy-art-child
*/

/* ============================================================
   CSS VARIABLES - Design System
   ============================================================ */
:root {
  /* Colors - Tadwen Art Palette */
  --color-bg:           #FAF7F2; 
  --color-bg-soft:      #F8F5F0;
  --color-bg-cream:     #FAF7F2;
  --color-accent:       #9b833c; 
  --color-accent-dark:  #d3b44e;
  --color-accent-light: #f7e7c0;
  --color-dark:         #0a4d3e; 
  --color-text:         #0a4d3e;
  --color-text-muted:   #5c7a72;
  --color-border:       #E2DDD4;
  --color-border-light: #E2DDD4;
  --color-white:        #FFFFFF;
  --color-black:        #000000;
  --color-success:      #4A7C59;
  --color-error:        #c06060;

  /* Typography */
  --font-heading: 'Cormorant Garamond', serif;
  --font-body:    'Jost', sans-serif;
  --font-arabic:  'Tajawal', sans-serif;
  --font-ui:      'Cairo', sans-serif;
  --font-logo:    'Reem Kufi Fun', sans-serif;

  /* Font Sizes */
  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-lg:   1.125rem;
  --text-xl:   1.25rem;
  --text-2xl:  1.5rem;
  --text-3xl:  1.875rem;
  --text-4xl:  2.25rem;
  --text-5xl:  3rem;
  --text-6xl:  3.75rem;

  /* Spacing */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;

  /* Border Radius */
  --radius-sm:   2px;
  --radius-base: 4px;
  --radius-md:   6px;
  --radius-lg:   8px;
  --radius-full: 9999px;

  /* Shadows */
  --shadow-sm:  0 1px 3px rgba(0,0,0,0.06);
  --shadow-md:  0 4px 16px rgba(0,0,0,0.10);
  --shadow-lg:  0 8px 32px rgba(0,0,0,0.14);
  --shadow-xl:  0 16px 48px rgba(0,0,0,0.16);

  /* Transitions */
  --transition-fast:   0.15s ease;
  --transition-base:   0.3s ease;
  --transition-slow:   0.5s ease;

  /* Container */
  --container-max:  1280px;
  --container-pad:  clamp(1rem, 4vw, 2rem);
}