/* KTG Mobile Audit — production guardrails for 360–430px field devices. */
@media (max-width: 1023px) {
    html,
    body {
        max-width: 100%;
        overflow-x: hidden;
    }

    .triton-page {
        width: 100%;
        max-width: 100%;
        gap: .875rem;
        padding: .75rem;
        padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 5.5rem);
        overflow-x: clip;
    }

    .triton-page.ktg-mobile-has-local-fab {
        padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 9rem);
    }

    .triton-page section,
    .triton-page article,
    .triton-page form,
    .triton-page nav,
    .triton-page > div {
        min-width: 0;
    }

    .triton-card {
        border-radius: 16px;
    }

    .triton-page input:not([type="checkbox"]):not([type="radio"]),
    .triton-page select,
    .triton-page textarea,
    dialog input:not([type="checkbox"]):not([type="radio"]),
    dialog select,
    dialog textarea {
        min-width: 0;
        max-width: 100%;
        font-size: 16px;
    }

    .triton-btn-primary,
    .triton-btn-secondary,
    .triton-page button,
    .triton-page a[class*="btn"] {
        min-height: 44px;
    }

    .triton-page .overflow-x-auto,
    .triton-page [class*="overflow-x-auto"] {
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-inline: contain;
        scrollbar-width: thin;
    }

    .triton-page nav.overflow-x-auto,
    .triton-page nav[class*="overflow-x-auto"] {
        scroll-snap-type: x proximity;
    }

    .triton-page nav.overflow-x-auto > *,
    .triton-page nav[class*="overflow-x-auto"] > * {
        scroll-snap-align: start;
        flex: none;
    }

    dialog {
        width: calc(100% - 1rem) !important;
        max-width: calc(100% - 1rem) !important;
        max-height: calc(100dvh - 1rem) !important;
        margin: auto !important;
        border-radius: 18px !important;
        overscroll-behavior: contain;
    }

    dialog > form {
        max-height: calc(100dvh - 1rem);
    }

    dialog form > [class*="border-t"]:last-child {
        position: sticky;
        bottom: 0;
        z-index: 3;
    }

    #ktg-feedback-dialog {
        width: calc(100% - 1rem) !important;
    }

    button[aria-label="Gửi góp ý hoặc báo lỗi"] {
        right: .75rem !important;
        bottom: calc(env(safe-area-inset-bottom, 0px) + .75rem) !important;
        width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
        padding: 0 !important;
        justify-content: center !important;
        border-radius: 999px !important;
    }

    button[aria-label="Gửi góp ý hoặc báo lỗi"] > span:first-child {
        width: 22px !important;
        height: 22px !important;
        font-size: 11px !important;
    }

    button[aria-label="Thêm công tác"] {
        right: .75rem !important;
        bottom: calc(env(safe-area-inset-bottom, 0px) + 4.75rem) !important;
    }

    .triton-page img,
    .triton-page video,
    .triton-page iframe {
        max-width: 100%;
    }
}

@media (max-width: 639px) {
    .triton-page {
        padding: .625rem;
        padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 5.5rem);
    }

    .triton-page.ktg-mobile-has-local-fab {
        padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 9rem);
    }

    .triton-page h1 {
        overflow-wrap: anywhere;
    }

    .triton-page .triton-field {
        min-width: 0;
        width: 100%;
    }

    .triton-page form[method="GET"] > button,
    .triton-page form[method="GET"] > a {
        width: 100%;
    }

    dialog [class*="px-6"] {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    dialog [class*="p-6"] {
        padding: 1rem;
    }
}


