@media (max-width: 767px) {
    .menu-header {
        flex-direction: column;
        padding: 10px;
        height: auto;
        align-items: flex-start;
        gap: 10px;
    }
    
    .login-area {
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-end;
        width: 100%;
    }
    
    .login-area .wrap {
        margin: 10px 0px;
        width: 100%;
    }
    
    .main-content {
        margin: 110px auto;
        width: 100%;
        padding: 0px 10px;
    }
    
    .menu-list {
        top: 92px;
    }

    .menu-list .nav {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 15px;
    }

    .order-information-div ul.stepper {
        padding: 0px;
    }

    ul.stepper .step .step-content {
        margin-top: 20px;
        max-width: 100%;
    }

    .guest-login-div {
        flex-direction: column;
    }

    .create-account-form .nice-select.wide {
        margin-bottom: 24px;
    }

    .user-login-div,
    .total-summary.table,
    .order-summary.table,
    .details-table.table,
    .summary-page {
        max-width: 100%;
    }

    .details-table.table th.label {
        width: 45%;
    }

    .details-table.table td,
    .details-table.table th {
        padding: 10px;
    }

    .add-address {
        flex-direction: column;
        align-items: flex-start;
    }

    .myaccount-details-div form {
        padding: 40px 10px;
    }

    .change-password-div form {
        max-width: 100%;
    }

    .search-orders {
        flex-direction: column;
        align-items: flex-start;
    }

    .search-orders .submit-btn {
        text-align: center;
        margin: 0px auto;
    }

    .menu-items .card .card-body {
        padding: 4px;
    }

    .menu-items .card-img-top {
        object-fit: cover;
    }

    .group-order-div a {
        width: 160px;
        padding: 8px 2px;
        min-height: 40px;
    }

    .order-type-control a {
        min-height: 40px;
        height: auto;
        line-height: initial;
        padding: 7px;
    }

    .menu-order .btn-group {
        width: 160px;
    }

    .advance-order-btn {
        padding: 5px 2px;
    }

    .mobile-cart-icon {
        /* display: block; */
        position: absolute;
        bottom: 0;
        left: 0;
    }

    .mobile-cart-icon a.mycart-btn {
        padding: 7px;
        position: relative;
        border-radius: 50%;
    }

    .mobile-cart-icon span {
        position: absolute;
        top: -3px;
        right: -6px;
        background-color: #aecd37;
        border-radius: 60%;
        color: #000;
        padding: 2px 4px;
        font-size: 10px;
        font-weight: 600;
    }

    .back-to-home {
        margin-bottom: 10px;
    }

    .logon-page {
        padding: 0px;
    }

    .forget-password-div .checkbox-btn {
        margin-bottom: 0px; 
    }

    .guest-login-div {
        padding: 30px 15px;
    }

    .logon-page .user-login-div,
    .logon-page .forgot-form-div {
        border-left: none;
        border-top: 1px solid #e0e0e0;
        padding: 30px 15px;
    }

    .information-section {
        padding: 0px;
    }

    .payment-information-form form {
        max-width: 100%;
    }

    .forget-password-div {
        flex-direction: column;
    }

    .final-page {
        max-width: 100%;
    }

    .alert-popup {
        left: 0;
    }

    .coupon-code-div {
        justify-content: space-between;
    }
    
    .tool-show-left,
    .tool-show {
        width: 180px;
    }

    .tool-show-wrap {
        position: absolute;
      top: -10px;
        right: 30px;
        left: inherit;
    }
  
    .tool-parent .tool-show::before {
      content: '';
      display: block;
      position: absolute;
      right: -20px;
      left: inherit;
      top: 10%;
      width: 0;
      height: 0;
      border-bottom: 14px solid transparent;
      border-top: 14px solid transparent;
      border-left: 10px solid #ffffff;
      border-right: 10px solid transparent;
    }

    .all-coupons-div .active-coupon-div,
    .all-coupons-div .card {
        width: 100%;
    }

    .complete-order {
        flex-direction: column;
        gap: 10px;
        align-items: center;
    }

    .order-total-section {
        flex-direction: column;
    }

    .complete-order a {
        margin-left: 0;
    }

    .matrix-choice.active {
        padding: 5px;
        border: 1px solid #f89344;
        border-radius: 5px;
    }

    .guest-order-div .btn-green {
        margin-bottom: 15px;
    }

    .guest-order-div .guest-order-btn {
        white-space: nowrap;
    }

    .order-history-table .table td {
        display: block;
        border: none;
    }

    .order-history-table .table tbody tr {
        text-align: center;
        border-bottom: 1px solid #c7c7c7; 
    }

    .my-group-order-table .table tbody tr {
        display: flex;
        flex-direction: column;
    }

    .my-group-order-table .table tbody th {
        border: none;
    }

    .order-history-table .table thead {
        display: none;
    } 

    .order-no-label {
        display: block;
    }

    .footer .footer-tos {
        flex-direction: column;
    }

    .footer .footer-tos .btn-link {
        border: none;
    }

    .category-div.view-all .menu-items .card {
        max-width: 250px;
        width: 100%;
        margin: 10px auto;
    }

    .category-div .left-arrow,
    .category-div .right-arrow {
        width: 25px;
        padding: 0;
    }

    .modifier-group .matrix-choices .matrix-choice.label-name span {
        text-align: center;
    }

    .category-div .left-arrow,
    .category-div .right-arrow {
        top: 25%;
        height: 60%;
    }

    .complete-order.total-btn-div {
        flex-direction: column;
    }

    #launchModal .modal-section {
        padding: 0px;
        margin-bottom: 0px;
    }

    .order-information-div ul.stepper .step .step-title {
        font-size: 14px;
        padding: 18px 20px 18px 64px;
    }

    .loyalty-points-div {
        flex-wrap: wrap;
        gap: 10px;
        justify-content: flex-start;
    }

    .personal-info-display a.edit-personal-info-link {
        right: 0px;
        left: initial;
        bottom: -16px;
    }

    .radio-buttons {
        flex-direction: column;
    }

    .payment-options-buttons div {
        flex: initial;
    }

    .payment-options-buttons .checks.radio-btn {
        flex: initial;
    }

    #err_g-recaptcha,
    .g-recaptcha {
        max-width: 305px;
        padding-left: 0px;
        margin: 0px auto;
    }
}

