/*
Theme Name: گیم استور موبایل
Theme URI: https://example.com/game-store-woo
Author: Navid boutalebian
Author URI: https://example.com
Description: فروشگاه آنلاین بازی‌های موبایل با ووکامرس، بر پایه طراحی shadcn/ui و Tailwind CSS. شامل یک پایه‌ی سبک برای متغیرهای رنگ و فونت فارسی Vazirmatn.
Version: 2.3.0
Text Domain: game-store-woo
Requires at least: 6.0
Requires PHP: 7.4
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Tags: woocommerce, custom-menu, e-commerce, rtl-language-support, one-column, accessibility-ready
*/

/* ==========================================================================
   نکته مهم:
   - فایل‌های اصلی CSS از بیلد Tailwind (مثلاً /assets/app.css) لود می‌شوند.
   - فونت Vazirmatn از پوشه /fonts/ بارگذاری می‌شود.
   - پیش‌بارگذاری (preload) فونت/استایل در functions.php انجام شده است.
   - این فایل فقط پایه‌ها (tokens) و تعریف @font-face را فراهم می‌کند.
   ========================================================================== */


/* ───────────────────────────
   0) Persian/Arabic UI Font: Vazirmatn
   - اگر فونت متغیر وجود داشته باشد: یک تعریف برای بازه وزن 100 تا 900
   - در غیر این صورت: نگاشت به وزن‌های استاتیک (Thin…Black)
   - مسیرها نسبی به پوشه قالب هستند: fonts/*.woff2
   ─────────────────────────── */

/* Variable font (اولویت) */
@font-face {
  font-family: "Vazirmatn";
  src: url("fonts/Vazirmatn[wght].woff2") format("woff2-variations"),
       url("fonts/Vazirmatn[wght].woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* Static fallbacks (اگر مرورگر/فایل متغیر در دسترس نبود) */
@font-face {
  font-family: "Vazirmatn";
  src: url("fonts/Vazirmatn-Thin.woff2") format("woff2");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Vazirmatn";
  src: url("fonts/Vazirmatn-ExtraLight.woff2") format("woff2");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Vazirmatn";
  src: url("fonts/Vazirmatn-Light.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Vazirmatn";
  src: url("fonts/Vazirmatn-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Vazirmatn";
  src: url("fonts/Vazirmatn-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Vazirmatn";
  src: url("fonts/Vazirmatn-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Vazirmatn";
  src: url("fonts/Vazirmatn-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Vazirmatn";
  src: url("fonts/Vazirmatn-ExtraBold.woff2") format("woff2");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Vazirmatn";
  src: url("fonts/Vazirmatn-Black.woff2") format("woff2");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}


/* ───────────────────────────
   1) Tokens (matches app.css design tokens)
   ─────────────────────────── */
@layer base {
  :root {
    --background: 0 0% 100%;
    --foreground: 222.2 84% 4.9%;
    --card: 0 0% 100%;
    --card-foreground: 222.2 84% 4.9%;
    --popover: 0 0% 100%;
    --popover-foreground: 222.2 84% 4.9%;
    --primary: 222.2 47.4% 11.2%;
    --primary-foreground: 210 40% 98%;
    --secondary: 210 40% 96.1%;
    --secondary-foreground: 222.2 47.4% 11.2%;
    --muted: 210 40% 96.1%;
    --muted-foreground: 215.4 16.3% 46.9%;
    --accent: 187 90% 45%;
    --accent-foreground: 0 0% 100%;
    --destructive: 0 84.2% 60.2%;
    --destructive-foreground: 210 40% 98%;
    --border: 214.3 31.8% 91.4%;
    --input: 214.3 31.8% 91.4%;
    --ring: 222.2 84% 4.9%;
    --radius: .8rem;
  }
  .dark {
    --background: 0 0% 20%;
    --foreground: 0 0% 98%;
    --card: 0 0% 22%;
    --card-foreground: 0 0% 98%;
    --popover: 0 0% 15%;
    --popover-foreground: 0 0% 98%;
    --primary: 0 0% 0%;
    --primary-foreground: 0 0% 98%;
    --secondary: 0 0% 30%;
    --secondary-foreground: 0 0% 98%;
    --muted: 0 0% 30%;
    --muted-foreground: 0 0% 63.9%;
    --accent: 187 90% 45%;
    --accent-foreground: 0 0% 100%;
    --destructive: 0 62.8% 30.6%;
    --destructive-foreground: 0 0% 98%;
    --border: 0 0% 30%;
    --input: 0 0% 30%;
    --ring: 187 90% 45%;
  }
}


/* ───────────────────────────
   2) Base reset + global typography (use Vazirmatn everywhere)
   ─────────────────────────── */
@layer base {
  /* Border default & box model */
  *,
  *::before,
  *::after {
    border-color: hsl(var(--border));
    box-sizing: border-box;
  }

  html {
    box-sizing: border-box;
    -webkit-text-size-adjust: 100%;
    text-rendering: optimizeLegibility;
  }

  /* استفاده سراسری از Vazirmatn (روی تمام کنترل‌ها) */
  :root {
    --gsw-font: "Vazirmatn", system-ui, -apple-system, "Segoe UI", Roboto, Arial, "PT Sans", sans-serif;
  }

  html, body,
  button, input, select, textarea,
  .gsw-btn, .button, .woocommerce a.button, .woocommerce button.button,
  .woocommerce input.button, .wc-block-components-button {
    font-family: var(--gsw-font);
  }

  body {
    margin: 0;
    background-color: hsl(var(--background));
    color: hsl(var(--foreground));
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
    font-kerning: normal;
    line-height: 1.6;
  }

  /* وزن‌های رایج برای تیترها با فونت متغیر */
  h1, h2, h3 { font-weight: 800; }
  h4, h5, h6 { font-weight: 700; }

  /* ورودی‌ها از فونت ارث‌بری داشته باشند */
  input, select, textarea, button {
    font: inherit;
  }
}


/* ───────────────────────────
   3) RTL friendliness (بدون اجبار جهت)
   ─────────────────────────── */
/* اگر سایت RTL است، چیزی را مجبور نکن؛ فقط اطمینان از فونت */
html[dir="rtl"] body {
  font-family: var(--gsw-font);
}

/* انتخاب متن */
::selection {
  background: hsl(var(--accent) / .2);
}

/* کوچک: برای جلوگیری از FOIT در بارگذاری اولیه */
@supports (font-variation-settings: normal) {
  html { font-variation-settings: "wght" 400; }
}