@media only screen and (max-width: 1440px) {
    .nav-tabs-filter .filter-data .form-group {
        width: 100%;
        max-width: 200px;
    }
    .admin-main-layout main .main-admin {
        padding: 24px 20px;
    }
}
@media only screen and (max-width: 1200px) {
    .nav-tabs-filter {
        flex-direction: column-reverse;
        margin-top: 20px 0;
    }
    .nav-tabs-filter .filter-data {
        margin: 0;
    }
    .nav-tabs-filter .filter-data .form-group,
    .nav-tabs-filter .filter-data .search-wapper.form-group {
        width: 100%;
        max-width: 100%;
    }
    .communication-box .chart-side-bar {
        padding-right: 0;
    }
    .communication-box .side-list-message {
        max-width: 300px;
        min-width: 300px;
    }
    .edit-product-wapper {
        gap: 30px;
    }
}
@media only screen and (max-width: 1024px) {
    .bar-icon {
        display: flex;
    }
    .admin-main-layout .sidebar {
        position: fixed;
        top: 0;
        left: -100%;
        height: 100vh;
        z-index: 5;
        background: var(--white);
        transition: all 0.3s ease-in-out;
        padding-top: 50px;
    }
    .admin-main-layout::before {
        content: "";
        background: #00000059;
        width: 100%;
        height: 100vh;
        position: fixed;
        top: 0;
        left: -100%;
        z-index: 4;
        /* transition: all 0.2s ease-in-out; */
    }
    .sidebar-open .admin-main-layout::before {
        left: 0;
    }
    .sidebar-open .admin-main-layout .sidebar {
        left: 0;
    }
    .sidebar .close-btn {
        display: flex;
    }
    .all-table table tbody td,
    .all-table table thead th {
        padding: 12px 10px;
    }
    .settings-page .personal-info .personal-wapper {
        gap: 15px;
    }
    .headre-product .headre-product-wapper {
        gap: 10px;
    }
    .edit-product-wapper .add-product-infomation {
        padding: 30px 15px;
    }
    .edit-product-wapper .details-list {
        top: 30px;
    }
    .sidebar .search-box {
        display: none;
    }
}

@media only screen and (max-width: 767px) {
    .communication-box .chart-side-bar {
        border: 0;
        margin: 0;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 10;
        height: 100vh;
        background: var(--white);
        padding: 15px;
        display: none;
    }
    .communication-box .chart-side-bar.active {
        display: block;
    }
    .communication-box .cheat-box-wapper .back-btn {
        display: flex;
    }
    .communication-box .side-list-message {
        min-width: unset;
        max-width: 100%;
        width: 100%;
    }
    .settings-page .personal-info .personal-wapper {
        flex-direction: column;
    }
    .settings-page .personal-info .personal-wapper {
        padding-bottom: 30px;
        margin-bottom: 30px;
    }
    .switch-order-list .switch-order-item .switch-info {
        gap: 15px;
    }
    .settings-page .profile-info,
    .settings-page .personal-info {
        padding: 0 15px;
    }
    .settings-page .profile-info .images-box {
        width: 120px;
        height: 120px;
        border: 4px solid var(--white);
        margin-right: 10px;
    }
    .settings-page .profile-info {
        margin-top: -20px;
    }
    .settings-page .profile-info .content-profile h3 {
        font-size: 24px;
        line-height: 28px;
    }
    .settings-page .settings-banner {
        padding-top: 25%;
        position: relative;
    }
    .paymentmethod .card-details {
        flex-direction: column;
        gap: 20px;
    }
    .requestpayment-list {
        max-width: 100%;
    }
    .dimensions-row {
        gap: 16px;
    }
    .edit-product-wapper {
        display: block;
    }
    .edit-product-wapper .details-list {
        display: flex;
        align-items: center;
        overflow: auto;
        gap: 10px;
        margin-bottom: 30px;
        padding-bottom: 5px;
        position: relative;
        top: 0;
    }
    .edit-product-wapper .details-list .nav-link a {
        margin-bottom: 0;
        padding: 4px 10px;
        white-space: nowrap;
    }
    .add-product-infomation .accordion .accordion-item .accordion-header,
    .add-product-infomation .accordion .accordion-item {
        margin-bottom: 24px;
    }
    .add-product-infomation .details-form .form-group {
        margin-bottom: 16px;
    }
    .headre-product .headre-product-wapper .publish-box {
        gap: 10px;
    }
    .headre-product .headre-product-wapper .main-title h4 {
        font-size: 20px;
        line-height: 24px;
        font-weight: 500;
        margin-bottom: 5px;
    }
    .add-product-infomation .image-preview .preview-item {
        max-width: 33.33%;
    }
    .settings-page .settings-banner.addprofile-banner {
        padding: 60px 15px;
    }
    .free-shipping-list .free-shipping-item {
        padding-top: 20px;
        margin-top: 20px;
    }
    .free-shipping-list .free-shipping-item h3 {
        font-size: 20px;
        line-height: 24px;
        margin-bottom: 15px;
    }
    .edit-product-wapper .add-product-infomation {
        padding: 0;
    }
    .main-edit-product .edit-product-wapper {
        height: auto;
        margin-top: 50px;
    }
    .category-list-popup .modal-header {
        padding: 20px 16px;
    }
    .category-list-popup .modal-header h3 {
        font-size: 24px;
    }
    .category-list-popup .modal-body {
        padding: 10px 16px;
    }
    .category-list-popup .modal-footer {
        padding: 0 16px 16px;
    }
}

