/*== CSS spécifique au reponsive*/
/*==-----------------------------------*/
/**!*/
div:where(.swal2-container) input:where(.swal2-input) {
  margin:  0 !important;
}
/*!**/
/*===================================*/
/*== Liste nav du bloc contextuel*/
/*===================================*/
/**!*/
@media (max-width: 768px) {
  span.liste {
    height: auto;
    display: block;
  }
  .list-group {
    -ms-flex-direction: row;
    flex-direction: row;
  }
}

/*
===================================
== Navbar
===================================
 */
@media (min-width: 768px) {
  .sidebar {
    z-index: 1;
    position: absolute;
    width: 250px;
    margin-top: 51px;
  }
  .navbar-top-links .dropdown-messages,
  .navbar-top-links .dropdown-tasks,
  .navbar-top-links .dropdown-alerts {
    margin-left: auto;
  }
}
/*
===================================
== Calendrier
===================================
 */
@media screen and (min-width: 768px) {
  .__vev_calendar-wrapper .cal-wrapper .date-num {
    line-height: 32px!important;
  }
}
@media (max-width: 767px) {
  ul.timeline:before {
    left: 40px;
  }
  ul.timeline > li > .timeline-panel {
    width: calc(10%);
    width: -moz-calc(10%);
    width: -webkit-calc(10%);
  }
  ul.timeline > li > .timeline-badge {
    top: 16px;
    left: 15px;
    margin-left: 0;
  }
  ul.timeline > li > .timeline-panel {
    float: right;
  }
  ul.timeline > li > .timeline-panel:before {
    right: auto;
    left: -15px;
    border-right-width: 15px;
    border-left-width: 0;
  }
  ul.timeline > li > .timeline-panel:after {
    right: auto;
    left: -14px;
    border-right-width: 14px;
    border-left-width: 0;
  }
}
.__vev_calendar-wrapper {
  height: calc( 100% - 35px );
}
/*
===================================
== KEYPAD
===================================
 */
@media (max-width: 1500px) {
  #calc-board button.btn {
    padding-top: 0;
    padding-bottom: 0;
  }
  .btn {
    /*line-height: 3rem;*/
  }
}
@media (max-width: 1200px) {
  button.btn {
    font-size: 0.8rem;
    /*line-height: 3rem;*/
  }
}
@media (max-width: 1024px) {
  .fixed tbody {
    height: 435px;
  }
  .fixed-payments tbody {
    height: 212px;
  }
  #calc-board {
    display: none;
  }
  #calc-board-ipad {
    display: block;
  }
  #calc-board-mobile {
    display: none;
  }
  .uneditable-input {

  }
  button.btn {
    font-size: 0.7rem;
    /*line-height: 1.5rem;*/
  }
  .btn {
    line-height: 2rem;
    width: 33.3%!important;
  }
}

@media (max-width: 540px) {
  #calc-board {
    display: none;
  }
  #calc-board-ipad {
    display: none
  }
  #calc-board-mobile {
    display: block;
  }
  button.btn {
    font-size: 0.7rem;
    line-height: 1.8rem;
  }
  .uneditable-input {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-left: 0.35rem;
    padding-right: 0.35rem;
    line-height: normal;
  }
  .bg-keypad-mobile {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #planning .cal-events {
    max-height: 350px;
    margin-top: 15px!important;
    margin-bottom: 15px!important;
  }
  .__vev_calendar-wrapper .events-wrapper .date {
    font-size: unset!important;
  }
}
@media (min-height: 615px) and (max-height:858px) {
  .btn {
    line-height: 1.9rem;
  }
}

/*
===================================
== PAYMENT
===================================
 */
@media (max-width: 768px) {
  .bloc-documents .spin-in {
    display: inline-block;
  }
  .spin-out .bloc-document {
    display: inline-block;
  }
  .bloc-payments .swiper-container {
    width:100%;
  }
}
/*
===================================
== PRODUITS/CATEGORIES
===================================
 */
@media (max-width: 768px) {
  .searchlist-product {
    width: 100%;
  }
}

@media (max-width: 768px) {
  .cart-table th, .cart-table input[type="number"], .cart-table td.td-number {
    font-size:10px;
  }
  .payment-list-table th {
    font-size:10px;
  }
  .payment-list-table td .icon-close {
    font-size:15px;
  }
}


/*
===================================
== MODALE RESPONSIVE
===================================
 */
