/* GENERAL */
main {
  background-color: var(--erni-gray-100);
}

h4,
.h4 {
  color: var(--erni-red-darker);
}

.formio-form {
  padding: 0 30px;
}

/* ======== PAGE-ITEM / PAGE-LINK / PAGINATION ======== */
.page-link {
  position: relative;
  display: block;
  margin: 0 0.5rem 0.5rem;
  padding: 0;
  color: var(--erni-gray-900);
  background-color: var(--erni-gray-100);
  border: 0.1em solid var(--erni-gray-600);
}

.page-link:focus,
.page-link:hover,
.page-link:active {
  z-index: 2;
  color: var(--erni-gray-900) !important;
  text-decoration: none;
  background-color: var(--erni-gray-100) !important;
  border-color: var(--erni-gray-200) !important;
}

.page-item:first-child .page-link {
  border-top-left-radius: 0.25rem;
  border-top-right-radius: 0.25rem;
}

.page-item.active .page-link {
  color: #fff !important;
  background-color: var(--erni-gray-900) !important;
  border-color: var(--erni-gray-900) !important;
}

.page-item.active .page-link:hover {
  background-color: var(--erni-gray-600) !important;
  border-color: var(--erni-gray-600) !important;
}

.pagination {
  border-bottom: 0.15rem solid var(--ibkportal-gray-200) !important;
  border-radius: 0 !important;
}

.pagination .page-link {
  padding: 0.5rem 1rem !important;
  line-height: 1.375;
  background-color: var(--ibkportal-gray-100);
  color: #000;
  border: 1px solid var(--ibkportal-gray-900);
  max-height: 50px;
  min-height: 40px;
  border-radius: 0 !important;
}

.pagination-items-per-page.show > a {
  background-color: var(--erni-red-darker) !important;
  border-color: var(--erni-red-darker) !important;
  color: #fff !important;
}

/* ======== INPUT VALIDATION ======== */
/* nicht valide Felder */
.was-validated .form-control:invalid,
.form-control.is-invalid {
  background-color: var(--erni-light-gray) !important;
}

.was-validated .form-control:invalid:focus,
.form-control.is-invalid:focus {
  background-color: var(--erni-light-gray) !important;
}

/* ======== INPUT FORMATTING ======== */
.choices__list.choices__list--multiple
  .choices__item.choices__item--selectable {
  background-color: var(--erni-gray-200);
  color: var(--erni-red-darker);
}

.choices[data-type*="select-multiple"] .choices__button {
  border-left: 1px solid var(--erni-red-darker) !important;
}

.choices[data-type*="select-multiple"] .choices__button {
  border-left: 1px solid var(--erni-red-darker) !important;
}

.formio-wizard-nav-container .btn-wizard-nav-next,
.formio-wizard-nav-container .btn-wizard-nav-previous {
  background-color: var(--ibkportal-primary);
  color: white;
}

.formio-wizard-nav-container {
  display: flex;
}

.formio-wizard-nav-container button {
  background-color: var(--ibkportal-gray-100) !important;
  color: var(--erni-gray-900) !important;
  border: 1px solid var(--ibkportal-gray-900) !important;
}

.formio-wizard-nav-container button:hover {
  background-color: var(--ibkportal-gray-100) !important;
  color: var(--erni-gray-900) !important;
  border: 1px solid var(--ibkportal-gray-200) !important;
}

.formio-wizard-nav-container button.btn-wizard-nav-next::after {
  content: "";
  width: 0.8rem;
  height: 0.8rem;
  background-color: currentColor;
  clip-path: polygon(0% 100%, 100% 50%, 0 0);
}

.formio-wizard-nav-container button.btn-wizard-nav-previous::after {
  content: "";
  width: 0.8rem;
  height: 0.8rem;
  background-color: currentColor;
  clip-path: polygon(100% 100%, 0% 50%, 100% 0);
}

.tippy-box {
  border: 2px solid var(--ibkportal-gray-400);
}

.formio-component .list-group-item .btn-group .btn {
  background-color: var(--ibkportal-gray-200);
  border-color: var(--ibkportal-gray-200);
}

.formio-component .list-group-item .btn-group .btn:hover {
  background-color: var(--ibkportal-primary);
  border-color: var(--ibkportal-primary);
}

.field-required:after,
.tab-error:after {
  color: var(--ibkportal-danger) !important;
}

.formio-component .text-muted:before {
  color: var(--ibkportal-primary);
}

.form-control.is-invalid {
  border-color: var(--ibkportal-danger) !important;
  border-bottom: 3px solid var(--ibkportal-danger) !important;
}

