/*
 * @copyright Copyright (c) 2025 OCEAN'S SAS
 * @license   Commercial paid license – All rights reserved
 *
 * Email: contact@oceans-partners.com
 *
 * This file is part of the SaaS solution APP4FREIGHT,
 * a multimodal international freight solution.
 *
 * APP4FREIGHT is a commercial solution under a paid license,
 * offering several plans: Free, Paid Plan 1, Paid Plan 2.
 *
 * Any unauthorized use, reproduction, or distribution
 * is strictly prohibited.
 */

@media (max-width: 767px) {
    div.dt-processing {
        top: 63% !important;
        left: 52% !important;
    }

    .file-name-span{
        overflow-x: hidden;
        width: 190px;
        text-overflow: ellipsis;
    }
    .back-to-tabpane {
        border-bottom: 1px solid var(--bs-border);
        height: 50px;
    }

    #MediaCrop .modal-dialog,
    #OfficeLogoCrop .modal-dialog,
    #EmailingLogoCrop .modal-dialog #ProfileLogoCrop .modal-dialog {
        height: 800px !important;
        margin-top: 120px !important;
    }

    #MediaCrop .modal-content,
    #OfficeLogoCrop .modal-content,
    #EmailingLogoCrop .modal-content #ProfileLogoCrop .modal-content {
        max-height: unset !important;
    }

    .print-invoice,
    .add-payment-btn,
    .download-invoice {
        width: 27px !important;
        height: 24px !important;
    }

    .container-drag-drop .select-label {
        line-height: 0;
    }

    .other-page-footer,
    .office-pages-header,
    .searchBloc {
        display: none !important;
    }

    .views-container,
    .configuration-layout {
        margin-top: unset !important;
    }

    .detail-dashboard {
        position: relative !important;
        right: unset !important;
        left: unset !important;
        bottom: unset !important;
        top: unset !important;
        flex-wrap: wrap;
    }

    .bloc-shipmentTable {
        width: 100% !important;
    }

    .card-dashboard {
        width: 100% !important;
        margin-bottom: 6%;
    }

    .bloc-map {
        width: 100% !important;
        height: 253px !important;
    }

    .content-dashboard .dropdown,
    .date-input {
        width: 215px !important;

    }

    .dashboard-status {
        width: 48.5% !important;
        padding-bottom: 5px;
        border-radius: 6px;
        background: #ECF4FCB2;

    }

    .vertical-border {
        height: 0.5px !important;
        padding: 0 !important;
        background-color: var(--bs-container-border-color) !important;
        width: 100% !important;
    }

    .action-preference.tabPaneBoutons {
        top: 10%;
    }

    .logout-menu-item {
        position: fixed;
        bottom: 3%;
        width: 316px;
    }

    .offices-content .card-title,
    .bloc-carrier .card-title {
        font-size: 12px !important;
    }

    .sectionavatar {
        order: 1;
    }

    .sectionForm {
        order: 2;
    }

    .position-photo {
        transition: 0.5s;
        cursor: pointer;
        left: 37%;
    }

    .change-photo {
        left: 27%;
        top: 55%;
    }

    .position-drawer-content,
    #add_office .content-card,
    #add_new_address .content-card,
    #add_user .content-card,
    #add_account_bank .content-card,
    #drawer_create_user .content-card {
        top: 10%;
        bottom: 0;
        left: 0;
        right: 0;
        overflow: scroll;
        overflow-x: hidden;
        height: unset !important;
    }

    .transport-mode div {
        font-size: 10px !important;
        font-weight: 600 !important;
    }

    .is-consolidate-label {
        font-size: 12px !important;
    }

    .overflow-tab {
        overflow: scroll;
        overflow-x: hidden;
    }

    #dg-goods-table th {
        font-size: 12px !important;
    }

    .shipping-type {
        font-size: 13px !important;
        font-weight: 400 !important;
    }

    .alert-title-1 {
        font-size: 14px !important;
    }

    .item-title {
        font-size: 12px !important;
    }

    .check-container {
        font-size: 12px !important;
    }

    .dt-column-title,
    table thead th {
        font-size: 12px !important;
        font-weight: 500 !important;
    }

    .shipment-info .btn-open-drawer {
        font-size: 12px !important;
    }

    .timeline-label .timeline-badge {
        width: 2.5rem !important;
    }

    table th,
    table td {
        height: 38px !important;
    }

    .title-from-to {
        font-size: 14px !important;
        line-height: 21px !important;
    }

    #sim-doc-table {
        margin-left: -10px !important;
        margin-right: 0px !important;
        width: 107% !important;
    }

    .plane-icon-container {
        transform: rotate(224deg);
    }

    .items-direction {
        transform: rotate(180deg);
    }

    .price.info-pack {
        bottom: 0 !important;
        top: unset !important;
    }

    .label-shipment {
        font-weight: 600 !important;
    }

    .shipmentsContainer .info-pack {
        font-size: 10px !important;
    }

    .container-direction {
        transform: rotate(270deg);
        bottom: 56% !important;
        right: 78% !important;
        left: unset !important;
    }

    #add_shipment .plane-icon {
        width: 16px !important;
        height: 16px !important;
    }

    .alert-title-bold {
        font-size: 18px !important;
    }

    .shipment-info .dt-info {
        text-align: left !important;
        padding-left: 10px !important;
    }

    .mb-20px {
        margin-bottom: 20px !important;
    }

    .simulation-alert {
        padding-left: 5px !important;
        padding-right: 5px !important;
        bottom: 0;
        height: 451px;
    }

    .simulation-alert.swal2-popup .swal2-html-container,
    .swal2-popup .swal2-content {
        margin-bottom: unset !important;
    }

    .simulation-alert .success-title {
        font-size: 18px !important;
    }

    .text-request-sim {
        font-size: 14px !important;
    }

    .simulation-alert .swal2-image {
        margin-bottom: unset !important;
    }

    .cancelButton,
    .editButton,
    .newButton {
        font-size: 12px !important;
    }

    .newButton {
        min-width: 123px;
    }

    .editButton,
    .cancelButton {
        min-width: 70px;
    }

    .dt-search .btn-group .dropdown-menu {
        left: 0px !important;
    }

    div.dt-container div.dt-paging ul.pagination {
        justify-content: center !important;
        margin-top: 7% !important;
    }

    .timeline-label:before {
        left: 6px !important;
    }

    .fixed-column-th,
    .fixed-column-td {
        right: -3px !important;
    }

    .calcul-container {
        width: 100% !important;
    }

    .continue-btn,
    .back-btn {
        flex: 0 0 auto;
        width: 50%;
    }

    .chat,
    .summary {
        height: 33px;
    }

    .summary-request {
        width: 33px !important;
    }

    .position-tab-content {
        bottom: 50px !important;
    }

    .drawer-class .card .card-header .card-title {
        font-size: 14px !important;
        line-height: 21px !important;
        max-width: 200px;
        text-wrap: nowrap;
        overflow-x: hidden;
        text-overflow: ellipsis;
    }

    .form-select.form-select-solid {
        height: 40px;
    }

    .tabPaneBoutons {
        width: 100%;
        right: 0%;
        background-color: white;
        bottom: 0;
    }

    .showContentRequest .tabPaneBoutons {
        right: unset !important;
        left: unset !important;
        background-color: transparent !important;
        padding-right: 1.5% !important;
        padding-left: 4% !important;
        bottom: 0 !important;
    }

    #kt_app_footer .menu-link {
        font-size: 9px !important;
    }

    .bloc-form {
        margin-bottom: 20px !important;
    }

    form .form-label {
        font-size: 12px !important;
    }

    .app-header .btnTwo,
    .app-header .btnOne {
        background: none !important;
        border: unset !important;
        color: unset !important;
    }

    .next-back-from-to,
    .back-btn-service,
    .border-next-back {
        border-bottom: 1px solid var(--bs-container-border-color);
    }

    .bg-md-white {
        background-color: unset !important;
    }

    .transport-mode {
        font-size: 10px !important;
    }

    .heading-page-title {
        line-height: unset;
        font-size: 14px;
        font-weight: 600;
    }

    .line-tabpane {
        width: 81% !important;
        top: 26px;
    }

    .master-data .line-tabpane {
        width: 630px !important;
        top: 26px;
    }

    .manageshipment .line-tabpane {
        width: 97% !important;
        top: 26px;
    }

    .content-show-shipment .line-tabpane {
        width: 425px !important;
        top: 26px;
    }

    .nav-link:not(.terms-link):not(.simple-nav-link):not(.horizontal-tab-link):not(.horizontal-nav-li):not(.btn-customer) {
        padding: unset !important;
        font-size: 10px !important;
    }

    .size-tabpane-mobile {
        font-size: 10px !important;
    }

    .dt-search {
        position: relative !important;
        float: right !important;
    }

    .listTabs .nav-tabs {
        overflow: visible;
    }

    .nav-tabs:not(.horizontal-tab) {
        overflow: auto;
    }

    .btn-add-from-to {
        width: 180px;
    }

    .check-label {
        font-size: 12px;
        line-height: 18px;
    }

    .typography {
        font-size: 12px;
    }

    .container-info {
        height: 70vh;
    }

    .borderList {
        border-right: 0;
    }

    .container-info-sm {
        height: 78vh;
    }

    .container-info-lg {
        height: 100vh;
    }

    .chat-right {
        right: 25px;
    }

    .bg-body {
        border-radius: var(--bs-border-radius-lg) !important;
    }

    .coverAccount {
        object-fit: cover;
        height: 15vh !important;
    }

    .containerInfoPlace {
        height: 85px;
    }

    .app-wrap {
        margin-left: 0 !important;
    }

    .createUploadBtn {
        width: 95%;
    }

    .drawer {
        overflow: unset;
        border-top-left-radius: 10px !important;
        border-top-right-radius: 10px !important;
    }

    .checked-icon,
    .origin-icon {
        background-color: white !important;
        border: 2px solid white;
        border-radius: 50% !important;
    }

    .show-shipment .flagdeparture,
    .show-shipment .flagarrival {
        width: 20px;
        height: 20px;
        border-radius: 50%;
        background-image: var(--bgimg);
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        position: absolute;
    }

    .show-shipment .flagarrival {
        width: 20px;
        height: 20px;
        border-radius: 50%;
        background-image: var(--bgimg);
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        position: absolute;
    }

    .show-shipment .flagdeparture {
        right: 19%;
        bottom: -1%;
    }

    .forgetPassword a {
        font-size: 12px;
        line-height: 18px;
    }

    .divterms a,
    .footer-connexion a,
    .regitration a {
        font-size: 12px;
    }

    .login-control label {
        font-size: 12px;
        line-height: 18px;
    }

    .login-control input,
    .h-register {
        font-size: 12px;
        line-height: 18px;
    }

    .company .nav-item .btn-customer {
        padding: calc(0.3rem + 4.5px) calc(0.7rem) !important;
        color: var(--bs-text-dark) !important;
        font-family: var(--bs-font-poppins);
        font-size: 14px !important;
        font-weight: 600;
        line-height: 21px;
    }

    .stepper-vertical {
        min-width: 100%;
    }

    .div-time,
    .bloc-time-input {
        width: 44.5% !important;
    }

    #opening_days .heure-time {
        width: 100%;
    }

    #opening_days .text-time {
        font-family: var(--bs-font-poppins);
        font-size: 12px;
        font-weight: 600;
        line-height: 18px;
        color: var(--bs-blue--text);
    }

    .preference .tabPaneBoutons {
        left: unset;
        bottom: -15%;
    }

    .privacy {
        padding-top: 5%;
        padding-left: 9.5%;
    }

    .position-enable {
        position: absolute;
        left: -0.5%;
        top: 35%;
    }

    .position-modal {
        position: relative;
        top: 24%;
        left: 0;
        box-shadow: 0px 4px 74px 0px #00000040;
        border-radius: 10px;
    }

    .position-modal .tabPaneBoutons {
        width: unset;
        right: 1%;
    }

    .content_devices .position-modal .tabPaneBoutons {
        width: unset;
        position: relative;
        bottom: 9%;
    }

    .action-security {
        bottom: 0;
        position: relative;
        left: 0;
    }

    .nav-tracking-msg .nav-link:not(.terms-link) {
        padding: calc(0.775rem) calc(1.5rem) !important;
    }

    #twoFactorModal .modal-dialog {
        width: 97%;
        position: relative;
        top: 30%;
        left: 0;
    }

    #enableQrCode,
    .devices {
        width: 100%;
    }

    #twoFactorModal .modal-footer .tabPaneBoutons {
        bottom: 7%;
        right: 2.2%;
        width: unset;
    }

    #add_user_document {
        width: 413px !important;
    }

    .requestList .shipment-claim-clickable .depart {
        position: absolute;
        top: 0 !important;
        left: 15px !important;
    }

    .requestList .shipment-claim-clickable .date-departure {
        position: absolute;
        top: 24% !important;
        left: 4.2% !important;
    }

    .requestList .shipment-claim-clickable .bleu-circle {
        left: 16px !important;
        top: 69% !important;
    }

    .requestList .shipment-claim-clickable .arrival {
        top: 65% !important;
        left: 14px !important;
    }

    .requestList .shipment-claim-clickable .date-arrival {
        left: 4% !important;
        top: 88% !important;
    }

    .requestList .shipment-claim-clickable .primary-circle {
        left: 1px !important;
        margin-left: unset !important;
    }

    .shipment-content-claim {
        top: 0 !important;
    }

    #transaction-quotation-form {
        width: 100%;
    }
}

@media (max-width: 991px) {
    .app-wrap {
        margin-left: 0 !important;
    }

    #kt_app_sidebar {
        z-index: 100;
    }
}

@media (min-width: 768px) {
    .editable-container:before {
        top: -15px;
    }

    .div-textarea {
        top: -20px;
        position: relative;
    }

    #otherPages {
        display: none;
    }

    .dt-search {
        position: relative !important;

        float: right !important;
    }

    .tabPaneBoutons .tabPaneBouton2,
    .tabPaneBoutons .tabPaneBouton1 {
        min-width: 88px !important;
        width: auto;
    }

    .bloc-items-footer {
        justify-content: center;
    }
}