.dialog-responsive {
  width: 80% !important;
}
@media screen and (max-width: 1366px) {
  .modale-big {
    width: 95% !important;
  }
}
@media screen and (max-width: 768px) {
  .dialog-responsive {
    width: 100% !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
}
/*
===================================
== MODALE NOUVELLE CAISSE
===================================
 */
@media screen and (min-width: 1366px) {
  .video-presentation {
    width: 560px;
    height: 315px;
  }
}
/*
===================================
== MODALE ACCESS RIGHT
===================================
 */
@media screen and (max-width: 768px) {
  .access-right.dialog-responsive {
    width: 100% !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    height:100% !important;
  }
}


/* ===================================
== MODALE tour
=================================== */
.welcomeDialog {
  margin-top: 5vh !important;
}
/* ===================================
== MODALE Signature
=================================== */

.modale-signature {
  margin-top: 5vh !important;
}

@media screen and (max-width: 1112px) {
  .modale-signature {
    margin-top: 2%!important;
  }
}
@media screen and (max-width: 450px) {
  .dialog-responsive.modale-signature {
    margin-top: 0!important;
    height: auto!important;
  }
}
/*
===================================
== MODALE CHOIX DE ZONE
===================================
 */
.modale-choose-zone {
  width: 30% !important;
  height: fit-content !important;
}
@media screen and (max-width: 768px) {
  .modale-choose-zone {
    width: 90% !important;
  }
}
/*
===================================
== BLOC MEMBRE
===================================
 */
@media (max-width: 768px) {
  .icon.photo {
    font-size: 4rem;
  }
}

@media (max-width: 585px) {
  .icon.photo {
    font-size: 3rem;
  }
}

@media (max-width: 1112px) {
  .el-form-item__error {
    display: none;
  }
  .el-form-item__warning {
    display: none;
  }
}

/*
===================================
== GENERAL
===================================
 */
@media only screen and (orientation:landscape){
  html {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
    height: 100%;
  }
}
@media (max-width: 992px) {
  .section-cart {
    position: relative;
    top: 0;
  }
  .section-payment {
    position: relative;
    margin-left: 0;
  }
}
@media (min-width: 768px) {
  #page-wrapper {
    position: inherit;
  }
}
.overlay-content .el-input__inner {
  color: #ffffff !important;
}
/*Permet d'enlever le scroll sur le body qd la modale est ouverte*/
.el-popup-parent--hidden {
  height: 100vh !important;
}

/*
===================================
== Gestion des hauteurs de blocs selon les résos => partie droite keypad - block fonctionel - produits
===================================
 */
@media (min-height: 615px) and (max-height:960px) {
  :root {
    --btn-line-height: 2.6rem;
  }
}

@media (min-height: 615px) and (max-height: 910px) {
  :root {
    --product-height: 3rem;
    --btn-line-height: 2.7rem;
  }
  /* No category divider in product swipper */
  .categories-and-products .category-divider {
    display: none !important;
  }
  .product.only-product {
    padding: 5px;
  }
  .product.only-product .product-wrapper {
    align-items: flex-start;
    text-align: left;
  }
}

@media (max-width: 1366px) {
  .categories-and-products .product img {
    display: none !important;
  }
}

@media (min-height: 615px) and (max-height:810px) {
  :root {
    --btn-line-height: 2.3rem;
  }
}

/*RESO XS - Ecrans nains */
@media (min-height: 600px) and (max-height:730px) {
  :root {
    --btn-line-height: 2.1rem;
    --product-height: 3rem;
    --product-height-caisse-free: 4rem;
  }
}

@media (min-height: 600px) and (max-height:700px) and (hover: hover) {
    /*On passe sur deux lignes sur des petites resolutions*/
    /* Comme on veut 4 lignes sur ipad on rajoute le hover: hover qui permet de cibler uniquement des appareils qui ont un mécanisme de survol */
    #categories-and-products .swiper-container {
      height: calc(var(--product-height) * 2)!important;
    }
    :root {
      --btn-line-height: 1rem;
    }
    .categories-and-products .swiper-container {
      scroll-snap-type: none;
      -webkit-scroll-snap-type: none;
      -webkit-overflow-scrolling: unset;
    }
    .categories-and-products .snap-scroll-item {
      scroll-snap-align: none;
      scroll-snap-stop: unset;
      overflow: unset;
    }
    .uneditable-input {
      line-height: 2.2rem;
    }
    button.btn-2 {
      line-height: 2rem;
    }
    button.btn {
      line-height: 2rem;
    }
}

  /*
  ===================================
  == Gestion des hauteurs de blocs selon les résos
  ===================================
   */

/*RESO HD*/
@media (min-height: 860px) {
  .cart-table tbody, .pending-cart-table tbody {
    overflow-y: auto;
  }
  .height-responsive-ham {
    display: none !important;
  }
}

