/* Kanban Main */

.kanban-main {
  cursor: grab;
  overflow-x: scroll;
  overflow-y: scroll;
  border-top-left-radius: 14px;
  scroll-behavior: auto !important;
  position: relative;
}

.kanban-main.active {
  cursor: grabbing !important;
}

@media (max-width: 576px) {
  .kanban-main {
    max-width: 110%;
    height: calc(100vh - 206px);
  }
}

@media (min-width: 576px) {
  .kanban-main {
    max-width: 150%;
    height: calc(100vh - 125px);
  }
}


/* Container */

.kanban-container {
  position: relative;
  box-sizing: border-box;
  margin-left: -10px;
  width: auto;
}

.kanban-container * {
  box-sizing: border-box;
}

.kanban-container:after {
  clear: both;
  display: block;
  content: "";
}

/* Board */

@media (max-width: 576px) {
  .kanban-board {
    width: 91vw;
  }
}

@media (min-width: 576px) {
  .kanban-board {
    width: 400px;
  }
}

.kanban-board {
  border-radius: 10px;
  cursor: default;
  position: relative;
  float: left;
  background: var(--meta-silver-2);
  /*transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);*/
}

.kanban-board.disabled-board {
  opacity: 0.3;
}

.kanban-board.is-moving.gu-mirror {
  transform: rotate(3deg);
}

.kanban-board.is-moving.gu-mirror .kanban-drag {
  overflow: hidden;
  padding-right: 50px;
}

.kanban-board header {
  font-size: 16px;
  padding: 15px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.kanban-board header .kanban-title-board {
  font-weight: 700;
  margin: 0;
  padding: 0;
  display: inline;
}

.kanban-board header .kanban-title-button {
  float: right;
  margin-top: -3px;
  margin-right: -5px;
}

.kanban-board .kanban-drag {
  min-height: 200px;
  padding: 15px;
}

.kanban-board:after {
  clear: both;
  display: block;
  content: "";
}

/* Header */

.is-moving .kanban-board-header {
  cursor: grabbing;
}

/* Related boards */

.related-board {
  min-height: 220px;
}

@media (max-width: 576px) {
  .related-boards-block {
    width: 93vw;
  }
}

@media (min-width: 576px) {
  .related-boards-block {
    width: 400px;
  }
}


/* Item */

.kanban-item {
  line-height: 13px !important;
  background: var(--bs-body-bg);
  border-radius: 8px;
  border: solid var(--meta-silver-2);
  border-width: 0 0 0 5px !important;
  /*padding: 10px 15px 10px 10px !important;*/
  margin-bottom: 8px;
}

.kanban-item.kanban-item-first-priority {
  border-left: solid var(--meta-red-4);
}

.kanban-item.kanban-item-first-priority:hover {
  border-left: solid var(--meta-red);
}

.kanban-item.kanban-item-second-priority {
  border-left: solid var(--meta-yellow-4);
}

.kanban-item.kanban-item-second-priority:hover {
  border-left: solid var(--meta-yellow);
}

.kanban-item.kanban-item-third-priority {
  border-left: solid var(--meta-silver-4);
}

.kanban-item.kanban-item-third-priority:hover {
  border-left: solid var(--meta-silver);
}

.kanban-item.kanban-item-fourth-priority {
  border-left: solid var(--meta-blue-4);
}

.kanban-item.kanban-item-fourth-priority:hover {
  border-left: solid var(--meta-blue);
}

.kanban-item.kanban-item-10-frozen {
  border-width: 1px 5px 1px 5px !important;
  border-right: solid var(--meta-blue-6);
}

.kanban-item.kanban-item-10-frozen:hover {
  border-right: solid var(--meta-blue-6);
}

.kanban-item.kanban-item-20-frozen {
  border-width: 1px 5px 1px 5px !important;
  border-right: solid var(--meta-blue-5);
}

.kanban-item.kanban-item-20-frozen:hover {
  border-right: solid var(--meta-blue-5);
}

.kanban-item.kanban-item-30-frozen {
  border-width: 1px 5px 1px 5px !important;
  border-right: solid var(--meta-blue-4);
}

.kanban-item.kanban-item-30-frozen:hover {
  border-right: solid var(--meta-blue-4);
}

.kanban-item.kanban-item-40-frozen {
  border-width: 1px 5px 1px 5px !important;
  border-right: solid var(--meta-blue-3);
}

.kanban-item.kanban-item-40-frozen:hover {
  border-right: solid var(--meta-blue-3);
}

.kanban-item:hover {
  cursor: pointer;
  border-color: var(--meta-silver-3);
  -webkit-box-shadow: 3px 3px 8px -7px var(--meta-silver-4);
  -moz-box-shadow: 3px 3px 8px -7px var(--meta-silver-4);
  box-shadow: 3px 3px 8px -7px var(--meta-silver-4);
}

.kanban-item:last-child {
  margin: 0;
}

.kanban-item.is-moving {
  filter: blur(0.03rem) !important;
  cursor: grabbing !important;
  box-shadow: 5px 5px 14px -14px var(--meta-silver-9) !important;
}

.item_handle {
    cursor: grab;
}

.drag_handler {
  background: #fff;
  border-radius: 50%;
  width: 24px;
  height: 24px;
  position: relative;
  float: left;
  top: -3px;
  margin-right: 4px;
}

.drag_handler:hover {
  cursor: move;
}

.drag_handler_icon {
  position: relative;
  display: block;
  background: #000;
  width: 24px;
  height: 2px;
  top: 12px;
  transition: .5s ease-in-out;
}

.drag_handler_icon:before,
.drag_handler_icon:after {
  background: #000;
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  transition: .5s ease-in-out;
}

.drag_handler_icon:before {
  top: 6px;
}

.drag_handler_icon:after {
  bottom: 6px;
}