html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
  background-color: #f5f6fa;
}

.layout-card {
    background-color: white;
    border: none;
}

.field-validation-error {
    color: red;
}

.form-control.input-validation-error {
    border-color: red;
}

.form-select.input-validation-error {
    border-color: red;
}

.layout-card > .card-header {
    background-color: white;
}

table.collapsed > tbody > tr > td.dtr-control::before {
    font-family: "bootstrap-icons";
    content: '\F231' !important;
    margin-right: 8px;
}

table.collapsed > tbody > tr.dt-hasChild > td.dtr-control::before {
    font-family: "bootstrap-icons";
    content: '\F229' !important;
    margin-right: 8px;
}

.card-header .bi {
    transition: .3s transform ease-in-out;
}

.card-header .collapsed .bi {
    transform: rotate(90deg);
}