@media (max-width:970px) {
  .ul-menu-note li {
    width: auto;
  }
  #pendingCartNavbar .icon-note {
    display: block;
  }
}

@media (max-width:1200px) {
  #responsive-header {
    height: 0;
  }
  #pendingCartNavbar .height-responsive-ham {
    display: none;
  }
}

.deciham-is-open {
  height: 100vh;
  overflow-y: hidden;
}

.height-responsive-ham {
  display: block !important;
}
.height-responsive-ham .deciham {
  margin: 25px 15px 0px 15px !important;
}
/* Reso MD - Ecrans moyens*/
@media (min-height: 480px) and (max-height:858px) {
  /* No header menu + no user photo */
  #responsive-header {
    height: 0 !important;
    -webkit-transition: height .3s linear;
    -moz-transition: height .3s linear;
    -ms-transition: height .3s linear;
    -o-transition: height .3s linear;
    transition: height .3s linear;
  }
  #responsive-header .user-photo {
    display: none;
  }
  #responsive-header .logoDeciplus {
    height: 0;
  }
  #responsive-header .photo {
    opacity: 0;
    -webkit-transition: opacity 0.1s cubic-bezier(.28,0,.27,.55);
    -moz-transition: opacity 0.1s cubic-bezier(.28,0,.27,.55);
    -ms-transition: opacity 0.1s cubic-bezier(.28,0,.27,.55);
    -o-transition: opacity 0.1s cubic-bezier(.28,0,.27,.55);
    transition: opacity 0.1s cubic-bezier(.28,0,.27,.55);
  }
  /* Except if user toggle it */
  #responsive-header.forced {
    height:73px !important;
    -webkit-transition: height .3s linear;
    -moz-transition: height .3s linear;
    -ms-transition: height .3s linear;
    -o-transition: height .3s linear;
    transition: height .3s linear;
  }
  #responsive-header.forced .photo{
    opacity: 1;

    -webkit-transition: opacity 0.6s cubic-bezier(.28,0,.27,.55);
    -moz-transition: opacity 0.6s cubic-bezier(.28,0,.27,.55);
    -ms-transition: opacity 0.6s cubic-bezier(.28,0,.27,.55);
    -o-transition: opacity 0.6s cubic-bezier(.28,0,.27,.55);
    transition: opacity 0.6s cubic-bezier(.28,0,.27,.55);
  }
  #responsive-header.forced .logoDeciplus {
    height: auto !important;
  }
  .search-products-toolbar .item {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  .searchlist-product, .searchlist-promotion {
    height: 4rem !important;
  }
  /*No payment mode name display*/
  /*General margin*/
  .section-member {
    height: 165px !important;
  }
  .section-member-no-toolbar {
    height: 140px !important;
  }
  .cart-table tbody, .pending-cart-table tbody {
    overflow-y: auto;
  }
  .resp-div-pending {
    margin-bottom: 0 !important;
  }

  /*Menu pending cart specific*/
  .mobile-ham {
    display:none !important;
  }


  @media (min-width: 768px) {
    .col-xl-2-to-3 {
      -ms-flex: 0 0 25% !important;
      flex: 0 0 25% !important;
      max-width: 25% !important;
    }
    .col-xl-10-to-9 {
      -ms-flex: 0 0 75% !important;
      flex: 0 0 75% !important;
      max-width: 75% !important;
    }
  }
  /*Planning*/
  .__vev_calendar-wrapper .cal-wrapper .cal-body .dates .item .date-num {
    font-size: 0.8rem!important;
  }
  .__vev_calendar-wrapper .cal-wrapper .cal-body .weeks .item {
    height: 35px!important;
    font-size: 0.9rem!important;
  }
  .__vev_calendar-wrapper .cal-wrapper .cal-header {
    padding-bottom: 0 !important;
  }
}
/*On affine les media query des réso MD pour qu'elles n'impactent pas le mobile */
@media (min-height: 615px) and (max-height:858px) and (max-width:1024px){
  /*Menu pending cart specific*/
  .height-responsive-ham {
    display: none !important;
  }
  .mobile-ham {
    display: block !important;
  }
  /*.mobile-ham .deciham {*/
  /*margin-left: 15px !important;*/
  /*}*/
}
/*RESO XS - Ecrans nains */
@media (min-height: 615px) and (max-height:680px) {
  #page-wrapper {
    min-height: 300px;
  }
}

@media (max-width: 1350px) {
  .container-fluid {
    width: auto !important;
  }
}