@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;600;700&display=swap');

:root {
    /* Brand — đổi 3 dòng này là đổi toàn hệ thống */
    --primary: #B20707;
    --primary-dark: #c0392b;
    --primary-2: #c0392b;          /* đầu thứ 2 của gradient (cam) */
    --t3: #5f6368;
    --hong-nhat: #FDEADA;
    --xanh-xam-nhat: #DBE5F2;

    /* Kiểu chữ — đổi font toàn hệ thống chỉ tại đây */
    --font-sans: 'Roboto', sans-serif;

    /* Thang cỡ chữ (font-size) — DÙNG token, KHÔNG hardcode px.
       Text chính = --fs-primary (14). Phụ đề nhỏ hơn: --fs-sm/--fs-xs/--fs-2xs. */
    --fs-2xl:     22px;   /* tiêu đề tài liệu / heading nổi bật nhất */
    --fs-xl:      20px;   /* tiêu đề lớn / số thống kê */
    --fs-lg:      18px;   /* tiêu đề section */
    --fs-md:      16px;   /* tiêu đề thẻ / nhấn */
    --fs-primary: 14px;   /* TEXT CHÍNH (body, bảng, label, nút, input) */
    --fs-sm:      13px;   /* text phụ / meta */
    --fs-xs:      12px;   /* chú thích / phụ đề */
    --fs-2xs:     11px;   /* nhãn nhỏ / badge / tag */
    --radius:     10px;

    /* Gradient (tự suy ra từ brand) */
    --gradient: linear-gradient(135deg, var(--primary), var(--primary-2));
    --gradient-dark: linear-gradient(135deg, var(--primary), var(--primary-dark));

    /* Semantic — trạng thái nghiệp vụ */
    --success: #22c55e; --success-bg: #f0fdf4; --success-border: #bbf7d0; --success-text: #166534;
    --danger:  #ef4444; --danger-bg:  #fef2f2; --danger-border:  #fecaca; --danger-text:  #991b1b;
    --warning: #f59e0b; --warning-bg: #fffbeb; --warning-border: #fde68a; --warning-text: #854d0e;
    --info:    #3b82f6; --info-bg:    #eff6ff; --info-border:    #bfdbfe; --info-text:    #1e40af;
    --purple:  #7c3aed; --purple-bg:  #faf5ff; --purple-border:  #e9d5ff; --purple-text:  #6b21a8;
    --orange:  #f97316; --orange-bg:  #fff7ed; --orange-border:  #fed7aa; --orange-text:  #9a3412;

    /* Brand token (--primary, --primary-dark, --gradient, --primary-2)
           đã chuyển sang crm-theme.css — nạp TRƯỚC file này. */
    --sidebar-bg:linear-gradient(180deg,#1a1a2e 0%,#16213e 55%,#0f3460 100%);
    --bg:#f4f6f9; --card-bg:#fffbfb; --border:#eaecf0;
    --text:#1a1a1a; --text-muted:#888; --text-light:#aaa;
    --sb-full:230px; --sb-mini:52px; --topbar-h:54px;
    --sb-w:var(--sb-full);
    --shadow-sm:0 1px 4px rgba(0,0,0,.06);
    --shadow-lg:0 8px 32px rgba(0,0,0,.14);
    /* Bề rộng tối đa modal — chỉnh 1 chỗ áp mọi modal: NGẮN (ít dữ liệu) / DÀI (nhiều dữ liệu). */
    --modal-w-sm:500px;
    --modal-w-lg:992px;
    /* RẤT NGẮN — modal chỉ hiện vài dòng thông tin (vd popup sinh nhật). */
    --modal-w-xs:375px;
    --t:all .22s ease;

    /* Follow by bootstrap */
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
    --breakpoint-2xl: 1400px;
    --breakpoint-3xl: 1600px;

    --min-height-input: 42px;

    --ms-options-h: 196px;
    --ms-options-h-lg: 392px;

    --bg-table-hover-level-1: #f3f3f3;
    --bg-table-hover-level-2: #e6e6e7;
    --bg-weekend: #f3f3f3;
}
