@media screen and (max-width: 812px) {
    #tabIframeHeader.nav-tabs {
        display: flex;
        flex-wrap: nowrap;
        gap: 6px;
        width: 100%;
        max-width: 100%;
        margin: 0;
        padding: 6px 8px;
        border: 0;
        background: #ffffff;
        overflow-x: auto;
        overflow-y: hidden;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    #tabIframeHeader.nav-tabs[hidden] {
        display: none !important;
    }

    #tabIframeHeader.nav-tabs::-webkit-scrollbar {
        display: none;
    }

    #tabIframeHeader .tab-header-item {
        flex: 0 0 auto;
        margin: 0;
        border: 0;
    }

    #tabIframeHeader .tab-header-item > a {
        display: flex !important;
        align-items: center;
        gap: 8px;
        min-height: 44px;
        margin: 0;
        padding: 8px 10px;
        border: 1px solid #e5e5e5;
        border-radius: 12px;
        background: #f5f5f5;
        color: #1f1f1f;
    }

    #tabIframeHeader .tab-header-item.active > a {
        border-color: #d4d4d4;
        background: #ffffff;
        box-shadow: 0 1px 2px rgba(31, 31, 31, 0.05);
    }

    #tabIframeHeader .tab-header-item-title {
        max-width: 180px;
        padding: 0;
        font-size: 13px;
        line-height: 18px;
    }

    #tabIframeHeader .refresh-iframe-tab,
    #tabIframeHeader .close-iframe-tab {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 32px;
        height: 32px;
        margin: -4px;
        border-radius: 8px;
    }

    #tabIframeContent > .tab-pane > .tab-iframe-viewport {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        padding: 0 !important;
        overflow: hidden !important;
    }

    #tabIframeContent > .tab-pane > .tab-iframe-viewport > iframe {
        display: block;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    #tabIframeContent > .tab-pane > .tab-iframe-viewport--order-detail,
    #tabIframeContent > .tab-pane > .tab-iframe-viewport--order-detail > iframe {
        border: 0 !important;
        box-shadow: none !important;
    }

    #tabIframeContent > .tab-pane > .tab-iframe-viewport--order-detail {
        overflow: visible !important;
    }

    .mes-mobile-drawing-viewer {
        position: fixed;
        inset: 0;
        z-index: 10050;
        display: grid;
        grid-template-rows: auto minmax(0, 1fr) auto;
        width: 100%;
        height: 100dvh;
        background: #111111;
        color: #ffffff;
    }

    .mes-mobile-drawing-viewer[hidden] {
        display: none !important;
    }

    .mes-mobile-drawing-viewer__header {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 44px;
        align-items: center;
        gap: 10px;
        min-height: 60px;
        padding: calc(8px + env(safe-area-inset-top)) 10px 8px 14px;
        background: #1f1f1f;
    }

    .mes-mobile-drawing-viewer__title {
        min-width: 0;
        margin: 0;
        font-size: 15px;
        font-weight: 600;
        line-height: 20px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .mes-mobile-drawing-viewer__close,
    .mes-mobile-drawing-viewer__nav {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 44px;
        min-height: 44px;
        padding: 0 12px;
        border: 0;
        border-radius: 10px;
        background: rgba(255, 255, 255, 0.12);
        color: #ffffff;
        font-size: 20px;
    }

    .mes-mobile-drawing-viewer__close {
        width: 44px;
        padding: 0;
        font-size: 26px;
        font-weight: 300;
    }

    .mes-mobile-drawing-viewer__stage {
        position: relative;
        min-height: 0;
        background: #2a2a2a;
    }

    .mes-mobile-drawing-viewer__frame {
        display: block;
        width: 100%;
        height: 100%;
        border: 0;
        background: #ffffff;
    }

    .mes-mobile-drawing-viewer__footer {
        display: grid;
        grid-template-columns: 44px minmax(0, 1fr) 44px;
        align-items: center;
        gap: 10px;
        padding: 8px 10px calc(8px + env(safe-area-inset-bottom));
        background: #1f1f1f;
    }

    .mes-mobile-drawing-viewer__meta {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 4px;
        min-width: 0;
    }

    .mes-mobile-drawing-viewer__counter {
        color: #d4d4d4;
        font-size: 11px;
        line-height: 14px;
    }

    .mes-mobile-drawing-viewer__open {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 32px;
        padding: 0 10px;
        border-radius: 8px;
        background: rgba(255, 255, 255, 0.12);
        color: #ffffff;
        font-size: 12px;
        font-weight: 600;
        text-decoration: none;
    }

    .mes-mobile-drawing-viewer__open:hover,
    .mes-mobile-drawing-viewer__open:focus {
        color: #ffffff;
        text-decoration: none;
    }

    .mes-mobile-drawing-viewer__nav:disabled {
        opacity: 0.35;
    }

    .order-detail-complectation-embed {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        padding: 10px;
        background: #ffffff;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .order-detail-complectation-embed > div[style*="space-between"] {
        display: flex !important;
        flex-wrap: wrap;
        align-items: center !important;
        gap: 8px;
        margin-right: 0 !important;
    }

    .order-detail-complectation-embed .header-fact-complectation-tree {
        flex: 1 1 180px;
        margin: 0;
        font-size: 16px;
        line-height: 21px;
    }

    .order-detail-complectation-embed .dropdown > .btn,
    .order-detail-complectation-embed .ut-toolbar-btn,
    .order-detail-complectation-embed button,
    .order-detail-complectation-embed .btn {
        min-height: 44px;
        border-radius: 10px;
    }

    .order-detail-complectation-embed > div[style*="align-items:center"] {
        flex-wrap: wrap;
        gap: 6px;
    }

    .order-detail-complectation-embed .kv-editable,
    .order-detail-complectation-embed .kv-editable-value,
    .order-detail-complectation-embed .form-control,
    .order-detail-complectation-embed .select2-container {
        max-width: 100% !important;
        min-height: 44px;
    }

    .order-detail-complectation-embed .complectation2-tree-scroll,
    .order-detail-complectation-embed .complectation-fact-tree-scroll,
    .order-detail-complectation-embed [class*="tree-scroll"] {
        width: 100%;
        max-width: 100%;
        height: auto !important;
        max-height: none !important;
        overflow-x: auto !important;
        overflow-y: visible !important;
        overscroll-behavior-x: contain;
        -webkit-overflow-scrolling: touch;
    }

    .order-detail-complectation-embed #article_tree_write,
    .order-detail-complectation-embed table.fancytree-container,
    .order-detail-complectation-embed .fancytree-container {
        min-width: 720px;
    }

    .order-detail-complectation-embed .dropdown-menu {
        max-width: calc(100vw - 32px);
        padding: 8px;
        border-radius: 12px;
    }

    .order-detail-complectation-embed .dropdown-menu > li > a {
        min-height: 44px;
        padding: 11px 12px;
        white-space: normal;
    }

    body:has(.order-detail-complectation-embed) .modal-dialog,
    body:has(.order-detail-complectation-embed) .swal2-popup,
    body:has(.order-detail-complectation-embed) .swal-wide {
        width: calc(100vw - 16px) !important;
        max-width: calc(100vw - 16px) !important;
        min-width: 0 !important;
        margin: 8px auto !important;
    }

    body:has(.order-detail-complectation-embed) .modal-content {
        max-height: calc(100dvh - 16px);
        border-radius: 16px;
        overflow: auto;
    }
}
