/* ============================================================
 * WAREHOUSE KPI v5.2.7
 * FIX REPORT TABLE RESPONSIVE / ZOOM 100%
 * ============================================================ */

/*
 * JavaScript chỉ gắn các class này vào đúng khu vực báo cáo
 * chứa bảng đánh giá kho. Không tác động đến nghiệp vụ hoặc dữ liệu.
 */
.report-force-visible {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;

    position: relative !important;
    z-index: 2 !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;

    height: auto !important;
    min-height: 1px !important;
    max-height: none !important;

    clear: both !important;
    overflow: visible !important;

    transform: none !important;
    translate: none !important;
    scale: 1 !important;

    content-visibility: visible !important;
    contain: none !important;

    clip: auto !important;
    clip-path: none !important;
    pointer-events: auto !important;
}

.report-force-visible[hidden],
.report-force-visible.d-none,
.report-force-visible.invisible,
.report-force-visible.collapse:not(.show) {
    display: block !important;
}

.report-force-visible.report-fix-card {
    margin-top: 24px !important;
    margin-bottom: 32px !important;
}

/*
 * Khung chứa bảng phải có chiều rộng thực và cho phép cuộn ngang.
 */
.report-force-visible .report-scroll-fix,
.report-force-visible .table-responsive,
.report-force-visible .table-wrapper,
.report-force-visible .report-table-wrapper,
.report-force-visible .report-table-wrap,
.report-force-visible .warehouse-report-table,
.report-force-visible .dashboard-table-wrap {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;

    height: auto !important;
    min-height: 1px !important;
    max-height: none !important;

    overflow-x: auto !important;
    overflow-y: visible !important;

    -webkit-overflow-scrolling: touch;
    scrollbar-gutter: stable;
}

/*
 * Bảng KPI có nhiều cột. Không ép cột co nhỏ đến mức làm vỡ bố cục.
 * Khi màn hình không đủ rộng, người dùng cuộn ngang trong khung bảng.
 */
.report-force-visible table {
    display: table !important;
    visibility: visible !important;
    opacity: 1 !important;

    width: 100% !important;
    min-width: 1080px !important;
    max-width: none !important;

    height: auto !important;
    max-height: none !important;

    table-layout: auto !important;
    transform: none !important;
}

.report-force-visible thead {
    display: table-header-group !important;
}

.report-force-visible tbody {
    display: table-row-group !important;
}

.report-force-visible tr {
    display: table-row !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.report-force-visible th,
.report-force-visible td {
    display: table-cell !important;
    visibility: visible !important;
    opacity: 1 !important;

    height: auto !important;
    max-height: none !important;
}

/*
 * Ngăn container cha làm mất nội dung do overflow hoặc min-width.
 */
main,
main > .container,
main > .container-fluid,
.app-main,
.dashboard-page,
.dashboard-content,
.report-page {
    min-width: 0 !important;
}

.report-parent-fix {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;

    min-width: 0 !important;
    max-width: 100% !important;

    height: auto !important;
    min-height: 1px !important;
    max-height: none !important;

    overflow: visible !important;
    transform: none !important;
    content-visibility: visible !important;
    contain: none !important;
}

/*
 * Ghi đè các breakpoint cũ có thể vô tình ẩn bảng.
 */
@media (max-width: 1799.98px) {
    .report-force-visible,
    .report-force-visible.report-fix-card,
    .report-parent-fix {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        height: auto !important;
        max-height: none !important;
    }
}

@media (max-width: 1399.98px) {
    .report-force-visible table {
        min-width: 1040px !important;
    }
}

@media (max-width: 991.98px) {
    .report-force-visible {
        border-radius: 20px !important;
    }

    .report-force-visible table {
        min-width: 980px !important;
    }
}

@media (max-width: 767.98px) {
    .report-force-visible.report-fix-card {
        margin-top: 16px !important;
    }

    .report-force-visible table {
        min-width: 920px !important;
    }

    .report-force-visible .report-scroll-fix,
    .report-force-visible .table-responsive,
    .report-force-visible .table-wrapper,
    .report-force-visible .report-table-wrapper,
    .report-force-visible .report-table-wrap {
        margin-inline: -4px !important;
        padding-bottom: 8px !important;
    }
}

/*
 * Thanh báo nhỏ chỉ xuất hiện khi JavaScript phát hiện và sửa được bảng.
 */
.report-responsive-status {
    display: none;
}

.report-responsive-status.is-active {
    display: inline-flex;
    align-items: center;
    gap: 6px;

    margin-left: 8px;
    padding: 6px 10px;

    color: #087d39;
    background: #eaf8ef;
    border: 1px solid #bfe8ce;
    border-radius: 999px;

    font-size: 12px;
    font-weight: 700;
}

/* ============================================================
 * END REPORT RESPONSIVE FIX
 * ============================================================ */