@media only screen and (max-width: 640px) {
    .order-view-popup .modal-header {
        padding: 40px 15px 15px;
    }
    .order-view-popup .order-title .back-button {
        top: 15px;
    }
    .order-view-popup .modal-body {
        padding: 15px;
    }
    .order-view-popup .modal-footer {
        padding: 8px 15px 15px;
    }
    .summary-info-box .billed-list {
        padding: 16px;
    }
    .order-view-popup .fulfilled-id .id-status-drop h5 {
        font-size: 20px;
        margin-right: 10px;
    }
    .brands-alt-box {
        bottom: 20px;
        right: 20px;
    }
    .headre-product .headre-product-wapper {
        flex-wrap: wrap;
        justify-content: center;
        gap: 0;
    }
    .headre-product .headre-product-wapper .main-title {
        width: 100%;
        order: 1;
        margin-bottom: 20px;
    }
    .headre-product .headre-product-wapper .cancel-box {
        max-width: unset;
        width: fit-content;
        order: 2;
        margin-right: 10px;
    }
    .headre-product .headre-product-wapper .publish-box {
        order: 3;
    }
    .add-product-infomation .accordion .accordion-item .accordion-button h6 {
        font-size: 18px;
        line-height: 24px;
    }
    .add-product-infomation .image-preview .preview-item {
        max-width: 50%;
    }
    .leave-editor-popup .modal-dialog .modal-body {
        padding: 15px;
    }
    .leave-editor-popup h3,
    .import-products-popup .modal-body .title h2 {
        font-size: 20px;
        line-height: 28px;
    }
    .leave-editor-popup .button-group {
        margin-top: 20px;
    }
    .import-products-popup .modal-dialog .modal-body {
        padding: 40px 15px 15px;
    }
    .delivery-option-popup .modal-body {
        padding: 40px 15px 15px;
    }
    .delivery-option-popup .popup-title h3 {
        font-size: 24px;
        line-height: 28px;
    }
    .delivery-option-popup .option-item {
        margin-bottom: 20px;
        padding: 10px;
    }
    .flat-rate-popup .depending-title h4 {
        font-size: 24px;
        line-height: 28px;
    }
    .flat-rate-popup .modal-body {
        padding: 40px 15px 0;
    }
    .flat-rate-popup .modal-footer {
        padding: 15px;
    }
    .settings-page .personal-info .button-group {
        gap: 15px;
    }
    .settings-page .personal-info .button-group .dark-btn {
        min-width: inherit;
        width: 100%;
        padding: 11px;
    }
    .settings-page .personal-info .personal-wapper .personal-form {
        padding: 20px 15px;
    }
    .add-category-section .add-list-category li {
        min-width: 200px;
    }
    .order-summary-list .order-summary-item {
        padding: 16px;
    }
}
@media only screen and (max-width: 514px) {
    .right-popup .modal-dialog {
        margin: 0 0 0 30px;
        height: 100%;
    }
    .order-summary-list .order-summary-item .images {
        margin-right: 10px;
    }
    .order-summary-list
        .order-summary-item
        .product-info
        .qty-price.refund-price {
        flex-direction: column;
    }
}
@media only screen and (max-width: 420px) {
    .order-summary-item .product-info .product-title {
        flex-direction: column;
        align-items: flex-start;
    }
}