
#tca-project-nav {
  /* border-bottom: 1px solid #ddd; */
  position: fixed;
  background: #000;
  z-index: 999;
  box-shadow: 0 0 10px 0px rgb(0 0 0 / 15%);
}

#tca-project-nav .nav-link {
  border-color: #f5f5f5;
  color: #f5f5f5;
}

#tca-project-nav .nav-link.active {
  background-color: #f5f5f5;
  color: #000;
}

.tab-content, #tca-tab-content-editing {
  padding-top: 72px;
}

#tca-project-nav .nav-item {
  text-transform: uppercase;
  /* font-weight: bold; */
}

/* car card */

.tca-car-card .card-title {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tca-car-card-img {
  height: 200px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* vehicle selection */

.tca-vehicle-select-input {
  background: #041c2c !important;
  color: #fff !important;
  border: none !important;
  border-radius: 20px !important;
  text-align: center;
  text-transform: uppercase;
}

/*----- dropzone -----*/

.dropzone {
  border: none !important;
  background: #f5f5f5 !important;
  border-radius: 0.2rem;
  box-shadow: inset 0 0 6px rgb(0 0 0 / 20%);
}

.dropzone .dz-preview .dz-image {
  border-radius: 0 !important;
}

/* overview */

#tca-project-overview-gallery {
  height:465px;
}
.tca-overview-gallery-img {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/*----- gallery -----*/

.project-gallery-img {
  position: relative;
  width: 32.33%;
  margin: 0.5%;
  float: left;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.project-gallery-img:hover .project-item-edit-overlay {
  opacity: 1;
}

.project-gallery-img:after {
  content: "";
  display: block;
  padding-bottom: 100%;
}

/*----- documents -----*/

.project-documents-img {
  position: relative;
  width: 15.66%;
  margin: 0.5%;
  float: left;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border: 1px solid #ced4da;
}

.project-documents-img:hover .project-item-edit-overlay {
  opacity: 1;
}

.project-documents-img:after {
  content: "";
  display: block;
  padding-bottom: 100%;
}

/*----- gallery and docs -----*/

.project-item-edit-overlay {
  opacity:0;
  transition: opacity 0.2s;
  position: absolute;
  width: 100%;
  height: 100%;
  text-align: center;
  background: rgb(0 0 0 / 25%);
  color: #fff;
  padding-top: 40%;
  font-weight: bold;
  font-size: 1.5rem;
}

#gallery-upload-modal .modal-dialog, #documents-upload-modal .modal-dialog {
  max-width:800px;
}
#gallery-upload-modal .dz-message, #documents-upload-modal .dz-message {
  margin: 10em 0;
}

#gallery-item-modal .modal-dialog, #documents-item-modal .modal-dialog {
  max-width:65vw;
}

#shopping-item-modal .modal-dialog {
  max-width:50vw;
}

/*----- shopping list -----*/

#shopping-item-modal-img {
  height: 100%;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
#shopping-item-modal-dropzone .dz-message {
  margin: 12em 0;
}

.shopping-list-item-thumbnail {
  width: 64px;
  height: 64px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/*----- misc -----*/

.bg-img {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.tca-tag-badge {
  /* font-size: 1rem !important; */
  cursor: pointer;
  border-radius: 0.2rem !important;
  font-weight: normal !important;
}

.handle {
  cursor: grab;
}

.tca-border-bottom {
  border-bottom: 1px solid #ced4da;
}