.formio-errors .error {
  background-color: var(--erni-red-darker);
}

.formio-component.has-message.has-error {
  color: var(--ibkportal-danger);
}

.form-check-input[disabled],
.form-check-input:disabled {
  background-color: var(--ibkportal-gray-100);
}

.formbuilder .formio-component-printpagebreak {
  color: var(--ibkportal-gray-400);
  border: 1px dotted var(--ibkportal-gray-400);
}

/*Anpassung des Formulartitels*/
.document-name {
  justify-content: center !important;
}

.card-header {
  border: 0 !important;
  background: none !important;
}

.card.border {
  border: 0 !important;
}

.card-title {
  font-weight: bold !important;
}

/* ======== ERNI LAYOUT ======== */
.document-gridPattern {
  grid-template-columns: 950px 1fr !important;
  margin-top: 2rem;
}

.right-side-of-document {
  display: none;
}

.document-formWrapper {
  order: 1;
}

.left-side-of-document {
  order: 2;
}

.document-buttonWrapper {
  order: 3;
}

.left-side-of-attachments {
  order: 4;
}

.document-attachmentContainer {
  order: 5;
}

.right-side-of-attachments {
  order: 6;
}

.left-side-of-buttons {
  display: none;
}

.right-side-of-buttons {
  display: none;
}

.document-navigation-top {
  /* flex-direction: row-reverse; */
  flex-direction: row !important;
  padding-left: 30px;
}

.document-navigation-bottom {
  display: none !important;
}
/*Styling der Plausiliste*/
.left-side-of-document > div:nth-child(1) {
  background: var(--ibkportal-gray-100);
}

.ibk-foldable {
  margin: 8px !important;
  background: white;
  border-width: 0 0 0 2px !important;
  font-weight: bold;
}

.ibk-foldable > span {
  grid-template-columns: min-content 1fr 16px !important;
  column-gap: 1rem !important;
  margin: 0 !important;
  padding: 0.5rem 1rem 0.25rem;
}

.ibk-foldable > span > .count {
  width: unset !important;
}

.ibk-error {
  border-color: var(--erni-orange) !important;
}

.ibk-warning {
  border-color: var(--erni-turquoise) !important;
}

.ibk-info {
  border-color: var(--erni-light-green) !important;
}

.ibk-warning > span > .fa-chevron-down {
  color: var(--erni-turquoise);
}

.ibk-warning > span > .fa-chevron-up {
  color: var(--erni-turquoise);
}

.ibk-error > span > .fa-chevron-down {
  color: var(--erni-orange);
}
.ibk-error > span > .fa-chevron-up {
  color: var(--erni-orange);
}

.ibk-info > span > .fa-chevron-down {
  color: var(--erni-light-green);
}
.ibk-info > span > .fa-chevron-up {
  color: var(--erni-light-green);
}

.ibk-foldable .count {
  background: white !important;
  color: black !important;
  border: none !important;
}
.ibk-foldable > .content > div {
  font-weight: normal;
}
/*Container Anlage*/
.fas.fa-chevron-down.attachment-icon {
  color: var(--ibkportal-primary);
}
.fas.fa-chevron-up.attachment-icon {
  color: var(--ibkportal-primary);
}
.document-attachmentContainer {
  padding-left: calc(30px + 1rem);
}
/*Container Form Buttons*/
.document-buttonWrapper {
  padding-left: calc(30px + 1rem);
}

/*Styling Buttons*/
/*
.btn.btn-primary {
    background-color: white;
    color: var(--erni-primary);
    border-color: var(--erni-dark);
    font-weight: bold;
}

.document-upload-wrapper > .btn.btn-primary {
    background-color: var(--erni-red);
    color: white;
}

.btn.btn-primary.document-backButton {
    background-color: white !important;
    border-color: var(--erni-dark) !important;
    color: var(--erni-primary) !important;
}

.btn.btn-secondary {
    font-weight: bold;
}

.btn.btn-primary[title="Speichern"] {
    background-color: var(--erni-primary);
    color: white;
}
*/

/*Fehlermeldungen*/
.alert.alert-danger {
  background-color: var(--ibkportal-primary);
}

.formio-error-wrapper,
.formio-warning-wrapper {
  padding: 0;
  background-color: white;
}

.left-side-of-document > .document-current-state > span {
  border: 0;
  border-left: 2px solid var(--ibkportal-primary);
  margin: 8px;
  width: unset;
  padding: 0.5rem 1rem 0.5rem;
}

.left-side-of-document > .document-current-state > span > i {
  display: none;
}
