/* ============================================================
   tokens.css — Design tokens toàn hệ thống HKGI Workspace
   Sửa ở đây → áp dụng toàn bộ hệ thống
   ============================================================ */

:root {
  /* Màu nền & panel */
  --bg:           #edf1f3;
  --panel:        #ffffff;
  --panel-soft:   #f7f9fa;

  /* Màu chữ */
  --ink:          #1a2430;
  --muted:        #697583;
  --subtle:       #9aa5b1;

  /* Đường kẻ */
  --line:         #dce2e7;
  --line-strong:  #c4cdd6;

  /* Brand — teal */
  --brand:        #18745f;
  --brand-dark:   #105544;
  --brand-soft:   #e8f4f0;
  --brand-mid:    #0f6e56;

  /* Màu ngữ nghĩa */
  --cut:          #e04438;   /* danger / red */
  --cut-soft:     #fdecea;
  --crease:       #2563d9;   /* info / blue */
  --crease-soft:  #e8f0fe;
  --warn:         #d97706;   /* warning / amber */
  --warn-soft:    #fff4d8;
  --ok:           #16a34a;   /* success / green */
  --ok-soft:      #dcfce7;

  /* Shadow */
  --shadow-sm:    0 2px 8px rgba(31, 45, 57, .06);
  --shadow-md:    0 8px 28px rgba(31, 45, 57, .08);
  --shadow-lg:    0 16px 48px rgba(31, 45, 57, .12);

  /* Border radius */
  --radius-sm:    4px;
  --radius:       6px;
  --radius-md:    8px;
  --radius-lg:    12px;

  /* Typography scale */
  --fs-xs:        11px;
  --fs-sm:        12.5px;
  --fs-base:      14px;
  --fs-md:        14.5px;   /* menu */
  --fs-body:      17px;     /* paragraph */
  --fs-strong:    14.8px;
  --fs-btn:       13.5px;   /* button */
  --fs-logo:      16.5px;
  --fs-h3:        17.5px;
  --fs-h2:        22px;
  --fs-h1:        clamp(30px, 3.6vw, 42px);
  --fs-footer:    14px;
  --fs-span:      12.5px;

  /* Spacing */
  --gap-xs:       4px;
  --gap-sm:       8px;
  --gap-md:       16px;
  --gap-lg:       24px;
  --gap-xl:       32px;
  --gap-2xl:      48px;
  --gap-3xl:      64px;

  /* Layout */
  --max-width:    1200px;   /* container tối đa */
  --content-width: 1200px; /* nội dung chính */
  --nav-height:   54px;
  --sidebar-width: 220px;

  /* Button padding */
  --btn-pad:      8px 15px;

  /* Transition */
  --t-fast:       .12s ease;
  --t-base:       .18s ease;
}
