/*
Theme Name:   DIY Driver Child
Theme URI:    https://diydriver.com/
Description:  DIY Driver 子主题 —— 承接全站版式重做（front-page / archive-product / content-product / single-product）。
              父主题 Storefront 4.6.2 保持原版不动，一切改造在子主题内完成。
Author:       DIY Driver
Template:     storefront
Version:      1.0.0
License:      GNU General Public License v3 or later
License URI:  https://www.gnu.org/licenses/gpl-3.0.html
Text Domain:  dd-child
*/

/* ==========================================================================
   加载说明（重要）
   Storefront 父主题的 child_scripts()（inc/class-storefront.php:417）在
   is_child_theme() 时自动 enqueue 本文件，句柄 = storefront-child-style，
   加载顺序在父主题主 CSS 与 WooCommerce CSS 之后。
   → 所以 functions.php 里**不要**再 enqueue 本文件，否则重复加载。
   ========================================================================== */


/* ==========================================================================
   DIY Driver Design Tokens v1
   生成自 竞品研究/_design_tokens.py —— 全部关键配对已过 WCAG 2.1 对比度闸门
   （24 组配对全 PASS；为什么必须算而不用感觉：FairwayWise 出过"白底白字看不见"事故）

   色系决策（2026-09-21 Sue 拍板）：全站换深青系。
   原首页 hero 用的是深藏蓝 #0b1220→#0a3a5f + 天蓝光晕 #38bdf8 → 全部迁到青色阶。
   竞品配色实测：VIOFO #e60012 红 / 70mai #ff631b 橙 / Vantrue #fa4c06 橙 /
                WOLFBOX #fc5800 橙 / xtool.co.uk #cb0d05 红 / xtoolonline #409EFF 框架默认蓝
   → 红橙已被占满，蓝是框架默认色。深青是真空。
   ========================================================================== */

:root{

  /* --- 品牌主色阶（深青）--- */
  --dd-teal-50:  #f1f9fb;
  --dd-teal-100: #d9eff4;
  --dd-teal-200: #b3dfe9;
  --dd-teal-300: #7cc7d8;
  --dd-teal-400: #45a8bf;
  --dd-teal-500: #268ba4;
  --dd-teal-600: #1a7089;   /* ← 主强调色（能配白字，4.5:1 通过） */
  --dd-teal-700: #175c71;
  --dd-teal-800: #164b5c;   /* ← 深青底（页脚 / 深区块） */
  --dd-teal-900: #0f3843;   /* ← 最深（hero 深底） */

  /* --- 中性色阶 --- */
  --dd-n-0:   #ffffff;
  --dd-n-50:  #f7f9fa;      /* 产品图底 */
  --dd-n-100: #eef2f4;
  --dd-n-200: #dde4e7;      /* 装饰分隔线（不含义） */
  --dd-n-300: #c4d0d5;
  --dd-n-400: #62727a;      /* 占位文字（已压深至 >=4.5:1） */
  --dd-n-500: #55656d;      /* 次要文字 muted（已压深至 >=4.5:1） */
  --dd-n-600: #414f56;
  --dd-n-700: #2e3a40;
  --dd-n-800: #1f2b31;
  --dd-n-900: #101a1f;      /* 正文主色（不用纯黑，留一点温度） */

  /* --- 语义色 --- */
  --dd-sale:      #c2410c;  /* 促销/角标（压深至可配白字） */
  --dd-sale-soft: #e8590c;  /* 促销浅色版（仅配大字/深字用） */
  --dd-sale-bg:   #fff4e6;
  --dd-star:      #b8791a;  /* 星评（压深至 >=3:1） */
  --dd-star-fill: #f6a429;  /* 星评填充（VIOFO 实测值，仅作形状填充配深色描边） */
  --dd-success:   #166b3b;  /* 有货 */
  --dd-warning:   #8a6100;  /* 低库存 */
  --dd-danger:    #c92a2a;  /* 缺货/错误 */
  --dd-info:      #1a7089;

  /* --- 表面 --- */
  --dd-surface-page:    #ffffff;
  --dd-surface-sunken:  #f7f9fa;
  --dd-surface-card:    #ffffff;
  --dd-surface-dark:    #164b5c;
  --dd-surface-darkest: #0f3843;

  /* --- 语义别名（页面只用这些，不直接用色阶）--- */
  --dd-accent:        var(--dd-teal-600);
  --dd-accent-hover:  var(--dd-teal-700);
  --dd-accent-tint:   var(--dd-teal-50);
  --dd-text:          var(--dd-n-900);
  --dd-text-muted:    var(--dd-n-500);
  --dd-border:        var(--dd-n-200);
  --dd-border-input:  #7d8d94;   /* 输入框/有义边框（需 >=3:1 → 实测 3.44:1） */
  --dd-bg:            var(--dd-surface-page);
  --dd-bg-product:    var(--dd-surface-sunken);
  --dd-dark-bg:       var(--dd-teal-800);
  --dd-darkest-bg:    var(--dd-teal-900);
  --dd-on-dark:       #ffffff;
  --dd-on-dark-muted: var(--dd-teal-100);

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

  /* --- 圆角 --- */
  --dd-radius-sm:   6px;
  --dd-radius-md:   10px;
  --dd-radius-lg:   16px;
  --dd-radius-pill: 9999px;

  /* --- 字体 --- */
  --dd-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --dd-font-size: 16px;
  --dd-line: 1.6;

  /* --- 阴影 --- */
  --dd-shadow-sm: 0 1px 2px rgba(16,26,31,.06);
  --dd-shadow-md: 0 4px 12px rgba(16,26,31,.08);
  --dd-shadow-lg: 0 12px 32px rgba(16,26,31,.12);
}

/* ==========================================================================
   Phase -1 结束。本文件当前只承载 token 定义，**不含任何视觉覆盖**。
   → 激活子主题后，全站外观应与激活前逐像素一致（这是 Phase -1 的验收标准）。
   视觉覆盖自 Phase 1（首页）起，逐个加到本文件或分页型组件 CSS 里。
   ========================================================================== */