/* Complex QS worksheets stay editable on phone without horizontal-only navigation. */
@media (max-width: 767px) {
    #ab-ipc-quantity-workbook .ktg-mobile-workbook-table,
    #ab-client-approve .ktg-mobile-approval-table {
        display: block;
        min-width: 0 !important;
        width: 100%;
    }

    #ab-ipc-quantity-workbook .ktg-mobile-workbook-table thead,
    #ab-client-approve .ktg-mobile-approval-table thead {
        display: none;
    }

    #ab-ipc-quantity-workbook .ktg-mobile-workbook-table tbody,
    #ab-client-approve .ktg-mobile-approval-table tbody {
        display: grid;
        gap: .625rem;
        padding: .625rem;
    }

    #ab-ipc-quantity-workbook .ktg-mobile-workbook-table tr[data-ipc-item],
    #ab-client-approve .ktg-mobile-approval-table tbody tr {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .625rem;
        border: 1px solid #dbe3ed;
        border-radius: 14px;
        background: #fff;
        padding: .75rem;
    }

    html.dark #ab-ipc-quantity-workbook .ktg-mobile-workbook-table tr[data-ipc-item],
    html.dark #ab-client-approve .ktg-mobile-approval-table tbody tr {
        border-color: #334155;
        background: #0f172a;
    }

    #ab-ipc-quantity-workbook .ktg-mobile-workbook-table tr[data-ipc-group] {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: .5rem;
        border: 1px solid #dbeafe;
        border-radius: 12px;
        padding: .65rem .75rem;
    }

    #ab-ipc-quantity-workbook .ktg-mobile-workbook-table td,
    #ab-client-approve .ktg-mobile-approval-table td {
        display: block;
        min-width: 0;
        padding: 0 !important;
        text-align: left !important;
    }

    #ab-ipc-quantity-workbook .ktg-mobile-workbook-table tr[data-ipc-item] td:first-child,
    #ab-client-approve .ktg-mobile-approval-table tbody td:first-child {
        grid-column: 1 / -1;
    }

    #ab-ipc-quantity-workbook .ktg-mobile-workbook-table tr[data-ipc-group] td:first-child {
        grid-column: 1 / 2;
    }

    #ab-ipc-quantity-workbook .ktg-mobile-workbook-table tr[data-ipc-group] td:nth-child(2) {
        display: none;
    }

    #ab-ipc-quantity-workbook .ktg-mobile-workbook-table tr[data-ipc-group] td:last-child {
        grid-column: 2 / 3;
        text-align: right !important;
    }

    #ab-ipc-quantity-workbook .ktg-mobile-workbook-table tr[data-ipc-item] td:nth-child(n+2)::before,
    #ab-client-approve .ktg-mobile-approval-table tbody td:nth-child(n+2)::before {
        display: block;
        margin-bottom: .25rem;
        color: #94a3b8;
        font-size: 9px;
        font-weight: 800;
        line-height: 1.2;
        text-transform: uppercase;
        letter-spacing: .04em;
    }

    #ab-ipc-quantity-workbook .ktg-mobile-workbook-table tr[data-ipc-item] td:nth-child(2)::before { content: "ĐVT"; }
    #ab-ipc-quantity-workbook .ktg-mobile-workbook-table tr[data-ipc-item] td:nth-child(3)::before { content: "KL HĐ"; }
    #ab-ipc-quantity-workbook .ktg-mobile-workbook-table tr[data-ipc-item] td:nth-child(4)::before { content: "Lũy kế duyệt trước"; }
    #ab-ipc-quantity-workbook .ktg-mobile-workbook-table tr[data-ipc-item] td:nth-child(5)::before { content: "Còn lại"; }
    #ab-ipc-quantity-workbook .ktg-mobile-workbook-table tr[data-ipc-item] td:nth-child(6)::before { content: "KL kỳ này"; }
    #ab-ipc-quantity-workbook .ktg-mobile-workbook-table tr[data-ipc-item] td:nth-child(7)::before { content: "Lũy kế trình"; }
    #ab-ipc-quantity-workbook .ktg-mobile-workbook-table tr[data-ipc-item] td:nth-child(8)::before { content: "Đơn giá"; }
    #ab-ipc-quantity-workbook .ktg-mobile-workbook-table tr[data-ipc-item] td:nth-child(9)::before { content: "Giá trị kỳ này"; }

    #ab-ipc-quantity-workbook .ktg-mobile-workbook-table tr[data-ipc-item] td:nth-child(6) {
        grid-column: 1 / -1;
    }

    #ab-ipc-quantity-workbook .ktg-mobile-workbook-table tr[data-ipc-item] td:nth-child(6) input {
        width: 100% !important;
        margin-left: 0 !important;
        text-align: left !important;
    }

    #ab-client-approve .ktg-mobile-approval-table tbody td:nth-child(2)::before { content: "ĐVT"; }
    #ab-client-approve .ktg-mobile-approval-table tbody td:nth-child(3)::before { content: "KL trình"; }
    #ab-client-approve .ktg-mobile-approval-table tbody td:nth-child(4)::before { content: "Đã duyệt trước"; }
    #ab-client-approve .ktg-mobile-approval-table tbody td:nth-child(5)::before { content: "KL CĐT duyệt kỳ này"; }

    #ab-client-approve .ktg-mobile-approval-table tbody td:nth-child(5) {
        grid-column: 1 / -1;
    }

    #ab-client-approve .ktg-mobile-approval-table tbody td:nth-child(5) input {
        width: 100% !important;
        margin-left: 0 !important;
        text-align: left !important;
    }

    #ab-ipc-quantity-workbook > div[class*="overflow-auto"],
    #ab-client-approve div[class*="overflow-x-auto"] {
        overflow-x: visible !important;
    }
}


