/*
 Theme Name:   Paint it Black
 Theme URI:    https://makeitcount.hu
 Description:  MakeItCount dark theme — Hello Elementor child theme. Brand Guideline v2: Anton + Open Sans, #FDD804 yellow, #8511FF purple, #0B1012 dark background.
 Author:       MakeItCount (Apex Strategies Kft.)
 Author URI:   https://makeitcount.hu
 Template:     hello-elementor
 Version:      2.13.3
 License:      GNU General Public License v2 or later
 License URI:  https://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  paint-it-black
 Domain Path:  /languages
*/

/* =============================================
   DESIGN TOKENS — Single source of truth
   Dark theme v2 as default (not scoped).
   ============================================= */

:root {

	/* === COLORS — Brand === */
	--mic-yellow:          #FDD804;
	--mic-yellow-hover:    #FFE94D;
	--mic-yellow-glow:     rgba(253, 216, 4, 0.15);
	--mic-purple:          #8511FF;
	--mic-purple-hover:    #9D3FFF;
	--mic-purple-glow:     rgba(133, 17, 255, 0.15);
	--mic-black:           #0B1012;
	--mic-white:           #FFFFFF;

	/* === COLORS — Dark surface hierarchy === */
	--mic-bg-page:         #0B1012;
	--mic-bg-card:         #1C1D1F;
	--mic-bg-card-hover:   #242526;
	--mic-bg-card-nested:  #151617;
	--mic-bg-block:        #333333;
	--mic-bg-elevated:     var(--mic-bg-card);

	/* === COLORS — Dark text hierarchy === */
	--mic-text-primary:    #FFFFFF;
	--mic-text-secondary:  #E6E6E6;
	--mic-text-muted:      #808080;

	/* === COLORS — Borders === */
	--mic-border:          #4E4E4E;
	--mic-border-subtle:   rgba(255, 255, 255, 0.04);

	/* === COLORS — Neutral scale (dark-mode) === */
	--mic-gray-50:         #171717;
	--mic-gray-100:        #262626;
	--mic-gray-200:        #333333;
	--mic-gray-300:        #404040;
	--mic-gray-400:        #525252;
	--mic-gray-500:        #737373;
	--mic-gray-600:        #A3A3A3;
	--mic-gray-700:        #CDCFCF;
	--mic-gray-800:        #E5E5E5;
	--mic-gray-900:        #FAFAFA;

	/* === COLORS — Semantic (dark-adjusted) === */
	--mic-success:         #10B981;
	--mic-success-bg:      rgba(16, 185, 129, 0.08);
	--mic-warning:         #EAB308;
	--mic-warning-bg:      rgba(234, 179, 8, 0.08);
	--mic-error:           #C52F2F;
	--mic-error-bg:        rgba(197, 47, 47, 0.1);
	--mic-info:            #3B82F6;
	--mic-info-bg:         rgba(59, 130, 246, 0.08);

	/* === TYPOGRAPHY — Families (v2 guideline) === */
	--mic-font-display:    'Anton', sans-serif;
	--mic-font-body:       'Open Sans', sans-serif;

	/* === TYPOGRAPHY — Scale (1.25 ratio) === */
	--mic-text-xs:         0.75rem;     /* 12px */
	--mic-text-sm:         0.875rem;    /* 14px */
	--mic-text-base:       1rem;        /* 16px */
	--mic-text-lg:         1.125rem;    /* 18px */
	--mic-text-xl:         1.25rem;     /* 20px */
	--mic-text-2xl:        1.5rem;      /* 24px */
	--mic-text-3xl:        1.875rem;    /* 30px */
	--mic-text-4xl:        2.25rem;     /* 36px */
	--mic-text-5xl:        3rem;        /* 48px */
	--mic-text-6xl:        3.75rem;     /* 60px */

	/* === TYPOGRAPHY — Line heights === */
	--mic-leading-tight:    1.2;
	--mic-leading-snug:     1.375;
	--mic-leading-normal:   1.5;
	--mic-leading-relaxed:  1.625;

	/* === TYPOGRAPHY — Weights === */
	--mic-font-normal:     400;
	--mic-font-medium:     500;
	--mic-font-semibold:   600;
	--mic-font-bold:       700;
	--mic-font-extrabold:  800;

	/* === SPACING — 8px grid === */
	--mic-space-0:   0;
	--mic-space-1:   0.25rem;   /*  4px */
	--mic-space-2:   0.5rem;    /*  8px */
	--mic-space-3:   0.75rem;   /* 12px */
	--mic-space-4:   1rem;      /* 16px */
	--mic-space-5:   1.25rem;   /* 20px */
	--mic-space-6:   1.5rem;    /* 24px */
	--mic-space-8:   2rem;      /* 32px */
	--mic-space-10:  2.5rem;    /* 40px */
	--mic-space-12:  3rem;      /* 48px */
	--mic-space-16:  4rem;      /* 64px */
	--mic-space-20:  5rem;      /* 80px */
	--mic-space-24:  6rem;      /* 96px */

	/* === BORDERS === */
	--mic-radius-sm:       4px;
	--mic-radius-md:       8px;
	--mic-radius-lg:       12px;
	--mic-radius-xl:       16px;
	--mic-radius-2xl:      24px;
	--mic-radius-full:     9999px;
	--mic-radius-card:     16px;
	--mic-radius-button:   8px;

	/* === SHADOWS (dark bg optimized) === */
	--mic-shadow-sm:       0 2px 4px rgba(0, 0, 0, 0.2);
	--mic-shadow-md:       0 4px 12px rgba(0, 0, 0, 0.3);
	--mic-shadow-lg:       0 8px 24px rgba(0, 0, 0, 0.35);
	--mic-shadow-xl:       0 12px 48px rgba(0, 0, 0, 0.5);
	--mic-shadow-card:     0 8px 32px rgba(0, 0, 0, 0.4);
	--mic-shadow-card-hover: 0 12px 48px rgba(0, 0, 0, 0.55);

	/* === TRANSITIONS === */
	--mic-transition-fast:    0.15s ease;
	--mic-transition-normal:  250ms ease-in-out;
	--mic-transition-slow:    0.35s cubic-bezier(0.4, 0, 0.2, 1);

	/* === LAYOUT === */
	--mic-container-max:   1200px;
	--mic-container-wide:  1440px;
	--mic-container-pad:   1.5rem;

	/* === Z-INDEX === */
	--mic-z-dropdown:  1000;
	--mic-z-sticky:    1020;
	--mic-z-overlay:   1040;
	--mic-z-modal:     1060;
	--mic-z-toast:     1080;
}
