.flex {
  display: flex !important;
  align-items: center;
}

.inline-flex {
  display: inline-flex !important;
  align-items: center;
}

.inline-block {
  display: inline-block !important;
}

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

section {
  padding-top: 24px;
}
section:last-of-type {
  padding-bottom: 50px;
}

.container {
  padding: 20px;
}

h1.title {
  margin-bottom: 36px !important;
}
h1.title .button {
  margin-left: 7px;
  vertical-align: middle;
}
h1.title .button.square {
  min-width: 29.6px;
  height: 29.6px;
  padding: 0 7px;
}
@media (max-width: 768px) {
  h1.title {
    font-size: 20px;
    line-height: 36px;
  }
}

b.fixed {
  display: inline-block;
  width: 400px;
}
b.fixed.v-top {
  vertical-align: top;
}
b.fixed .id {
  width: 50px;
}
@media (max-width: 768px) {
  b.fixed {
    display: block;
    width: 100%;
    margin-bottom: 5px;
  }
}

button#back {
  vertical-align: top;
  margin: -1px 5px 0 0;
}
button#back i {
  font-size: 23px;
}

button#copy span.icon {
  font-size: 20px;
  line-height: 15px;
}

button.is-loading span.icon {
  opacity: 0;
}

.navbar .container {
  padding: 10px 20px;
}

.navbar-brand {
  margin-right: 12px;
  margin-inline-start: 0 !important;
}
.navbar-brand .navbar-item {
  padding: 0;
}
.navbar-brand .navbar-item img {
  min-width: 56px;
  min-height: 56px;
  image-rendering: -webkit-optimize-contrast;
}

.navbar-menu {
  box-shadow: none !important;
}
.navbar-menu.is-active {
  height: 100vh;
}

.navbar-burger {
  color: #fff;
}

.loading {
  display: none;
  vertical-align: top;
  margin: 7px 0 0 5px;
}
.loading .bi {
  font-size: 20px;
  line-height: 120px;
}
.loading .bi-arrow-clockwise {
  animation: spin 2s linear infinite;
}
.loading .bi-check-circle {
  display: none;
  color: hsl(141, 71%, 48%);
}
.loading .bi-x-circle {
  display: none;
  color: hsl(348, 100%, 61%);
}
.loading.visible {
  display: inline-block;
}
.loading.loaded .bi-arrow-clockwise {
  display: none;
}
.loading.loaded .bi-check-circle {
  display: inline-block;
}
.loading.failed .bi-arrow-clockwise {
  display: none;
}
.loading.failed .bi-x-circle {
  display: inline-block;
}

label .loading {
  position: absolute;
  margin-top: 0;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
body.with_tabs section:first-of-type {
  background: hsl(0, 0%, 96%);
}
body.with_tabs section:first-of-type .container {
  padding-bottom: 0;
}
body.with_tabs section:first-of-type h1.title {
  margin-bottom: 44px;
}
body.with_tabs section:first-of-type .tabs.is-boxed ul, body.with_tabs section:first-of-type .tabs.is-boxed li, body.with_tabs section:first-of-type .tabs.is-boxed a {
  border: none;
}
body.with_tabs section:first-of-type .tabs.is-boxed ul li a span div {
  display: inline-block;
}
body.with_tabs section:first-of-type .tabs.is-boxed .tab-name {
  margin-right: 5px;
}

[data-tab] {
  display: none;
}
[data-tab].active {
  display: block;
}

@media (max-width: 768px) {
  .tabs {
    margin-left: -20px;
    margin-right: -20px;
  }
}
@media (max-width: 768px) {
  #search .ml-4 {
    margin-left: 0.5rem !important;
  }
  #search #reset span:first-child {
    margin-right: 0;
    margin-inline-end: -5px;
    margin-inline-start: -5px;
  }
  #search #reset span:last-child {
    display: none;
  }
}

#filter-count, #comment-count,
#event-count {
  background: hsl(0, 0%, 21%);
  height: 20px;
  width: 20px;
  text-align: center;
  border-radius: 4px;
  color: #fff;
  line-height: 20.5px;
  font-size: 13px;
  margin-right: -3px;
}

#filters {
  background-color: hsl(0, 0%, 96%);
  display: flex;
  align-items: flex-start;
}
#filters .multiselect-tags {
  margin-top: 15px;
}
#filters #display-filter {
  margin-left: auto;
}
#filters #display-filter,
#filters button#apply-filters {
  margin-top: 32px;
}
@media (max-width: 1215px) {
  #filters {
    display: table;
    width: 100%;
  }
  #filters #display-filter,
  #filters button#apply-filters {
    margin-top: 4px;
    margin-bottom: 4px;
  }
}
@media (max-width: 768px) {
  #filters .ml-4 {
    margin-left: 0.5rem !important;
  }
}