/* Settings mobile shell: no desktop sidebar/nested-width behavior on phones. */
@media (max-width: 639px) {
    .ktg-appearance-segmented {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: hidden;
    }

    .ktg-appearance-segmented > * {
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .ktg-appearance-segmented [role="radio"],
    .ktg-appearance-segmented label {
        min-width: 0 !important;
        padding-left: .5rem !important;
        padding-right: .5rem !important;
        white-space: nowrap;
    }

    .ktg-appearance-segmented svg {
        flex: none;
    }
}


/* Executive dashboard final mobile polish. */
@media (max-width: 639px) {
    .ktg-dashboard {
        gap: .75rem;
    }

    .ktg-dashboard > section {
        scroll-margin-top: 4rem;
    }

    .ktg-dashboard .ktg-dashboard-chip-confidence {
        display: none;
    }

    .ktg-dashboard .ktg-dashboard-chip-primary {
        padding: .35rem .6rem;
        font-size: 8px;
        letter-spacing: .1em;
    }

    .ktg-dashboard .ktg-dashboard-chip-alert {
        max-width: 100%;
        padding: .35rem .55rem;
        font-size: 9px;
    }

    .ktg-dashboard .ktg-dashboard-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
        gap: .5rem;
    }

    .ktg-dashboard .ktg-dashboard-actions > a {
        width: 100%;
        min-height: 40px;
        padding: .55rem .65rem;
        font-size: 11px;
    }

    .ktg-dashboard .ktg-dashboard-actions > a:first-child {
        grid-column: 1 / -1;
    }

    .ktg-dashboard .ktg-dashboard-executive-meta {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .35rem .75rem;
    }

    .ktg-dashboard .ktg-dashboard-executive-meta > span:last-child {
        grid-column: 1 / -1;
        margin-top: .1rem;
        font-size: 9px;
        line-height: 1.35;
    }

    .ktg-dashboard .ktg-dashboard-kpi {
        min-height: 134px;
    }

    .ktg-dashboard .ktg-dashboard-kpi > p[class*="text-[30px]"],
    .ktg-dashboard .ktg-dashboard-kpi span[class*="text-[30px]"] {
        font-size: 1.65rem !important;
    }

    .ktg-dashboard .ktg-dashboard-kpi > p[class*="text-[27px]"] {
        font-size: 1.4rem !important;
        line-height: 1.05 !important;
    }

    .ktg-dashboard .ktg-dashboard-kpi p[class*="text-[10px]"] {
        font-size: 10.5px !important;
        line-height: 1.45 !important;
    }

    .ktg-dashboard .ktg-dashboard-alert-empty {
        padding-top: .6rem;
        padding-bottom: .6rem;
    }

    .ktg-dashboard .ktg-dashboard-alert-empty > div > div:first-child {
        width: 1.75rem;
        height: 1.75rem;
        border-radius: .6rem;
    }

    .ktg-dashboard section h2 {
        line-height: 1.2;
    }

    .ktg-dashboard a[href*="work-items"],
    .ktg-dashboard a[href*="commercial"] {
        -webkit-tap-highlight-color: transparent;
    }

    .ktg-dashboard aside .grid.grid-cols-2 > div p[class*="text-lg"] {
        font-size: 1rem !important;
    }

    .ktg-dashboard aside .space-y-2 {
        gap: .35rem;
    }

    .ktg-dashboard aside .space-y-2 > div {
        padding-top: .55rem;
        padding-bottom: .55rem;
    }
}