/*! jt-readable.css — lớp "sắc nét" dùng chung (2026-09-20). BẢN GIỐNG HỆT NHAU ở 5 repo, sửa một nơi thì chép sang các nơi còn lại:
 *    jupiter-truck     public/assets/backend/css/jt-readable.css
 *    IZY.ERP-Core      public/assets/backend/css/jt-readable.css
 *    Jupiter-Handling  public/assets/backend-v2/css/jt-readable.css   (layout backend-v2)
 *    jupiter-esign     public/assets/backend/css/jt-readable.css
 *    Jupiter-Accounting public/assets/backend-v2/css/jt-readable.css  (layout backend-v2)
 *  Nạp ở master, SAU app.min.css / custom / fixed (và sau izy-table.css nếu có).
 *
 *  Vì sao có file này: theme Velzon dùng chữ phụ #878a99 (tương phản 3,5:1 trên nền trắng), chữ vàng #f7b84b (1,8:1),
 *  xanh lơ (2:1) và rất nhiều nhãn cỡ 10–11px ⇒ cả màn hình "nhờ nhờ", người lớn tuổi không đọc nổi. File này CHỈ nắn
 *  màu chữ + sàn cỡ chữ + tiêu đề bảng thường; không đổi bố cục, không đổi nền, nút, ruy-băng, sidebar, topbar.
 *  Bảng izy-table đã có bảng màu riêng (izy-table.css) nên được chừa ra. Chỉ áp cho màn hình, bản in giữ nguyên.
 *
 *  Muốn một vùng KHÔNG bị nắn: gắn class .jt-readable-off lên vùng đó.
 */
@media screen {
    :root {
        --jt-ink: #10141b;
        --jt-ink-2: #3f4651;
        --jt-good: #0b7a5b;
        --jt-mid: #a86200;
        --jt-bad: #c0352b;
        --jt-info: #08739f;
        --jt-head-bg: var(--izy-grid-head-bg, #e3e5eb);
        --jt-head-text: #10141b;
        --jt-frame: #ced1d6;
    }
    [data-bs-theme="dark"], [data-layout-mode="dark"] {
        --jt-ink: #e9edf1;
        --jt-ink-2: #aeb8c2;
        --jt-good: #56d4a9;
        --jt-mid: #f5c065;
        --jt-bad: #ff9183;
        --jt-info: #5fd0f5;
        --jt-head-bg: var(--izy-grid-head-bg, #313944);
        --jt-head-text: #e9edf1;
        --jt-frame: #4a545f;
    }

    /* tiêu đề (h1–h6, .card-title) của theme là #495057 ⇒ gần đen. Đổi qua biến nên tiêu đề đặt màu riêng vẫn thắng. */
    :is(.page-content, .modal, .offcanvas):not(.jt-readable-off) { --vz-heading-color: var(--jt-ink); }

    /* chữ phụ. KHÔNG đổi biến --vz-secondary-color vì placeholder của ô nhập cũng dùng nó (placeholder đậm = tưởng đã nhập). */
    :is(.page-content, .modal, .offcanvas) :is(.text-muted, .form-text):not(.jt-readable-off *) { color: var(--jt-ink-2) !important; }

    /* màu nghĩa dùng làm MÀU CHỮ: sắc đậm cùng họ (theme tối dùng sắc sáng). Chừa chữ nằm trên nền đậm. */
    :is(.page-content, .modal, .offcanvas) .text-success:not(:is(.bg-dark, .bg-primary, .bg-secondary, .bg-success, .bg-info, .bg-warning, .bg-danger), :is(.bg-dark, .bg-primary, .bg-secondary, .bg-success, .bg-info, .bg-warning, .bg-danger, .jt-readable-off) *) { color: var(--jt-good) !important; }
    :is(.page-content, .modal, .offcanvas) .text-warning:not(:is(.bg-dark, .bg-primary, .bg-secondary, .bg-success, .bg-info, .bg-warning, .bg-danger), :is(.bg-dark, .bg-primary, .bg-secondary, .bg-success, .bg-info, .bg-warning, .bg-danger, .jt-readable-off) *) { color: var(--jt-mid) !important; }
    :is(.page-content, .modal, .offcanvas) .text-danger:not(:is(.bg-dark, .bg-primary, .bg-secondary, .bg-success, .bg-info, .bg-warning, .bg-danger), :is(.bg-dark, .bg-primary, .bg-secondary, .bg-success, .bg-info, .bg-warning, .bg-danger, .jt-readable-off) *) { color: var(--jt-bad) !important; }
    :is(.page-content, .modal, .offcanvas) .text-info:not(:is(.bg-dark, .bg-primary, .bg-secondary, .bg-success, .bg-info, .bg-warning, .bg-danger), :is(.bg-dark, .bg-primary, .bg-secondary, .bg-success, .bg-info, .bg-warning, .bg-danger, .jt-readable-off) *) { color: var(--jt-info) !important; }

    /* sàn cỡ chữ cho hai nấc nhỏ nhất — vẫn ăn theo nút "Aa" (--f-inc ở master). Các nấc từ fs-12 trở lên giữ nguyên. */
    html :is(.page-content, .modal, .offcanvas) .fs-10:not(.jt-readable-off *) { font-size: max(.75rem, calc(10px + var(--f-inc, 0px))) !important; }
    html :is(.page-content, .modal, .offcanvas) .fs-11:not(.jt-readable-off *) { font-size: max(.78rem, calc(11px + var(--f-inc, 0px))) !important; }

    /* tiêu đề của bảng THƯỜNG: nền xám đậm hơn thân một nấc, chữ gần đen, đậm (đúng kiểu izy-table).
       Chừa: bảng izy (tự lo), thead/th có màu riêng (table-dark, table-primary…, bg-*). */
    :is(.page-content, .modal, .offcanvas) .table:not(.izy-sticky, .izy-editable, .table-dark, .izy-scroll > *, .jt-readable-off *)
        > thead:not(.table-dark, .table-primary, .table-secondary, .table-success, .table-info, .table-warning, .table-danger, [class*="bg-"])
        > tr:not([class*="bg-"], [class*="table-"]) > th:not([class*="bg-"], [class*="table-"]) {
        background-color: var(--jt-head-bg);
        color: var(--jt-head-text) !important;
        font-weight: 600;
        border-bottom-color: var(--jt-frame);
    }

    /* biểu đồ ApexCharts: nhãn trục + chú giải */
    .page-content :is(.apexcharts-xaxis-label, .apexcharts-yaxis-label, .apexcharts-xaxis-title-text, .apexcharts-yaxis-title-text) { fill: var(--jt-ink-2) !important; }
    .page-content .apexcharts-legend-text { color: var(--jt-ink-2) !important; }
}