#comments .box.comment {
  margin-bottom: 5px;
  padding: 10px;
}
#comments .media-left {
  margin-right: 15px;
}
#comments .tag {
  margin-bottom: 5px;
}
#comments .replies {
  margin-left: 30px;
}
#comments .media-left figure.image {
  text-align: center;
  background: hsl(0, 0%, 96%);
  line-height: 64px;
  border-radius: 6px;
}
#comments p {
  margin-bottom: 6px;
}
#comments p span {
  color: hsl(217, 71%, 53%);
}
#comments article {
  position: relative;
}
#comments .reply-to-comment,
#comments .delete-comment {
  position: absolute;
  bottom: 0;
  right: 0;
  opacity: 0;
  pointer-events: none;
}
#comments .reply-to-comment i,
#comments .delete-comment i {
  font-size: 16px;
}
#comments .delete-comment {
  bottom: 35px;
}
#comments .comment:hover .reply-to-comment,
#comments .comment:hover .delete-comment {
  opacity: 1;
  pointer-events: auto;
}

.attachments {
  font-size: 0;
  line-height: 0;
  margin-bottom: -5px;
}
.attachments .card {
  display: inline-block;
  max-width: 100px;
  margin: 0 10px 10px 0;
  box-shadow: none;
  background: hsl(0, 0%, 96%);
  cursor: pointer;
}
.attachments .card:last-child {
  margin-right: 0;
}
.attachments .card:hover {
  background: rgb(229, 231, 235);
}
.attachments .card .card-image figure {
  background: hsl(0, 0%, 86%);
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  overflow: hidden;
  width: 100%;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.attachments .card .card-image img {
  object-fit: cover;
  border-radius: 0;
}
.attachments .card .card-image span {
  font-size: 22px;
  line-height: 22px;
}
.attachments .card .card-content {
  padding: 5px 8px;
  font-size: 12px;
  line-height: 18px;
  color: rgb(64, 70, 84);
}
.attachments .card .card-content .content {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#comment-form {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 1;
  margin: 0 !important;
  padding: 0;
  border-radius: 0;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
}
#comment-form .container {
  padding: 10px 20px;
}
#comment-form button#submit-comment,
#comment-form label#select-files {
  right: 5px;
  bottom: 5px;
  height: 36px;
  width: 36px;
  position: absolute;
}
#comment-form button#submit-comment .icon i,
#comment-form label#select-files .icon i {
  transform: rotate(45deg);
  margin-left: -4px;
}
#comment-form label#select-files {
  right: 46px;
}
#comment-form label#select-files .icon i {
  font-size: 18px;
  margin-left: -12px;
}
#comment-form .added-file {
  margin-right: 10px;
}
@media screen and (max-width: 768px) {
  #comment-form .container {
    padding: 0;
  }
}

[contenteditable=true].empty:before {
  content: attr(placeholder);
  display: block;
  color: rgba(46, 51, 61, 0.3019607843);
  position: absolute;
}

span[contenteditable=false] {
  color: hsl(217, 71%, 53%);
}

.tribute-container {
  transform: translateY(-100%);
  top: 10px;
  left: 10px;
  border-radius: 0.375rem;
  overflow: hidden;
  box-shadow: rgba(9, 10, 12, 0.1) 0px 8px 16px -2px, rgba(9, 10, 12, 0.02) 0px 0px 0px 1px;
}
.tribute-container ul {
  background: #fff;
  width: 200px;
}
.tribute-container ul li {
  padding: 6px 16px;
}
.tribute-container ul li.highlight {
  background: rgb(66, 88, 255);
  color: #fff;
}

.with-event {
  margin: 15px 0;
}
.with-event .tag.event {
  margin-bottom: 0 !important;
  white-space: normal;
  height: auto;
  padding: 5px 9px;
}

#overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 1000;
  opacity: 0;
  pointer-events: none;
  transition-duration: 0.3s;
}
#overlay .notification,
#overlay .confirmation {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: 420px;
  width: 100%;
  padding: 20px;
  background-color: #fff;
  border-radius: 6px;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
  text-align: center;
  z-index: 1001;
  opacity: 0;
  margin-top: 50px;
  transition-duration: 0.5s;
  padding-top: 45px;
  display: none;
}
#overlay .buttons {
  margin-top: 20px;
}
#overlay.visible {
  opacity: 1;
  pointer-events: auto;
}
#overlay.visible .notification,
#overlay.visible .confirmation {
  opacity: 1;
  margin-top: 0;
}

