/*
Theme Name: HTML5Games.dev
Theme URI: https://html5games.dev
Author: HTML5Games.dev
Author URI: https://html5games.dev
Description: A premium, dark-mode game studio theme for showcasing HTML5 browser games. Built for speed, SEO, Core Web Vitals and AdSense. Features a custom "games" post type, glassmorphism UI, neon gradients and SEO-ready single-game pages.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: html5games
Tags: dark-mode, games, portfolio, custom-post-type, responsive, seo
*/

/*
  This file holds the theme header (required by WordPress) and the design tokens.
  The full component styles live in assets/css/main.css (enqueued from functions.php)
  to keep render-blocking CSS lean and cacheable.
*/

:root {
  /* Core surface palette — near-black tech navy */
  --bg:            #070A14;
  --bg-2:          #0B1020;
  --surface:       #11172B;
  --surface-2:     #161E38;
  --border:        rgba(148, 163, 184, 0.14);
  --border-strong: rgba(148, 163, 184, 0.28);

  /* Text */
  --text:          #F8FAFC;
  --text-dim:      #C2CBDA;
  --text-muted:    #8A95AC;

  /* Accents */
  --blue:          #2563EB;
  --electric:      #38BDF8;
  --purple:        #7C3AED;
  --cyan:          #06B6D4;
  --orange:        #FB923C;
  --pink:          #F43F5E;
  --green:         #22C55E;

  /* Gradients */
  --grad-primary:  linear-gradient(135deg, #7C3AED 0%, #2563EB 50%, #06B6D4 100%);
  --grad-warm:     linear-gradient(135deg, #FB923C 0%, #F43F5E 100%);
  --grad-cool:     linear-gradient(135deg, #22C55E 0%, #06B6D4 100%);
  --grad-text:     linear-gradient(90deg, #38BDF8 0%, #7C3AED 60%, #F43F5E 100%);

  /* Glass */
  --glass-bg:      rgba(17, 23, 43, 0.55);
  --glass-border:  rgba(148, 163, 184, 0.18);
  --glass-blur:    16px;

  /* Glow shadows */
  --glow-blue:     0 0 0 1px rgba(56,189,248,0.25), 0 12px 40px -12px rgba(37,99,235,0.55);
  --glow-purple:   0 0 0 1px rgba(124,58,237,0.30), 0 12px 40px -12px rgba(124,58,237,0.55);
  --shadow-card:   0 18px 50px -20px rgba(0,0,0,0.75);

  /* Layout */
  --maxw:          1200px;
  --radius:        18px;
  --radius-sm:     12px;
  --radius-pill:   999px;
  --gap:           clamp(1rem, 2vw, 1.6rem);

  /* Type */
  --font-sans:     'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-mono:     'JetBrains Mono', 'SFMono-Regular', ui-monospace, monospace;
}