#settings-tab {
  flex-direction: column;
  align-items: center;
}

#prefs-container {
  height: calc(100vh - var(--tab-height));
  width: min(100vh, 50rem);
  display: flex;
  padding: 0.5rem;
  gap: 1rem;
  align-items: stretch;
}

#prefs-sections-container {
  display: flex;
  flex-direction: column;
  align-items: center;

  div {
    width: 8rem;
    background-color: var(--background-2);
    padding: 0.5rem;
    text-align: center;
  }
}

#prefs-contents-container {
  display: flex;
  flex-direction: column;
  flex-grow: 1;

  .prefs-title-bar {
    display: flex;
    align-items: center;

    span {
      font-size: 1.2rem;
    }
    button {
      font-size: 0.8rem;
    }
  }

  .prefs-contents {
    display: flex;
    flex-grow: 1;
  }
}

#prefs-printer {
  display: flex;
  flex-grow: 1;
  flex-direction: column;
  padding: 0.5rem;
  padding-top: 0px;
  gap: 0.5rem;
}

#prefs-printer-contents {
  font-size: 0.9rem;
  flex-grow: 1;

  #prefs-printers-list {
    display: flex;
    border: 1px solid var(--grey-2);
    padding: 0.25rem;
    height: min(32rem, 100%);

    div {
      padding: 0.25rem;
      width: 12rem;
    }
  }
}

#add-printer-dialog:modal {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;

  padding: 0.5rem;
  border: none;

  background-color: var(--background-2);
  border: 1px var(--grey-2) solid;

  min-width: 50vw;

  .add-printer-title-bar {
    display: flex;
    flex-direction: row;
    width: 100%;

    justify-content: center;
    align-items: center;

    text-align: center;

    .title {
      font-size: 1.75rem;
      font-weight: 500;

      text-decoration: underline;
      text-decoration-color: var(--primary);
    }

    .close {
      text-align: left;
      cursor: pointer;

      cura-icon {
        height: 2rem;
      }
    }
  }

  #add-printer-options {
    display: flex;
    flex-direction: column;

    min-height: 50vh;
    max-height: 80vh;

    width: 100%;

    border: 1px var(--grey-2) solid;

    overflow-y: scroll;

    .manufacturer-option {
      display: flex;
      flex-direction: column;
      font-size: 1.25rem;
      padding: 0.5rem;

      border-bottom: 1px var(--grey-2) solid;

      span {
        display: flex;
        justify-content: space-between;
        align-items: center;
        cursor: pointer;

        cura-icon {

          transition: 0.1s;
          transform: rotate(90deg);
          height: 1.25rem;
          width: 1.25rem;
        }
      }

      .printer-options {
        display: none;
        flex-direction: column;

        font-size: 1.1rem;

        .printer-option {
          padding-left: 1rem;
          display: flex;
          justify-content: left;
          gap: 0.5rem;

          input {
            cursor: pointer;
            filter: grayscale(100%);
          }

          label {
            cursor: pointer;
          }
        }
      }

      &.opened {
        .printer-options {
          display: flex;
        }
        cura-icon {
          transform: rotate(0deg);
        }
      }
    }
  }
}

#add-printer-dialog::backdrop {
  backdrop-filter: blur(0.2rem);
}
