/* LARGE DEVICES */

@media only screen and (max-width: 992px) {
  .dashboard-sidebar {
    position: absolute !important;
    width: 100vw !important;
    transform: translateX(-100%);
    transition: all 200ms;
    z-index: 1000;
    background-color: white;
  }

  .dashboard-sidebar img {
    width: 20% !important;
  }

  .dashboard-body {
    width: 100vw !important;
    transform: translateX(0%);
  }

  .dashboard-sidebar-show {
    transform: translateX(0%);
  }

  .dashboard-sidebar-links-grp {
    align-items: center;
  }

  .dashboard-sidebar-links-grp > a {
    border-radius: 0px !important;
    padding: 0.5rem 7rem !important;
  }

  .dashboard-sidebar-links-grp > a > p {
    margin: 0 !important;
  }

  .dashboard-company-logo {
    align-items: center !important;
    justify-content: center !important;
  }

  .product-overlay {
    opacity: 1;
    background: transparent;
  }

  .login-page {
    flex-grow: 1;
    height: 100%;
  }

  .login-page > .login-form-section {
    width: 100%;
    flex-grow: 1;
    align-items: center;
    /* border: 2px solid red; */
  }
  .login-page > .login-form-section > div {
    width: 100% !important;

    padding: 0rem 1rem;
  }

  .login-page-logo {
    display: none;
  }

  .products-page-search-div {
    width: 75% !important;
  }
  .overlay {
    opacity: 1;
  }
  .login-page-logo {
    display: none;
  }

  .all-category {
    /* width: 100% !important; */
  }

  .information > ul > li > p {
    display: none;
  }

  .cart{
    width: 100vw !important;
  }
  .place-order{
    width: 100% !important;
  }
  .input__field > div{
    width: 100%;
  }

  .input__field-group > img{
    width: 50% !important;
  }

  .login-page-div > div{
    width: 90%;
  }

  .border-lg-end{
    border-right: 0px solid;
  }
  .w-lg-50{
    width: 100%;
  }

  .hidden-lg{
    display: none !important;
  }

  .sidebar-link-logout{
    /* left: 50%; */
    position: relative;
    width: max-content;
    /* transform: translateX(-50%); */
  }

  .notification-div{
    width: 35vw;
  }

  .notification-div-dashboard{
    left: -100%;
  }


  .addToCartBtn{
    display: none;
  }

  .product:hover .addToCartBtn {
    opacity: 0;
  }

  .look {
    opacity: 0;
  }

  .product:hover .look {
    opacity: 1;
  }

  .earth{
    height: 100vh !important;
    width: fit-content !important;
    object-fit: cover;
    object-position: -100% 0%;
  }

  .dropdown-container{
    position: absolute;
    transform: translateX(-150%);
    top: 120%;
    background-color: white;
    border: 1px solid #ddd;
    transition: all 200ms;
  }

  .all-products-sidebar-dropdown-container-show{
    transform: translateX(-0%);
    width: 85vw !important;
    background: #fff;
    z-index: 1000;
    max-height: 100vh;overflow-y: auto;
  }

  .shop-owner-products-search{
    width: 50%;
  }

  .shop-owner-products-name-container{
    width: 100% !important;
  }

  .product .details h5 {
    width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: initial;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }

  .text-wrap{
    width: 100%;

  }

  .product-card + .card-body > h5 {
    width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: initial;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }

  .product .details h1 {
    width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: initial;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }

  .search-result-text{
    width: 100%;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: initial;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
  }

  .search-result-img-container{
    width: 20%;
  }

  .search-result-text-container{
    width:60%
   }

  .add-to-cart-btn{
    width: 100%;
    text-align: center;
  }

  .all-products-sidebar{
    width: 100%;
  }

  .w-full{
    width: 100% !important;
  }
}

/* SMALL DEVICES */
@media only screen and (max-width: 576px) {

  .header-search-container{
    width: 90vw !important;
  }


  .product-details-carousel > div {
    width: 100% !important;
    margin-right: 0px !important;
  }

  .product-details-carousel > div > div {
    width: 100% !important;
  }

  .product-details-carousel > div > #productsDetailsCarousel {
    width: 80% !important;
  }

  .product {
    height: 25rem !important;
    /* width: 100%; */
    text-align: center;
  }

  .product > .img {
    width: 100% !important;
    /* height: 15rem; */
  }

  .addToCartBtn{
    opacity: 0;
    display: none;
  }

  .product:hover .addToCartBtn {
    display: none;
    opacity: 0;
  }

  .look {
    opacity: 0;
  }

  .product:hover .look {
    opacity: 1;
  }

  .details > p {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0 !important;
  }

  .details .price,
  .details .buy {
    position: relative !important;
    right: 50%;
    /* top: 0; */
    display: block;
    opacity: 1;
  }

  .details .price {
    right: 0%;
    transform: translateX(-0%);
    margin-bottom: 0.5rem;
  }

  .details .buy {
    right: 50%;
  }

  .company-logo > img {
    width: 40% !important;
  }

  .footer-body {
    flex-direction: column !important;
    flex-wrap: nowrap;
    height: fit-content !important;
  }

  .footer-body > div {
    max-width: 100% !important;
    width: 100% !important;
    /* border: 1px solid orange; */
    align-items: flex-start !important;
  }

  .settings-page-main-section > div{
    width: 100% !important;
    align-items: flex-start !important;
    padding: 0;
  }

  .dashboard-details > div{
    width: 100% !important;
  }

  .all-products-sidebar{
    width: 100% !important;
  }

  .dropdown-container{
    position: absolute;
    transform: translateX(-150%);
    top: 120%;
    background-color: white;
    border: 1px solid #ddd;
    transition: all 200ms;
  }

  .all-products-sidebar-dropdown-container-show{
    transform: translateX(-0%);
    width: 94vw !important;
    background: #fff;
    z-index: 1000;
    max-height: 100vh;overflow-y: auto;
  }
  .earth{
    height: 100vh !important;
    width: fit-content !important;
    object-fit: cover;
    object-position: -100% 0%;
  }

  .border-lg-end{
    border-right: 0px solid;
  }
  .w-lg-50{
    width: 100%;
  }

  .hidden-sm{
    display: none !important;
  }

  .product-chevron-prev{
    height: fit-content;
    border:0px;
    background-color: transparent;
    bottom: -10% !important;
    left: 0%;
    width: fit-content;
  }

  .product-chevron-next{
    width: fit-content;
    height: fit-content;
    border:0px;
    background-color: transparent;
    bottom: -10%;
    left: 10%;
  }

  .notification-div{
    width: 80vw;
    transform: translateX(-80%);
  }

  .notification-div-dashboard{
    left: -100%;
  }

  .shop-owner-products-search{
    width: 75%;
  }

  .product .details h5 {
    width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: initial;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }

  .text-wrap{
    width: 100%;
  }

  .product-card + .card-body > h5 {
    width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: initial;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }

  .product .details h1 {
    width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: initial;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }

  .search-result-text{
    width: 100%;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: initial;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
  }

  .search-result-img-container{
    width: 30%;
  }

 .search-result-text-container{
  width:60%
 }

  .add-to-cart-btn{
    width: 100%;
    text-align: center;
  }

  .all-products-sidebar{
    width: 100%;
  }
  .w-full{
    width: 100% !important;
  }
}