/* Công đoàn VNPT Cần Thơ — design tokens (CP2 V7.1 + V7.2 + V7.3). Tương phản ghi chú theo ước tính WCAG, đo lại trên UI thật. */
:root {
  /* Brand */
  --c-primary: #0066B3;        /* trắng trên nền này ≈5.9:1 */
  --c-primary-hover: #004D83;
  --c-bright: #0B5FFF;         /* chỉ dùng tab đang chọn + focus ring */
  --c-soft-blue: #EAF5FB;
  /* Actions */
  --c-violet: #6D28D9;         /* ≈7.1:1 */
  --c-violet-hover: #5B21B6;
  --c-tiktok: #18181B;
  /* Surfaces */
  --c-page: #F5F8FC;
  --c-card: #FFFFFF;
  --c-surface-2: #F8FAFD;
  --c-border: #DCE6EF;
  --c-divider: #E7EDF5;
  /* Text */
  --c-text: #0F172A;
  --c-heading: #102A5C;
  --c-text-2: #475569;         /* dùng trên nền trang */
  --c-muted: #64748B;          /* CHỈ trên nền trắng (≈4.7:1); trên --c-page không đạt AA */
  /* Status: chữ đậm đạt AA, nền nhạt cho pill */
  --c-success: #15803D; --c-success-bg: #E8F6EE;
  --c-warning: #B45309; --c-warning-bg: #FEF3E2;
  --c-danger: #B91C1C;  --c-danger-bg: #FDECEC;
  --c-info: #0066B3;    --c-info-bg: #EAF5FB;
  --c-violet-bg: #F1EBFD;

  /* Brand V7.2 — Công đoàn VNPT Cần Thơ */
  --c-navy: #0F2557;           /* chữ tiêu đề, dòng "CÔNG ĐOÀN" */
  --c-vnpt: #0066B3;           /* dòng "VNPT CẦN THƠ" */
  --c-title-blue: #0B5ED7;     /* dòng 2 tiêu đề Hero; ≈5.6:1 trên nền Hero */
  --c-gold: #D6AE54;           /* viền vàng — accent Công đoàn, dùng tiết chế */
  --c-champagne: #F7D477;      /* icon nút Gửi, vinh danh */
  --c-cta: #096DD0;            /* PA1: nút Gửi báo cáo (gradient → deep blue) */
  --c-deep-blue: #073B7A;
  --c-light-bg: #F4F8FF;
  --c-hero-bg: #F6FAFF;
  --c-tiktok-btn: #0B1729;
  /* V7.3 — Vàng premium (Tab đang chọn, ô Countdown) + nền xám bạc */
  --c-gold-1: #FFF4CA; --c-gold-2: #FFDC70; --c-gold-3: #E6A70E; --c-gold-line: #C88D09;
  --g-gold: linear-gradient(180deg, var(--c-gold-1) 0%, var(--c-gold-2) 52%, var(--c-gold-3) 100%);
  --shadow-gold: 0 1px 2px rgba(122, 82, 0, .22), 0 6px 14px rgba(200, 141, 9, .24);
  --g-silver: linear-gradient(135deg, #FBFCFE 0%, #EEF1F5 48%, #DCE2EA 100%);
  --c-silver-line: #CBD3DD;

  /* Typography V7.3 — 2 họ font tự lưu trữ (assets/css/fonts.css): Roboto (nội dung/số liệu) · Montserrat (thương hiệu/tiêu đề/CTA) */
  --font: 'Roboto', system-ui, 'Segoe UI', Arial, sans-serif;
  --font-display: 'Montserrat', 'Roboto', system-ui, 'Segoe UI', Arial, sans-serif;
  --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700; --fw-extrabold: 800;

  /* Spacing 4/8/12/16/20/24/32/40/48 */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 20px; --s-6: 24px; --s-8: 32px; --s-10: 40px; --s-12: 48px;

  /* Shape */
  --radius-card: 16px; --radius-input: 12px; --radius-btn: 12px; --radius-pill: 999px;
  --shadow-card: 0 1px 2px rgba(15, 23, 42, .06);
  --shadow-soft: 0 1px 2px rgba(16, 42, 92, .05), 0 8px 24px rgba(16, 42, 92, .08);   /* V7.3: Form, Ranking tách khỏi nền */
  --shadow-input: 0 1px 2px rgba(16, 42, 92, .06);
  --shadow-pop: 0 12px 32px rgba(15, 23, 42, .16);

  /* Sizes */
  --h-input: 48px; --h-btn: 44px; --h-filter: 40px; --h-row: 44px;
  --sidebar-w: 216px;
  --focus-ring: 0 0 0 2px var(--c-card), 0 0 0 4px var(--c-bright);
}