/* Desktop giữ nguyên tờ khai gốc. Chỉ màn dưới 992px mới co layout. */

@media (min-width: 992px) {
    .paper-form-content {
        min-width: 750px !important;
    }
}

@media (max-width: 991.98px) {
    .paper-form {
        width: 100%;
        max-width: 950px;
        box-sizing: border-box;
    }

    .paper-form-content {
        min-width: 0 !important;
    }

    .paper-form h3,
    .paper-form h5,
    .paper-form h6,
    .paper-form .mau-badge {
        overflow-wrap: break-word;
    }

    .paper-form h3 {
        font-size: clamp(17px, 4.6vw, 24px) !important;
        line-height: 1.35;
    }

    .paper-form .row > [class^="col-"],
    .paper-form .row > [class*=" col-"] {
        min-width: 0;
    }

    .paper-form .row .fw-bold,
    .paper-form .paper-form-content [style*="color: #c00"],
    .paper-form .paper-form-content [style*="color:#c00"] {
        overflow-wrap: anywhere;
    }

    .current-phone-line {
        flex-wrap: wrap;
        gap: 0.4rem 0.65rem;
    }

    .current-phone-value {
        overflow-wrap: anywhere;
    }

    .paper-form .form-control,
    .paper-form .form-select,
    .paper-form textarea {
        max-width: 100%;
    }

    /* Select native lấy min-width theo option dài nhất và kéo cả trang. */
    .attachment-box,
    .attachment-group,
    .attachment-box > .d-flex,
    .attachment-group > .d-flex,
    .attachment-box .flex-grow-1,
    .attachment-group .flex-grow-1 {
        min-width: 0;
        max-width: 100%;
    }

    .attachment-box select.form-select:not(.select2-hidden-accessible),
    .attachment-group select.form-select:not(.select2-hidden-accessible),
    form[data-disable-on-submit] select.form-select:not(.select2-hidden-accessible) {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    form[data-disable-on-submit] .d-flex.justify-content-end {
        flex-wrap: wrap;
    }

    .paper-form .paper-form-content .d-flex:is(.mb-2, .mb-3, .mb-4):has(> .fw-bold) {
        display: grid !important;
        grid-template-columns: minmax(9.5rem, 34%) minmax(0, 1fr);
        align-items: center;
        column-gap: 0.85rem;
        row-gap: 0.65rem;
    }

    .paper-form .paper-form-content .d-flex:is(.mb-2, .mb-3, .mb-4):has(> .fw-bold) > .d-flex {
        display: flex !important;
        flex-wrap: wrap;
        align-items: center;
        gap: 0.5rem 1rem;
        min-width: 0;
    }

    .paper-form .paper-form-content .d-flex:is(.mb-2, .mb-3, .mb-4):has(> .fw-bold) > .fw-bold {
        width: auto !important;
        max-width: none !important;
        white-space: normal !important;
        margin-right: 0 !important;
    }

    .paper-form .paper-form-content .d-flex:is(.mb-2, .mb-3, .mb-4):has(> .fw-bold) > .form-control,
    .paper-form .paper-form-content .d-flex:is(.mb-2, .mb-3, .mb-4):has(> .fw-bold) > .form-select,
    .paper-form .paper-form-content .d-flex:is(.mb-2, .mb-3, .mb-4):has(> .fw-bold) > textarea {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        flex: none !important;
    }

    .paper-form .paper-form-content .d-flex:is(.mb-2, .mb-3, .mb-4):has(> .fw-bold) > input[type="number"] {
        width: 6.5rem !important;
        max-width: 100% !important;
        justify-self: start;
    }

    .paper-form .paper-form-content .d-flex:is(.mb-2, .mb-3, .mb-4):has(> .fw-bold) > input[type="checkbox"],
    .paper-form .paper-form-content .d-flex:is(.mb-2, .mb-3, .mb-4):has(> .fw-bold) > input[type="radio"] {
        width: 20px !important;
        height: 20px !important;
        justify-self: start;
    }

    .paper-form select.form-select.select2-hidden-accessible {
        position: absolute !important;
        width: 1px !important;
        min-width: 0 !important;
        max-width: 1px !important;
        height: 1px !important;
        overflow: hidden !important;
    }

    .paper-form .select2-container {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100%;
    }

    .paper-form .paper-form-content .d-flex.align-items-center.mb-4:not(:has(> .fw-bold)) {
        flex-wrap: wrap;
        gap: 0.45rem 0.65rem;
    }
}

@media (max-width: 575.98px) {
    .paper-form {
        padding: 1.15rem 0.9rem !important;
    }

    .paper-form .paper-form-content .d-flex:is(.mb-2, .mb-3, .mb-4):has(> .fw-bold) {
        grid-template-columns: minmax(6.4rem, 46%) minmax(0, 1fr) !important;
        column-gap: 0.55rem;
    }
}
