@font-face {
  font-family: FranklinDmCp;
  src: url('../fonts/ITCFranklinGothicStd-DmCp.c1bedda4.woff2') format("woff2")
}

@font-face {
  font-family: FranklinBook;
  src: url('../fonts/ITCFranklinGothicStd-Book.228304de.woff2') format("woff2")
}

@font-face {
  font-family: FranklinMed;
  src: url('../fonts/ITCFranklinGothicStd-Med.f0c76059.woff2') format("woff2")
}

html, body {
  /* Main color palette */
  --main-color: hsl(201, 35%, 85%);
  --complement-color: black;
  --backdrop-color: #f5f5f5;
  --highlighted-element-color: black;
  font-family: FranklinBook, Arial, sans-serif;
  --link-color: #9d9d9d;
  --icon-color: black;
  --button-color: var(--main-color);
  --indicate-process-failed-color: rgba(125, 125, 125, 0.75);
  --collapsible-height: 8lh;
  --border-radius: 0;
}

.sidebar {
  font-family: FranklinMed;
}

  .sidebar.collapsible .logo {
    /*background-color: white;*/
    width: 14rem !important;
    border-radius: 1rem !important;
    margin: .5rem !important;
    padding: .5rem;
    transition: opacity var(--transition-speed) ease;
    -webkit-transition: opacity var(--transition-speed) ease;
  }

  .sidebar.collapsible.collapsed .logo {
    opacity: 0;
  }

  .sidebar .logo-wrapper {
    overflow: hidden;
  }

  .sidebar .logo img {
    border-radius: 0 !important;
    width: 140%;
  }

  .sidebar .nav-item a,
  .mobile-bar .nav-item a {
    color: black !important;
  }

input {
  border: var(--backdrop-color) solid 2px;
}

textarea {
  border: var(--backdrop-color) solid 2px;
}

button:not(.highlight):not(.secondary) {
  color: black;
}

.checkbox svg {
  --main-color: var(--complement-color);
}

.option.clickable {
  color: black !important;
}

.nav-item a .badge {
  background-color: black;
}

span.navbar-brand {
  visibility: hidden;
}

.download-button svg path {
  fill: var(--icon-color);
}

.close-button svg path {
  fill: var(--icon-color);
}

button:disabled svg.svg-inline--fa.fa-angle-left.fa-w-8 path,
button:disabled svg.svg-inline--fa.fa-angle-double-left.fa-w-14 g path,
button:disabled svg.svg-inline--fa.fa-angle-right.fa-w-8 path,
button:disabled svg.svg-inline--fa.fa-angle-double-right.fa-w-14 path {
  fill: white;
}

.list-record-table tr.selected,
.gallery .gallery-record.selected div {
  color: var(--text-color) !important;
}

.flow-table tr td:first-of-type {
  padding-left: .3rem;
}

.option-trigger button.highlight {
  padding: 2px !important;
}

.spinner.icon svg path {
  fill: black;
}

button:disabled {
  color: white;
}

  button:disabled svg path {
    fill: white;
  }

.link-content img {
  width: var(--icon-size);
  height: var(--icon-size);
}

.selectable-content .spinner-container:not(:has(.image)) {
  display: none !important;
}

/* Tablet */
@media (max-width: 768px) {
  .draggable-element .field-container {
    font-size: .8rem;
  }
}

/* Mobile */
@media (max-width: 425px) {
  .draggable-element .field-container {
    font-size: .65rem;
  }
}

@media (min-width: 871px) and (max-width: 1028px) {
  .sidebar.collapsible .logo {
    opacity: 0 !important;
  }
}