/**
 * WonderAgent グローバルテーマトークン（単一ソース・既定値）
 *
 * 編集方針:
 *   1. 色・角丸・枠・影・フォントの「既定」は本ファイル
 *   2. スキン上書きは theme-skins.css（[data-wa-theme]）のみ
 *   3. セレクタ・ルールは theme.css
 *   4. ページ特例は var(--wa-*) 経由（裸の hex 禁止）
 *
 * 既定テーマ: classic（AdminLTE 風・python_prosales 準拠）
 *   sidebar #343a40 / body #ecf0f5 / card 枠 2px・角丸 15px
 *
 * 読み込み順: Bootstrap → 本ファイル → theme-skins.css → extra_css → theme.css
 *
 * 認証: auth.css は本トークンを参照（独自 :root 再定義しない）
 * メール: templates/email/_brand_colors.html の wa_mail_primary を §2 Primary と同期
 */

:root {

    /* ===================================================================
       §0  カラースキーム / クローズボタン
       =================================================================== */

    --wa-color-scheme: light;
    --wa-btn-close-filter: none;


    /* ===================================================================
       §1  形状プリミティブ
       =================================================================== */

    --wa-radius-card: 15px;
    --wa-radius-control: 8px;
    --wa-radius-btn: 0.375rem;

    --wa-border-width-card: 2px;
    --wa-border-width-control: 1.5px;
    --wa-border-width-kpi-accent: 4px;

    --wa-border-color-default: #ced4da;
    --wa-border-color-emphasis: #adb5bd;
    --wa-border-color-subtle: #e9ecef;

    --wa-shadow-card: 0 0 1px rgba(0, 0, 0, 0.125), 0 1px 3px rgba(0, 0, 0, 0.08);
    --wa-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
    --wa-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.15);
    --wa-shadow-dropdown: var(--wa-shadow-md);

    --wa-overlay-bg: rgba(0, 0, 0, 0.5);
    --wa-stack-gap: 1.5rem;


    /* ===================================================================
       §2  ブランド / アクセント色
       =================================================================== */

    --wa-primary: #0d6efd;
    --wa-primary-dark: #0b5ed7;
    --wa-primary-light: #e7f1ff;
    --wa-primary-rgb: 13, 110, 253;
    --wa-primary-focus: #86b7fe;
    --wa-primary-focus-ring: rgba(var(--wa-primary-rgb), 0.25);

    /* ナビ・リンク強調（旧 cyan アクセントの役割） */
    --wa-accent: var(--wa-primary);
    --wa-accent-hover: var(--wa-primary-dark);
    --wa-accent-muted: rgba(var(--wa-primary-rgb), 0.35);
    --wa-accent-border-muted: rgba(var(--wa-primary-rgb), 0.25);
    --wa-accent-glow: rgba(var(--wa-primary-rgb), 0.25);

    --wa-accent-start: var(--wa-primary);
    --wa-accent-end: var(--wa-primary-dark);
    --wa-accent-gradient: linear-gradient(135deg, var(--wa-accent-start) 0%, var(--wa-accent-end) 100%);


    /* ===================================================================
       §3  サーフェス / テキスト
       =================================================================== */

    --wa-body-bg: #ecf0f5;
    --wa-surface: #ffffff;
    --wa-surface-muted: #f6f8fb;
    --wa-surface-active-bg: color-mix(in srgb, var(--wa-body-bg) 70%, black);
    --wa-surface-hover-bg: color-mix(in srgb, var(--wa-body-bg) 85%, black);
    --wa-header-right-bg: var(--wa-surface);

    --wa-text: #212529;
    --wa-text-muted: #6c757d;
    --wa-text-dim: #6c757d;
    --wa-text-primary: var(--wa-text);
    --wa-text-on-primary: #ffffff;
    --wa-nav-text: var(--wa-text);

    --wa-border: var(--wa-border-color-default);
    --wa-border-input: var(--wa-border-color-default);
    --wa-border-light: var(--wa-border-color-subtle);
    --wa-border-subtle: var(--wa-border-color-subtle);
    --wa-border-dropdown: rgba(0, 0, 0, 0.08);

    /* 旧ダークテーマ名・互換エイリアス（新規コードは §3 を直接参照） */
    --wa-bg: var(--wa-body-bg);
    --wa-bg-sidebar: var(--wa-sidebar-bg);
    --wa-bg-card: var(--wa-surface);
    --wa-bg-card-elevated: var(--wa-surface-muted);
    --wa-bg-input: var(--wa-surface);
    --wa-shell-bg: var(--wa-body-bg);
    --wa-card-matte: none;
    --wa-matte-highlight: transparent;
    --wa-matte-shadow: rgba(0, 0, 0, 0.08);


    /* ===================================================================
       §4  セマンティック色
       =================================================================== */

    --wa-success: #198754;
    --wa-success-rgb: 25, 135, 84;
    --wa-warning: #ffc107;
    --wa-warning-rgb: 255, 193, 7;
    --wa-danger: #dc3545;
    --wa-danger-rgb: 220, 53, 69;
    --wa-info: #0dcaf0;
    --wa-info-rgb: 13, 202, 240;
    --wa-secondary: #6c757d;
    --wa-secondary-rgb: 108, 117, 125;
    --wa-dark: #343a40;
    --wa-danger-hover-bg: #fee;

    --wa-action-green: var(--wa-success);
    --wa-action-green-border: var(--wa-success);
    --wa-action-yellow: #b45309;
    --wa-action-yellow-border: #b45309;
    --wa-action-red: var(--wa-danger);
    --wa-action-red-border: var(--wa-danger);

    --wa-alert-success-bg: #d1e7dd;
    --wa-alert-success-border: #badbcc;
    --wa-alert-success-text: #0f5132;
    --wa-alert-danger-bg: #f8d7da;
    --wa-alert-danger-border: #f5c2c7;
    --wa-alert-danger-text: #842029;
    --wa-alert-info-bg: #cff4fc;
    --wa-alert-info-border: #b6effb;
    --wa-alert-info-text: #055160;
    --wa-alert-warning-bg: #fff3cd;
    --wa-alert-warning-border: #ffecb5;
    --wa-alert-warning-text: #664d03;


    /* ===================================================================
       §5  テーブル
       =================================================================== */

    --wa-table-stripe-bg: #f8f9fb;
    --wa-table-hover-bg: #f1f3f5;
    --wa-table-head-bg: var(--wa-surface);
    --wa-table-border-color: var(--wa-border-color-subtle);
    --wa-table-cell-padding-x: 1.25rem;
    --wa-table-cell-padding-y: 0.75rem;
    --wa-table-head-text-align: left;
    --wa-table-pagination-py: 0.875rem;
    --wa-table-pagination-gap: 0.75rem;


    /* ===================================================================
       §6  カード基盤
       =================================================================== */

    --wa-card-bg: var(--wa-surface);
    --wa-card-border: var(--wa-border-color-emphasis);
    --wa-card-border-width: var(--wa-border-width-card);
    --wa-card-radius: var(--wa-radius-card);
    --wa-card-shadow: var(--wa-shadow-card);

    --wa-card-header-bg: var(--wa-body-bg);
    --wa-card-header-text: var(--wa-text);
    --wa-card-inner-radius: calc(var(--wa-card-radius) - var(--wa-card-border-width));
    --wa-card-header-radius: var(--wa-card-inner-radius) var(--wa-card-inner-radius) 0 0;
    --wa-card-header-divider: var(--wa-border);
    --wa-card-body-bottom-radius: var(--wa-card-inner-radius);

    --wa-card-tabs-link: var(--wa-card-header-text);
    --wa-card-tabs-active-bg: var(--wa-sidebar-bg-light-30);
    --wa-card-tabs-active-text: var(--wa-text-on-primary);
    --wa-card-tabs-hover-bg: var(--wa-surface-hover-bg);


    /* ===================================================================
       §6b  モーダル / ポップアップ
       =================================================================== */

    --wa-modal-bg: var(--wa-card-bg);
    --wa-modal-border: var(--wa-card-border);
    --wa-modal-border-width: var(--wa-card-border-width);
    --wa-modal-radius: var(--wa-card-radius);
    --wa-modal-shadow: var(--wa-shadow-md);
    --wa-modal-header-bg: var(--wa-card-header-bg);
    --wa-modal-header-text: var(--wa-card-header-text);
    --wa-modal-header-divider: var(--wa-card-header-divider);
    --wa-modal-body-bg: var(--wa-card-bg);
    --wa-modal-footer-bg: var(--wa-surface-muted);
    --wa-popup-page-bg: var(--wa-body-bg);
    --wa-popup-content-padding: 1rem 1.25rem 1.5rem;


    /* ===================================================================
       §6c  編集フォーム
       =================================================================== */

    --wa-form-section-gap: var(--wa-stack-gap);
    --wa-form-footer-bg: var(--wa-surface-muted);
    --wa-form-footer-radius: var(--wa-radius-card);
    --wa-form-footer-inner-radius: calc(var(--wa-form-footer-radius) - var(--wa-card-border-width));
    --wa-form-footer-padding-y: 1rem;
    --wa-form-footer-padding-x: var(--wa-table-cell-padding-x);


    /* ===================================================================
       §7  条件絞りカード
       =================================================================== */

    --wa-filter-card-bg: var(--wa-card-bg);
    --wa-filter-card-header-bg: var(--wa-card-header-bg);
    --wa-filter-card-header-text: var(--wa-card-header-text);
    --wa-filter-card-label-text: var(--wa-text);
    --wa-filter-control-border: var(--wa-card-border);
    --wa-filter-control-border-width: var(--wa-border-width-control);
    --wa-filter-control-radius: var(--wa-radius-control);
    --wa-filter-control-bg: var(--wa-surface);
    --wa-filter-btn-border-width: var(--wa-border-width-control);
    --wa-filter-btn-border-color: var(--wa-card-border);
    --wa-filter-quick-btn-text: var(--wa-text);
    --wa-filter-quick-btn-border: var(--wa-filter-btn-border-color);
    --wa-filter-quick-btn-bg: transparent;
    --wa-filter-quick-btn-active-bg: var(--wa-surface-active-bg);
    --wa-filter-quick-btn-hover-bg: var(--wa-surface-hover-bg);


    /* ===================================================================
       §8  一覧カード
       =================================================================== */

    --wa-list-card-header-bg: var(--wa-card-header-bg);
    --wa-list-card-header-text: var(--wa-card-header-text);
    --wa-list-card-header-padding-x: var(--wa-table-cell-padding-x);
    --wa-list-card-footer-bg: var(--wa-table-stripe-bg);
    --wa-list-card-footer-padding-x: var(--wa-table-cell-padding-x);


    /* ===================================================================
       §9  KPI 統計カード
       =================================================================== */

    --wa-kpi-card-radius: var(--wa-radius-card);
    --wa-kpi-accent-width: var(--wa-border-width-kpi-accent);
    --wa-kpi-icon-color: #d1d3e2;


    /* ===================================================================
       §10  レイアウト chrome
       =================================================================== */

    --wa-header-h: 70px;
    --wa-sidebar-w: 260px;
    --wa-page-bottom-space: 2rem;

    --wa-sidebar-bg: #343a40;
    --wa-sidebar-bg-light-30: color-mix(in srgb, var(--wa-sidebar-bg) 70%, white);
    --wa-sidebar-link: rgba(255, 255, 255, 0.75);
    --wa-sidebar-link-hover-bg: rgba(255, 255, 255, 0.1);
    --wa-sidebar-link-active-bg: rgba(255, 255, 255, 0.15);
    --wa-sidebar-link-active-text: var(--wa-text-on-primary);
    --wa-sidebar-icon: rgba(255, 255, 255, 0.65);
    --wa-sidebar-group-label: rgba(255, 255, 255, 0.55);
    --wa-sidebar-group-label-open: rgba(255, 255, 255, 0.9);
    --wa-sidebar-divider: rgba(255, 255, 255, 0.08);
    --wa-system-title-color: var(--wa-text-on-primary);
    --wa-system-subtitle-color: rgba(255, 255, 255, 0.65);
    --wa-brand-icon-color: var(--wa-primary-focus);

    --wa-header-bg: var(--wa-sidebar-bg);
    --wa-header-border: rgba(0, 0, 0, 0.15);
    --wa-mobile-navbar-bg: var(--wa-sidebar-bg);
    --wa-user-dropdown-bg: var(--wa-body-bg);
    --wa-user-dropdown-header-bg: var(--wa-body-bg);
    --wa-user-dropdown-border-width: 1px;
    --wa-user-dropdown-divider: var(--wa-card-border);
    --wa-user-dropdown-divider-inset: 0.75rem;

    /* Workspace ナビ（同一トークン） */
    --wa-workspace-nav-bg: var(--wa-sidebar-bg);
    --wa-workspace-nav-link: var(--wa-sidebar-link);
    --wa-workspace-nav-link-active: var(--wa-sidebar-link-active-text);

    /* ダッシュボード歓迎バナー・ステータス */
    --wa-dash-welcome-bg:
        radial-gradient(ellipse 80% 120% at 100% 0%, rgba(var(--wa-primary-rgb), 0.18) 0%, transparent 55%),
        linear-gradient(
            135deg,
            color-mix(in srgb, var(--wa-primary) 14%, white) 0%,
            var(--wa-body-bg) 42%,
            var(--wa-surface-muted) 100%
        );
    --wa-dash-welcome-border: color-mix(in srgb, var(--wa-primary) 12%, white);
    --wa-dash-mini-bg: rgba(255, 255, 255, 0.78);
    --wa-dash-mini-border: rgba(255, 255, 255, 0.9);
    --wa-dash-art-block-bg: rgba(255, 255, 255, 0.45);
    --wa-dash-art-block-border: rgba(255, 255, 255, 0.65);
    --wa-dash-att-badge-neutral-bg: #e9ecef;
    --wa-dash-status-amber: linear-gradient(145deg, #f0a202, #e67e22);
    --wa-dash-status-blue: linear-gradient(145deg, #3b82f6, #2563eb);
    --wa-dash-status-green: linear-gradient(145deg, #22c55e, #16a34a);
    --wa-dash-status-sky: linear-gradient(145deg, #38bdf8, #0ea5e9);
    --wa-dash-status-teal: linear-gradient(145deg, #14b8a6, #0d9488);
    --wa-dash-status-cyan: linear-gradient(145deg, #06b6d4, #0891b2);
    --wa-dash-status-rose: linear-gradient(145deg, #fb7185, #e11d48);
    --wa-dash-status-slate: linear-gradient(145deg, #64748b, #475569);

    --wa-outline-success-hover-bg: color-mix(in srgb, var(--wa-success) 10%, transparent);
    --wa-outline-warning-hover-bg: color-mix(in srgb, var(--wa-action-yellow) 10%, transparent);
    --wa-outline-danger-hover-bg: var(--wa-danger-hover-bg);


    /* ===================================================================
       §11  チャート
       =================================================================== */

    --wa-chart-1: #FF6384;
    --wa-chart-2: #36A2EB;
    --wa-chart-3: #FFCE56;
    --wa-chart-4: #4BC0C0;
    --wa-chart-5: #9966FF;
    --wa-chart-6: #FF9F40;
    --wa-chart-empty: var(--wa-border-color-subtle);
    --wa-chart-font-size: var(--wa-font-size-base);
    --wa-chart-font-family: var(--wa-font-family);
    --wa-chart-scale: 0.85;


    /* ===================================================================
       §12  タイポグラフィ
       =================================================================== */

    --wa-font-scale: 0.85;

    --wa-font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Hiragino Sans", "Meiryo", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --wa-font-family-mono: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

    --wa-font-size-base: 1rem;
    --wa-font-size-sm: 0.875rem;
    --wa-font-size-xs: 0.75rem;
    --wa-font-size-lg: 1.125rem;
    --wa-font-size-xl: 1.25rem;
    --wa-font-size-2xl: 1.5rem;
    --wa-font-size-3xl: 3rem;

    --wa-font-weight-normal: 400;
    --wa-font-weight-medium: 500;
    --wa-font-weight-semibold: 600;
    --wa-font-weight-bold: 700;

    --wa-line-height-base: 1.5;
    --wa-line-height-tight: 1;
    --wa-line-height-snug: 1.25;

    --wa-font-size-h1: 2.5rem;
    --wa-font-size-h2: 2rem;
    --wa-font-size-h3: 1.75rem;
    --wa-font-size-h4: 1.5rem;
    --wa-font-size-h5: 1.25rem;
    --wa-font-size-h6: 1rem;
    --wa-font-weight-heading: var(--wa-font-weight-semibold);

    --wa-font-size-system-title: 1.725rem;
    --wa-font-size-system-subtitle: 1rem;
    --wa-font-weight-system-title: var(--wa-font-weight-semibold);
    --wa-font-size-menu-toggle: 1.5rem;

    --wa-font-size-header-avatar: 1.2rem;
    --wa-font-weight-header-avatar: var(--wa-font-weight-bold);
    --wa-font-size-header-chevron: 0.875rem;
    --wa-font-size-header-dropdown-avatar: 1.25rem;
    --wa-font-size-header-dropdown-name: 1rem;
    --wa-font-size-header-dropdown-email: var(--wa-font-size-xs);
    --wa-font-size-header-dropdown-icon: 1.1rem;

    --wa-font-size-sidebar-link: var(--wa-font-size-base);
    --wa-font-weight-sidebar-link: var(--wa-font-weight-normal);
    --wa-font-size-card-header: var(--wa-font-size-base);
    --wa-font-weight-card-header: var(--wa-font-weight-semibold);
    --wa-font-size-stat-icon: 2.5rem;
    --wa-font-size-table: var(--wa-font-size-base);
    --wa-font-weight-table-head: var(--wa-font-weight-semibold);
    --wa-font-size-btn: var(--wa-font-size-base);
    --wa-font-weight-btn: var(--wa-font-weight-normal);
    --wa-font-size-badge: var(--wa-font-size-xs);
    --wa-font-size-filter-label: var(--wa-font-size-sm);
    --wa-font-size-token-table: 0.8125rem;

    --wa-control-height: 38px;


    /* ===================================================================
       §13  ページ固有・認証
       ※ 既定は本体トークンから派生（スキン切替でログイン画面も追従）
       ※ 暗色スキンは body/surface/primary を上書けば auth も自動追従
       =================================================================== */

    --wa-auth-page-bg: var(--wa-body-bg);
    --wa-auth-surface: var(--wa-surface-muted);
    --wa-auth-card-bg: var(--wa-surface);
    --wa-auth-border: var(--wa-border-color-default);
    --wa-auth-text: var(--wa-text);
    --wa-auth-muted: var(--wa-text-muted);
    --wa-auth-primary: var(--wa-primary);
    --wa-auth-primary-hover: var(--wa-primary-dark);
    --wa-auth-input-bg: var(--wa-surface);
    --wa-auth-input-focus-ring: var(--wa-primary-focus-ring);

    --wa-skill-dropzone-bg: var(--wa-surface-muted);
    --wa-skill-dropzone-active-bg: var(--wa-primary-light);
    --wa-skill-dropzone-active-border: var(--wa-primary);

    --wa-token-row-selected-bg: rgba(var(--wa-primary-rgb), 0.12);

    /* レガシー KPI グラデーション名（stat-card 左アクセント化後は未使用可） */
    --wa-gradient-purple: var(--wa-accent-gradient);
    --wa-gradient-red: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
    --wa-gradient-green: linear-gradient(135deg, #11998e 0%, #38ef7d 100%);
    --wa-gradient-teal: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
    --wa-gradient-orange: var(--wa-gradient-red);

    /* 旧 navy スケール → サイドバー系へ寄せる（ハード参照残存対策） */
    --wa-navy-950: #050c18;
    --wa-navy-900: var(--wa-sidebar-bg);
    --wa-navy-850: #3d444b;
    --wa-navy-800: #454d55;
    --wa-navy-750: #4d555c;
    --wa-navy-700: #555d65;
    --wa-navy-650: #5d656d;


    /* ===================================================================
       §14  確認ダイアログ（alert-system.js）
       =================================================================== */

    --wa-confirm-title: var(--wa-text);
    --wa-confirm-message: var(--wa-text-muted);
    --wa-confirm-success: var(--wa-success);
    --wa-confirm-danger: var(--wa-danger);
    --wa-confirm-warning: #d97706;
    --wa-confirm-info: var(--wa-primary);


    /* ===================================================================
       §15  Bootstrap 5.1 ブリッジ（CDN の .bg-* は theme.css で上書き）
       =================================================================== */

    --bs-primary: var(--wa-primary);
    --bs-primary-rgb: var(--wa-primary-rgb);
    --bs-success: var(--wa-success);
    --bs-success-rgb: var(--wa-success-rgb);
    --bs-danger: var(--wa-danger);
    --bs-danger-rgb: var(--wa-danger-rgb);
    --bs-warning: var(--wa-warning);
    --bs-warning-rgb: var(--wa-warning-rgb);
    --bs-info: var(--wa-info);
    --bs-info-rgb: var(--wa-info-rgb);
    --bs-secondary: var(--wa-secondary);
    --bs-secondary-rgb: var(--wa-secondary-rgb);
    --bs-dark: var(--wa-dark);
    --bs-body-bg: var(--wa-body-bg);
    --bs-body-color: var(--wa-text);
    --bs-border-color: var(--wa-border);
    --bs-link-color: var(--wa-primary);
    --bs-font-sans-serif: var(--wa-font-family);
    --bs-font-monospace: var(--wa-font-family-mono);
    --bs-body-font-family: var(--wa-font-family);
    --bs-body-font-size: var(--wa-font-size-base);
    --bs-body-font-weight: var(--wa-font-weight-normal);
    --bs-body-line-height: var(--wa-line-height-base);
}

html {
    font-size: calc(100% * var(--wa-font-scale, 1));
    background-color: var(--wa-body-bg);
    color-scheme: var(--wa-color-scheme, light);
}