@media (max-width: 375px) {
    .search-orders .select-div {
        flex-direction: column;
        gap: 10px;
        margin: 0px auto;
        align-items: center;
    }

    .search-orders .select-div p {
        margin: 10px 0px 0px 0px;
    }

    .search-orders .submit-btn {
        margin: 10px auto;
    }

    .search-orders .select-div .order_history_form-select,
    .search-orders .select-div .nice-select {
        margin-right: 0px;
        width: 200px;
    }

    .order-summary.table {
        table-layout: fixed;
    }

    .storeinfo-area {
        align-items: flex-start;
    }

    .menu-order .btn-group {
        margin: 0px 0px 10px 0px;
    }

    .category-div.view-all .menu-items .card {
        max-width: 300px;
        width: 100%;
        margin: 10px auto;
    }

    .address p {
        font-size: 12px;
    }

    .menu-list .nav-link {
        font-size: 18px;
    }

    .desktop-view {
        display: none;
    }
      
    .mobile-view {
        display: block;
    }
}

@media (min-width: 768px) and (max-width: 991px) {

    .carousel {
        border: none;
    }

    .mobile-cart-icon {
        position: relative;
        margin-right: 15px;
    }

    .mobile-cart-icon a.mycart-btn {
        padding: 7px;
        border-radius: 50%;
    }

    .mobile-cart-icon span {
        position: absolute;
        top: -3px;
        right: -6px;
        background-color: #aecd37;
        border-radius: 60%;
        color: #000;
        padding: 2px 4px;
        font-size: 10px;
        font-weight: 600;
    }

    .guest-order-div .btn-green {
        margin-bottom: 15px;
    }

    .guest-order-div .guest-order-btn {
        white-space: nowrap;
    }

    .forget-password-div {
        flex-direction: column;
    }

    .complete-order {
        gap: 10px;
    }

    .personal-info-display a.edit-personal-info-link {
        left: 50%;
    }

    .radio-buttons.payment-options-buttons {
        justify-content: space-between;
        flex-direction: column;
    }

    .payment-options-buttons div {
        flex: initial;
    }

    .payment-options-buttons .checks.radio-btn {
        flex: initial;
    }

    .order-history-table .table th {
        min-width: 120px;
    }

    .order-history-table .table td {
        white-space: nowrap;
    }

    .details-table.table th.label {
        width: 40%;
    }
    
    #err_g-recaptcha,
    .g-recaptcha {
        max-width: 100%;
        padding-left: 0px;
    }
}

@media (min-width: 1178px) {
    .order-history-table.table-responsive {
        overflow-x: inherit;
    }
}