/* ============================================================
 * crm-theme.css — Brand & semantic tokens (nguồn chuẩn DUY NHẤT).
 * ------------------------------------------------------------
 * ĐỔI MÀU CHỦ ĐẠO TOÀN HỆ THỐNG: chỉ sửa --primary / --primary-dark / --primary-2.
 * Mọi sắc độ mờ (color-mix) và gradient tự suy ra theo 3 biến trên.
 *
 * File này được nạp TRƯỚC crm-app.css ở layout CRM, và cả ở các
 * trang auth standalone (login, agent-register, card) — nên là
 * nơi duy nhất giữ giá trị màu thương hiệu.
 *
 * LƯU Ý: template PDF/print (DomPDF) KHÔNG đọc được CSS variable,
 * nên màu trong các file đó vẫn hardcode — đổi tay khi rebrand.
 * ============================================================ */
/* Font chữ chủ đạo — nạp Roboto từ Google Fonts (phủ mọi ngữ cảnh nạp file này: CRM + auth + kit). */
@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;

    /* 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-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;

    /* 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);
    --t:all .22s ease;

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

    --min-height-input: 42px;

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