/* ===================================================================
   wright-tokens.css — Wright デザイントークン
   Wright Design System の Single Source of Truth。
   全 Wright コンポーネントはこれらの変数を参照する。
   =================================================================== */

:root {
    /* ===== Brand Colors ===== */
    --wright-color-primary:         #374d6c;
    --wright-color-primary-darken:  #2e415b;
    --wright-color-primary-light:   #e8edf3;
    --wright-color-secondary:       #78909C;
    --wright-color-secondary-darken: #546E7A;
    --wright-color-secondary-light: #ECEFF1;
    --wright-color-tertiary:        #8fbc8f;

    /* ===== Semantic Colors ===== */
    --wright-color-info:            #1E88E5;
    --wright-color-info-darken:     #1565C0;
    --wright-color-info-light:      #E3F2FD;
    --wright-color-success:         #4CAF50;
    --wright-color-success-light:   #E8F5E9;
    --wright-color-success-dark:    #1B5E20;
    --wright-color-warning:         #FB8C00;
    --wright-color-warning-light:   #FFF3E0;
    --wright-color-warning-dark:    #E65100;
    --wright-color-error:           #E53935;
    --wright-color-error-light:     #FFEBEE;
    --wright-color-error-dark:      #B71C1C;
    --wright-color-muted:           #9E9E9E;
    --wright-color-muted-light:     #F5F5F5;
    --wright-color-muted-dark:      #616161;

    /* ===== Surface / Background ===== */
    --wright-color-surface:         #FFFFFF;
    --wright-color-background:      #f5f5f5;
    --wright-color-background-gray: #fafafa;

    /* ===== Text ===== */
    --wright-color-text-primary:    #212121;
    --wright-color-text-secondary:  #666666;
    --wright-color-text-disabled:   rgba(0, 0, 0, 0.38);

    /* ===== Actions ===== */
    --wright-color-action-default:  rgba(0, 0, 0, 0.54);
    --wright-color-action-hover:    rgba(0, 0, 0, 0.04);

    /* ===== Lines / Borders ===== */
    --wright-color-lines:           rgba(0, 0, 0, 0.12);
    --wright-color-lines-inputs:    rgba(0, 0, 0, 0.42);
    --wright-color-divider:         rgba(0, 0, 0, 0.12);

    /* ===== Table ===== */
    --wright-color-table-lines:     rgba(0, 0, 0, 0.12);
    --wright-color-table-hover:     #eaeaea;
    --wright-color-table-striped:   #fbfbfb;

    /* ===== Overlay ===== */
    --wright-overlay-dark: rgba(0, 0, 0, 0.35);

    /* ===== Z-Index Scale ===== */
    --wright-zindex-dropdown:  1000;  /* Select, Menu ドロップダウン */
    --wright-zindex-appbar:    1050;  /* AppBar（インラインドロップダウンの上、ダイアログの下） */
    /* TODO: WrightDialog.razor の z-index ハードコード (1500 + Depth * 10) を
       この CSS 変数に統合する。現在の実装値 1500 と乖離しており、
       CSS 変数を信じて z-index を設計すると壊れるリスクがある。 */
    --wright-zindex-dialog:    1100;  /* ⚠ 実態は WrightDialog.razor で 1500 base */
    --wright-zindex-tooltip:   1200;  /* ツールチップ */
    --wright-zindex-errortip:  1300;  /* バリデーションエラーチップ */

    /* ===== Layout ===== */
    --wright-border-radius:    4px;
    --wright-drawer-width:     245px;
    --wright-appbar-height:    64px;

    /* ===== Drawer ===== */
    --wright-drawer-background: #2c3e50;
    --wright-drawer-text:       #ecf0f1;
    --wright-drawer-icon:       #bdc3c7;

    /* ===== Appbar ===== */
    --wright-appbar-background: #374d6c;
    --wright-appbar-text:       #ecf0f1;

    /* ===== Elevation ===== */
    --wright-elevation-0: none;
    --wright-elevation-1: 0 2px 1px -1px rgba(0, 0, 0, 0.2),
                          0 1px 1px 0 rgba(0, 0, 0, 0.14),
                          0 1px 3px 0 rgba(0, 0, 0, 0.12);
    --wright-elevation-2: 0 3px 1px -2px rgba(0, 0, 0, 0.2),
                          0 2px 2px 0 rgba(0, 0, 0, 0.14),
                          0 1px 5px 0 rgba(0, 0, 0, 0.12);
    --wright-elevation-3: 0 3px 3px -2px rgba(0, 0, 0, 0.2),
                          0 3px 4px 0 rgba(0, 0, 0, 0.14),
                          0 1px 8px 0 rgba(0, 0, 0, 0.12);
    --wright-elevation-4: 0 2px 4px -1px rgba(0, 0, 0, 0.2),
                          0 4px 5px 0 rgba(0, 0, 0, 0.14),
                          0 1px 10px 0 rgba(0, 0, 0, 0.12);
}