body {
  padding-top: 76px;
}

*:focus-visible, a:focus-visible, button:focus-visible {
  outline: none !important;
}

.container {
  position: unset;
}

.select:after {
  border-color: rgb(46, 51, 61) !important;
}

.panel-block {
  display: block;
}
.panel-block .location {
  min-width: 230px;
}
.panel-block .quantity {
  min-width: 50px;
}
.panel-block .created i {
  display: none;
}
.panel-block .created i.tasks {
  display: inline-block;
}
.panel-block .multiselect {
  display: inline-block;
  max-width: 300px;
  width: 100%;
}
.panel-block .select {
  max-width: 300px;
  width: 100%;
}
.panel-block .select select {
  width: 100%;
}
.panel-block input[type=datetime-local],
.panel-block input[type=date] {
  width: auto;
}
.panel-block .has-input {
  display: inline-block;
  width: 100%;
}
.panel-block .has-input textarea {
  margin-bottom: -6px;
  padding: 7px 11px;
}
.panel-block .has-input button {
  margin-top: 17px;
}
@media (min-width: 1215px) {
  .panel-block .has-input {
    max-width: calc(100% - 406px);
  }
}
@media (max-width: 1215px) {
  .panel-block .panel, .panel-block .box {
    margin-left: -20px;
    margin-right: -20px;
  }
  .panel-block input[type=datetime-local],
  .panel-block input[type=date] {
    width: auto;
  }
}
@media (max-width: 768px) {
  .panel-block .select,
  .panel-block .has-input {
    max-width: 100%;
  }
  .panel-block input[type=datetime-local],
  .panel-block input[type=date],
  .panel-block select {
    width: 100%;
  }
}

.panel .tags {
  gap: 0;
}
.panel .tags > div {
  margin-left: 10px;
}
.panel .tags .task-progress {
  flex: 1;
  margin-left: 0;
}
.panel .tags .task-progress button {
  border: 1px solid rgb(214, 217, 224);
}
@media (min-width: 769px) {
  .panel#tasks .tags {
    display: inline-flex;
    width: 300px;
    margin-right: 50px;
    margin-bottom: 0;
  }
}
@media (max-width: 768px) {
  .panel#tasks .tags {
    display: flex;
    width: auto;
    margin-bottom: 12px;
  }
}

nav.pagination {
  margin-top: 50px;
}

@media (max-width: 768px) {
  #locations {
    margin-left: -20px;
    margin-right: -20px;
  }
  #locations .card .card-content {
    padding: 20px;
  }
}
#asset-files {
  padding: 10px 0 0 10px;
}
#asset-files .card {
  max-width: 200px;
}

.multiselect-tags {
  font-size: 0;
  line-height: 0;
  margin-top: 5px;
}
.multiselect-tags .tag {
  margin: 5px 5px 0 0;
  background: hsl(225, 11%, 90%);
}
.multiselect-tags .tag:hover {
  background: hsl(225, 11%, 85%);
}

.dropdown-item.disabled {
  color: #abb1bf;
  pointer-events: none;
}

#login-form {
  padding: 3rem;
  max-width: 500px;
  margin: 0 auto;
}
#login-form .button {
  width: 100%;
}

#sort .icon > i {
  font-size: 21px;
}

#tasks > .viewed b.fixed .bi,
#tasks > .viewed b.fixed .has-text-grey-light .bi {
  display: none;
}
#tasks > .unviewed b.fixed,
#tasks > .unviewed b.fixed .has-text-grey-light {
  color: hsl(217, 71%, 53%) !important;
}
#tasks > .unviewed b.fixed .bi,
#tasks > .unviewed b.fixed .has-text-grey-light .bi {
  margin-left: -5px;
}
#tasks > .unviewed b.fixed .bi:before,
#tasks > .unviewed b.fixed .has-text-grey-light .bi:before {
  font-size: 20px;
  vertical-align: middle;
}

#comment-count,
#event-count {
  margin-left: 5px;
}

#task-details-top-panel b.fixed {
  display: inline-block;
  width: 400px;
}
#task-details-top-panel b.fixed.v-top {
  vertical-align: top;
}
@media (max-width: 768px) {
  #task-details-top-panel b.fixed {
    display: inline-block;
    width: 110px;
    margin-bottom: 0;
  }
}

/*# sourceMappingURL=style.css.map */
