body[data-layout="material"] {

  .form-control {
    padding: 0.375rem 0.25rem;
  }

  .form-floating {

    >label {
      padding: 1rem 0.25rem;
    }

    >.form-control,
    >.form-control-plaintext {
      padding: 1rem 0.25rem;
    }

    >.form-control:focus~label,
    >.form-control:not(:placeholder-shown)~label,
    >.form-control-plaintext~label,
    >.form-select~label {
      transform: scale(0.85) translateY(-0.5rem) translateX(0rem);
    }

    >.form-control:focus~label {
      color: var(--bs-primary);
    }

    >.form-control:focus,
    >.form-control:not(:placeholder-shown),
    >.form-control:-webkit-autofill {
      padding-top: 1.875rem;
      padding-bottom: 0.375rem;
    }

    >.form-control:placeholder-shown:not(:focus)~label {
      transform: translateY(1rem);
    }
  }

  .input-group>.input-group-text,
  .form-control,
  .form-select {
    --bs-border-radius: 0;
    --bs-border-radius-sm: 0;
    --bs-border-radius-lg: 0;
    background-color: transparent;
    border: 0;
    border-bottom: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: 0;
  }

  .input-group {
    >.btn {
      --bs-btn-border-radius: 0;
      background-color: transparent;
      border: 0;
      border-bottom: var(--bs-border-width) solid var(--bs-border-color);
      border-radius: 0;
      box-shadow: none;
      color: var(--bs-btn-color);
    }

    &:focus-within {

      >.input-group-text,
      >.btn,
      >.form-control,
      >.form-floating>.form-control {
        border-bottom-color: var(--bs-primary);
      }
    }
  }

  .dropdown>.btn:has(>.dropdown-toggle-label) {
    --bs-btn-border-radius: 0;
    background-color: transparent;
    border: 0;
    border-bottom: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: 0;
    box-shadow: none;
    display: flex;
    width: 100%;
    padding-left: 4px;

    &.form-select {
      --bs-form-select-bg-img: none;

      &::after {
        content: "";
        display: inline-block;
        flex: 0 0 auto;
        vertical-align: 0.255em;
        border-top: 0.3em solid;
        border-right: 0.3em solid transparent;
        border-bottom: 0;
        border-left: 0.3em solid transparent;
      }
    }

    /* Der Platz oben ist fuer das schwebende Label IM Feld (Container .form-floating, z. B.
       Kalender-Typen, Postfaecher). Ohne Floating (Aufgaben-Status/-Prioritaet: Label steht separat
       ueber dem Feld) darf er nicht greifen — er drueckte den Inhalt an den unteren Feldrand. */
    &.form-select:is(.form-floating > *) {
      padding-top: 1.875rem;
      padding-bottom: 0.375rem;
    }

    &::after {
      margin-top: auto;
      margin-bottom: auto;
      margin-left: auto;
    }

    &:is(.btn-primary, .btn-outline-primary) {
      color: var(--bs-primary);
    }

    &:hover {
      background-color: rgba(var(--bs-primary-rgb), 0.08);
    }

    &:active,
    &.show,
    &:focus,
    &:focus-visible {
      border-bottom: var(--bs-border-width) solid var(--bs-primary);
    }

    &:active,
    &.show {
      background-color: rgba(var(--bs-primary-rgb), 0.14);
    }

    &:focus,
    &:focus-visible {
      box-shadow: none;
    }

    &:focus-visible {
      background-color: rgba(var(--bs-primary-rgb), 0.1);
      outline: 2px solid rgba(var(--bs-primary-rgb), 0.4);
      outline-offset: -2px;
    }
  }

  .input-group {
    >.btn {
      transition:
        color 0.15s ease-in-out,
        background-color 0.15s ease-in-out;

      &:hover {
        background-color: rgba(var(--bs-primary-rgb), 0.08);
      }

      &:active {
        background-color: rgba(var(--bs-primary-rgb), 0.14);
      }

      &:focus-visible {
        background-color: rgba(var(--bs-primary-rgb), 0.1);
        outline: 2px solid rgba(var(--bs-primary-rgb), 0.4);
        outline-offset: -2px;
      }
    }
  }

  .form-control:focus {
    border-bottom-color: var(--bs-primary);
  }

  .was-validated .form-control:focus,
  .form-control:focus {
    box-shadow: unset;
  }
}
