/**
 * OMBoxOS Design Tokens — SINGLE SOURCE OF TRUTH.
 *
 * 这是全站唯一的设计令牌来源。由 ShellAsset 最先加载，admin 与 program、
 * PC 与移动端共享同一套 token。改令牌只改这里。
 *
 * 历史原因这里同时保留两套命名：
 *   - 新设计系统：--color-* / --space-* / --font-size-* / --radius-* …
 *   - 框架/遗留：--primary-color / --text-primary / --border-color / 布局尺寸 …
 * 后续命名收敛阶段会把遗留名逐步映射到新名，但现在两套都保留以免破坏引用。
 */

:root {
    /* ===== 布局尺寸（shell 骨架） ===== */
    --navbar-height: 56px;
    --sidebar-width: 240px;
    --sidebar-collapsed-width: 64px;
    --sidebar-logo-width: 184px;
    --sidebar-logo-height: 36px;
    --footer-height: 48px;

    /* ===== 标准断点（供 JS / 文档参考；@media 不能用 var()） ===== */
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
    /* 兼容旧引用 */
    --breakpoint-mobile: 768px;
    --breakpoint-tablet: 1024px;
    --breakpoint-desktop: 1400px;

    /* ===== 颜色系统（新命名 --color-*） ===== */
    --color-primary: #0087F7;
    --color-primary-hover: #0070d9;
    --color-primary-light: rgba(0, 135, 247, 0.1);

    --color-success: #00A256;
    --color-success-light: rgba(0, 162, 86, 0.1);
    --color-warning: #FFA500;
    --color-warning-light: rgba(255, 165, 0, 0.1);
    --color-danger: #FF0000;
    --color-danger-light: rgba(255, 0, 0, 0.1);
    --color-info: #17a2b8;
    --color-info-light: rgba(23, 162, 184, 0.1);
    --color-purple: #800080;
    --color-purple-light: rgba(128, 0, 128, 0.1);

    --color-white: #ffffff;
    --color-gray-50: #f8f9fa;
    --color-gray-100: #f3f3f4;
    --color-gray-200: #e9ecef;
    --color-gray-300: #dee2e6;
    --color-gray-400: #f0f0f0;
    --color-gray-600: #6c757d;
    --color-gray-700: #495057;
    --color-gray-900: #212529;

    --color-text-primary: #212529;
    --color-text-secondary: #495057;
    --color-text-muted: #6c757d;

    --color-border-light: #f0f0f0;
    --color-border: #dee2e6;

    --color-overlay: rgba(0, 0, 0, 0.5);

    /* ===== 颜色系统（框架/遗留命名，保留兼容） ===== */
    --primary-color: #0087F7;
    --success-color: #0087F7;
    --info-color: #0087F7;
    --warning-color: #0087F7;
    --danger-color: #FF0000;
    --text-primary: #2d3748;
    --text-secondary: #718096;
    --border-color: #e2e8f0;
    --bg-gray: #f7fafc;

    /* ===== 间距系统（4px 比例） ===== */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.5rem;
    --space-6: 2rem;
    --space-7: 2.5rem;
    --space-8: 3rem;

    /* ===== 字号系统 ===== */
    --font-size-h1: 1.75rem;
    --font-size-h2: 1.25rem;
    --font-size-h3: 1.1rem;
    --font-size-h4: 1rem;
    --font-size-xs: 0.75rem;
    --font-size-sm: 0.85rem;
    --font-size-base: 0.95rem;
    --font-size-md: 1rem;
    --font-size-lg: 1.25rem;
    --font-size-xl: 1.75rem;
    --font-size-2xl: 2rem;
    --font-size-3xl: 2.5rem;
    --font-size-4xl: 3rem;

    --icon-size-sm: 14px;
    --icon-size-base: 1.25rem;
    --icon-size-lg: 1.5rem;

    /* ===== Widget 中文阅读与后台密度基线 ===== */
    --widget-font-size: 14px;
    --widget-line-height: 1.571;
    --widget-small-font-size: 12px;
    --widget-small-line-height: 1.5;
    --widget-label-font-size: 14px;
    --widget-label-line-height: 1.571;
    --widget-control-min-height: 38px;
    --widget-control-padding-x: 12px;
    --widget-control-padding-y: 7px;
    --widget-control-radius: 8px;
    --button-radius: var(--widget-control-radius);
    --input-radius: var(--widget-control-radius);
    --widget-option-min-height: 36px;
    --widget-table-row-min-height: 44px;
    --widget-table-line-height: 1.571;
    --touch-target-min-size: 44px;

    /* ===== 安全区（Surface / Mini Program 共享） ===== */
    --safe-area-top: env(safe-area-inset-top, 0px);
    --safe-area-right: env(safe-area-inset-right, 0px);
    --safe-area-bottom: env(safe-area-inset-bottom, 0px);
    --safe-area-left: env(safe-area-inset-left, 0px);

    /* ===== 表单控件高度基线（admin / program 统一） =====
       注意：自定义属性在声明处就完成替换，下面两个变量在 :root 上取的是当时的
       --widget-control-min-height 值，之后在容器上改 --widget-control-min-height 不会回头重算它们。
       所以任何容器覆盖 --widget-control-min-height 时，必须同时覆盖 --form-control-height
       （用到小号控件时还要覆盖 --form-control-sm-height），否则 .form-control 会停在旧高度、
       而按钮等 widget 控件跟着新高度走，出现输入框与按钮一高一低。 */
    --form-control-height: var(--widget-control-min-height);
    --form-control-sm-height: var(--widget-control-min-height);
    --form-control-lg-height: 44px;
    --form-control-font-size: 14px;
    --form-control-sm-font-size: 13px;
    --form-control-lg-font-size: 15px;
    --form-control-line-height: 1.5;
    --form-textarea-min-height: 84px;

    /* ===== 边框 / 圆角 ===== */
    --radius-sm: 4px;
    --radius-base: 6px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-full: 50%;
    --border-width-thin: 1px;
    --border-width-thick: 2px;

    /* ===== 阴影 ===== */
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.1);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.15);
    --shadow-sidebar: -2px 0 8px rgba(0, 0, 0, 0.1);
    --shadow-focus: none;
    --focus-ring-color: rgba(11, 116, 222, 0.36);
    --focus-ring-outline: 1px solid var(--focus-ring-color);
    --focus-ring-offset: 2px;
    --focus-ring-shadow: none;
    --focus-ring-danger-shadow: none;

    /* ===== Z-Index 层级（全站唯一来源，禁止再写字面量） ===== */
    --z-content: 100;
    --z-footer: 200;
    --z-sticky: 10;
    --z-navbar: 1000;
    --z-overlay: 1040;
    --z-sidebar: 1050;
    --z-dropdown: 1050;
    --z-modal: 1060;
    --z-toast: 1070;

    /* ===== 过渡 ===== */
    --transition-fast: all 0.2s;
    --transition-base: all 0.3s ease;

    /* ===== 容器宽度 ===== */
    --container-narrow: 1000px;
    --container-wide: 1400px;

    /* ===== Bootstrap 主题覆盖（品牌主色） ===== */
    --bs-primary: #0087F7;
    --bs-primary-rgb: 0, 135, 247;
    --bs-focus-ring-color: rgba(11, 116, 222, 0.18);
}