.dashboard-body {
    margin-bottom: 0;
}

@media (max-width: 991.98px) {
    .dashboard-shell {
        flex-direction: column;
    }

    .dashboard-main {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
    }

    .sidebar {
        width: 100%;
        min-height: auto;
        position: sticky;
        top: 0;
        z-index: 40;
        border-right: 0;
        border-bottom: 1px solid var(--dashboard-border);
    }

    .sidebar__brand {
        padding: 0.55rem 0.85rem;
    }

    .sidebar__logo-img {
        height: 32px;
    }

    .sidebar__nav {
        padding: 0.35rem 0.5rem 0.5rem;
    }

    .sidebar__menu {
        display: flex;
        gap: 0.35rem;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
        padding-bottom: 0.15rem;
    }

    .sidebar__link {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 0.25rem;
        min-width: 5.5rem;
        max-width: 7.5rem;
        padding: 0.45rem 0.5rem;
        text-align: center;
        font-size: 0.58rem;
        line-height: 1.2;
    }

    .sidebar__link--active {
        border-left: 0;
        border-bottom: 3px solid var(--dashboard-primary);
        padding-left: 0.5rem;
    }

    .sidebar__link i {
        font-size: 1.1rem;
    }

    .sidebar__link span {
        white-space: normal;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .sidebar__item--has-children {
        flex: 0 0 auto;
    }

    .sidebar__submenu {
        display: none;
    }

    .sidebar__item--has-children.is-open .sidebar__submenu {
        display: flex;
        flex-direction: column;
        padding: 0.15rem 0 0 0;
        gap: 0.15rem;
    }

    .sidebar__sublink {
        font-size: 0.55rem;
        padding: 0.25rem 0.4rem;
        text-align: center;
    }

    .dashboard-content {
        padding: 0.4rem 0.25rem;
    }

    .dashboard-section__title,
    .dashboard-subsection__title {
        white-space: normal;
    }

    .kpi-kdqt-card__split,
    .kpi-kdqt-card__split--segment,
    .kpi-kdqt-card__split--standard {
        grid-template-columns: 1fr;
    }

    .kpi-kdqt-card__split-col + .kpi-kdqt-card__split-col,
    .kpi-kdqt-card__split-col--ring {
        border-left: 0;
        border-right: 0;
        border-top: 1px solid #edf1f5;
    }

    .kpi-kdqt-card__split-col--ring {
        flex-direction: row;
        justify-content: flex-start;
        gap: 0.65rem;
    }
}

@media (max-width: 767.98px) {
    .dashboard-content {
        padding: 0.5rem;
    }

    .dashboard-section {
        margin-bottom: 0.75rem;
    }

    .dashboard-layout--ban-kdtn .row.g-4 {
        --bs-gutter-x: 0.75rem;
        --bs-gutter-y: 0.9rem;
    }

    .dashboard-layout--ban-kdtn .dashboard-section {
        margin-bottom: 1rem;
    }

    .dashboard-subsection {
        padding: 0.65rem 0.7rem 0.75rem;
    }

    .chart-panel__canvas,
    .chart-panel__canvas--trend {
        height: 260px;
    }

    .chart-panel__canvas--trend {
        height: 320px;
    }

    .chart-panel__body--treemap {
        height: 260px;
    }

    .dashboard-subsection .chart-panel__canvas--compact {
        height: 240px;
        min-height: 240px;
    }

    .chart-panel__canvas--stacked-horizontal {
        height: 260px;
    }

    /* Chart DOM (progress/weekly/growth): không ép height cố định — tránh cắt nhận xét trên mobile */
    .chart-panel__canvas--growth,
    .chart-panel__canvas--progress,
    .chart-panel__canvas--service-group,
    .chart-panel__canvas--weekly-row,
    .chart-panel__canvas--ranking-bar {
        height: auto !important;
        min-height: 0;
        max-height: none;
        overflow: visible;
        padding: 0.55rem 0.65rem 0.65rem;
    }

    .chart-panel:has(.chart-panel__canvas--progress),
    .chart-panel:has(.chart-panel__canvas--weekly-row),
    .chart-panel:has(.chart-panel__canvas--growth),
    .chart-panel:has(.chart-panel__canvas--service-group) {
        height: auto;
        overflow: visible;
    }

    .chart-panel:has(.chart-panel__canvas--progress) .card-body,
    .chart-panel:has(.chart-panel__canvas--weekly-row) .card-body,
    .chart-panel:has(.chart-panel__canvas--growth) .card-body,
    .chart-panel:has(.chart-panel__canvas--service-group) .card-body {
        overflow: visible;
        height: auto;
    }

    .progress-chart__evaluations {
        display: flex;
        flex-direction: column;
        gap: 0.55rem;
        overflow: visible;
        max-height: none;
    }

    .progress-chart__evaluation {
        flex-shrink: 0;
    }

    .progress-chart__track-row {
        grid-template-columns: minmax(0, 1fr) auto;
        row-gap: 0.25rem;
    }

    .progress-chart__status {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .progress-chart__item--branch .progress-chart__status-text {
        display: inline-flex;
    }

    .matrix-table__col-freeze-left,
    .matrix-table__col-freeze-right,
    .matrix-table__col-freeze-right--prev,
    .matrix-table__col-freeze-right--last {
        position: static;
        left: auto;
        right: auto;
        box-shadow: none;
    }

    .matrix-table__title {
        white-space: normal;
        line-height: 1.35;
    }

    .matrix-table__header {
        align-items: flex-start !important;
    }

    .kpi-card__value-row--with-gauge {
        padding-right: 0;
    }

    .kpi-card__gauge {
        position: static;
        margin-top: 0.35rem;
    }

    .kpi-card__evaluation-row {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }

    .kpi-card__gauge-wrap {
        align-self: center;
    }
}

@media (max-width: 575.98px) {
    html {
        font-size: 14px;
    }

    .chart-panel__header,
    .matrix-table__header,
    .kpi-kdqt-card__body {
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }

    .kpi-card__body {
        padding: 0.75rem;
        min-height: auto;
    }

    .kpi-card__value,
    .kpi-kdqt-card__value {
        font-size: 1.2rem;
        font-weight: 700;
    }
}