@font-face {
  font-family: 'Monotype-Corsiva';
  src: url('/files/fonts/Monotype-Corsiva.ttf') format('truetype')
}

.ui-draggable, .ui-droppable {
  -ms-touch-action: none;
  touch-action: none;
}

.bg-primary .text-muted {
  color: #362E14 !important;
}

@media (min-width: 992px) { 
  #recap {
    height: calc( 100vh - 58px - env(safe-area-inset-bottom)) 
  }

  #ui {
    height: calc( 100vh - 58px - env(safe-area-inset-bottom)); 
    overflow: hidden
  }
}

@media (max-width: 991px){
  #recap_collapsed {
    position: fixed; 
    bottom: 0;
    z-index: 1030;
  }

  #recap {
    position: fixed; 
    bottom: 0;
    z-index: 1030;
    max-height: calc( 100vh - 58px - env(safe-area-inset-bottom));
  }

  #ui {
    height: calc( 100vh - 58px - 80px - env(safe-area-inset-bottom)); 
    overflow: hidden
  }
}

#step-next, #step-prev {
  cursor: pointer 
}

ul {
  list-style-type: none;
}

ul > * {
  flex-shrink: 0;
}

.li-action {
  cursor: pointer;
}

.li-action {
  border-radius: 0.25rem;
}

.li-action:hover{
  background-color: var(--bs-primary);
}

.bi-arrow-right, .bi-arrow-left, .bi-trash3-fill {
  cursor: pointer;
}

.mec-hint {
  border-style: dotted !important;
}

.mec-hint:hover {
  border-style: dashed !important;
  cursor: pointer;
  border-width: medium !important;
}

.card-deck {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  grid-gap: .5rem;
}

#recap::-webkit-scrollbar {
  display: none;
}

#recap {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

.bubble {
  border-radius: 50%;
}