body {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
}

main.container {
  max-width: 960px;
}

.navbar-brand img {
  height: 32px;
  width: auto;
}


.delay-table input.datetime-picker-display {
  min-width: 200px;
  font-size: 1.05rem;
  padding: 0.5rem 0.75rem;
}

/* Date and time picker inputs should be narrower */
.delay-table .date-picker-display {
  min-width: 100px;
  font-size: 1rem;
  padding: 0.5rem 0.5rem;
}

.delay-table .time-picker-display {
  min-width: 80px;
  font-size: 1rem;
  padding: 0.5rem 0.5rem;
}

.delay-table .col-duration input {
  min-width: 80px;
  max-width: 100px;
}

.delay-table .delay-code-input {
  min-width: 100px;
  max-width: 120px;
  text-transform: uppercase;
}

.delay-table .delay-description {
  display: inline-block;
  min-width: 150px;
  max-width: 180px;
  font-size: 0.9rem;
}

.delay-table .save-btn {
  min-width: 110px;
}

.active-row {
  outline: 3px solid rgba(0, 123, 255, 0.25);
  outline-offset: 2px;
}

@media (max-width: 992px) {
  .delay-table input.datetime-picker-display {
    min-width: 160px;
  }
  .delay-table .date-picker-display {
    min-width: 90px;
  }
  .delay-table .time-picker-display {
    min-width: 70px;
  }
  .delay-table .delay-description {
    min-width: 120px;
    max-width: 160px;
  }
  .delay-table .col-start,
  .delay-table .col-end {
    min-width: 160px;
  }
  .delay-table .col-duration {
    min-width: 80px;
  }
  .delay-table .col-code {
    min-width: 100px;
  }
}


.delay-table-wrapper {
    width: 100%;
    overflow-x: auto;
}

.delay-table {
    width: 100%;
    min-width: 980px;
    table-layout: auto;
}

@media (min-width: 992px) {
    .delay-table {
        min-width: 1100px;
    }
}

.delay-table th,
.delay-table td {
  vertical-align: middle;
  padding-top: 0;
  padding-bottom: 0;
  padding-left: 1rem;
  padding-right: 1rem;
}

.delay-table .col-start,
.delay-table .col-end {
    width: 200px;
    min-width: 180px;
}

.delay-table .col-duration {
    width: 100px;
    min-width: 90px;
}

.delay-table .col-code {
    width: 120px;
    min-width: 110px;
}

.delay-table .col-description {
    width: 180px;
    min-width: 160px;
}

/* Comments column should fill remaining space */
.delay-table .col-comments {
    width: auto;
    min-width: 200px;
}

.delay-table .col-comments textarea[data-field="comments"] {
    width: 100%;
}

/* Action column should be narrow */
.delay-table .col-action {
    width: 100px;
    min-width: 90px;
}

.delay-table textarea {
    min-height: 80px;
}

.delay-table .form-control,
.delay-table textarea {
    width: 100%;
}


.crane-meta-form .form-label {
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    color: #6c757d;
}

.crane-meta-form .form-control-lg {
    height: auto;
}