/* ============================================================
 *  Design Tokens (CSS Custom Properties)
 *  2026-05-08 — Sidebar refactor base (R12 mockup + 3-LLM review 統合)
 *  Captain mockup: A 220px / B 240px / C 56px collapsed
 *  pet-care-app + 28-repo eco style convergence
 * ============================================================ */

:root {
  /* ---- Colors (sidebar: dark navy, body: light gray) ---- */
  --cw-color-sidebar-bg:        #001529;
  --cw-color-sidebar-text:      rgba(255, 255, 255, 0.85);
  --cw-color-sidebar-text-dim:  rgba(255, 255, 255, 0.45);
  --cw-color-sidebar-icon:      rgba(255, 255, 255, 0.65);
  --cw-color-active-bg:         #1677ff;
  --cw-color-active-text:       #ffffff;
  --cw-color-active-accent:     #69b1ff;
  --cw-color-hover-bg:          rgba(255, 255, 255, 0.08);
  --cw-color-section-heading:   rgba(255, 255, 255, 0.45);
  --cw-color-divider:           rgba(255, 255, 255, 0.06);

  --cw-color-topbar-bg:         #ffffff;
  --cw-color-topbar-border:     #e8e8e8;
  --cw-color-topbar-text:       #1f2937;

  --cw-color-main-bg:           #f0f2f5;
  --cw-color-text-primary:      #1f2937;
  --cw-color-text-secondary:    #64748b;
  --cw-color-border:            #e8e8e8;

  /* Status / accent colors (semantic) */
  --cw-color-primary:           #1677ff;
  --cw-color-success:           #10b981;
  --cw-color-warning:           #f59e0b;
  --cw-color-danger:            #ef4444;

  /* ---- Sizing ---- */
  --cw-sidebar-width:           240px;          /* default expanded (non-workspace) */
  --cw-sidebar-width-workspace: 56px;           /* workspace default (collapsed for time grid) */
  --cw-sidebar-width-collapsed: 56px;
  --cw-topbar-height:           48px;           /* non-workspace */
  --cw-topbar-height-workspace: 40px;           /* workspace (slim) */
  --cw-icon-size:               16px;
  --cw-nav-item-height:         40px;

  /* ---- Spacing scale (8px base) ---- */
  --cw-space-1: 4px;
  --cw-space-2: 8px;
  --cw-space-3: 12px;
  --cw-space-4: 16px;
  --cw-space-5: 24px;
  --cw-space-6: 32px;

  /* ---- Typography ---- */
  --cw-font-family: -apple-system, BlinkMacSystemFont, "Hiragino Sans",
                    "Yu Gothic UI", "Meiryo", sans-serif;
  --cw-font-size-base:    14px;
  --cw-font-size-small:   12px;
  --cw-font-size-heading: 18px;
  --cw-font-size-section: 11px;     /* sidebar section heading */
  --cw-font-weight-normal: 400;
  --cw-font-weight-medium: 500;
  --cw-font-weight-semibold: 600;
  --cw-line-height-base: 1.5;

  /* ---- Z-index hierarchy (must coexist with existing toast=9999, overlay=10000) ---- */
  --cw-z-sidebar:  100;
  --cw-z-topbar:   90;
  --cw-z-dropdown: 200;

  /* ---- Transitions ---- */
  --cw-transition-fast: 0.15s ease;
  --cw-transition-base: 0.3s ease;
}