body {
  display: flex;
}

.modal-container {
  position: relative;
  visibility: hidden;
  justify-content: flex-end;
  width: auto;
}
.modal-container * {
  visibility: visible;
}
.modal-bg {
  display: none;
}

.modal.mod-settings {
  visibility: visible;
  max-height: 100vh;
  width: auto;
  height: unset;
  margin-bottom: 30px;
}

.modal.mod-settings .vertical-tab-content-container,
.modal.mod-settings .vertical-tab-header {
  height: 100vh;
}

.app-container {
  flex-grow: 1;
}
.app-container .horizontal-main-container {
  width: 100%;
}

.modal-container .modal::-webkit-resizer {
  background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m40 0v48h-32.1l13.6-13.6c0.6-0.6 0.8-1.6 0.4-2.3-0.4-0.8-1.3-1.2-2.1-1.1-0.4 0-0.9 0.3-1.2 0.6l-18.4 18.4 18.4 18.4c0.8 0.8 2.1 0.8 2.9 0s0.8-2.1 0-2.9l-13.6-13.5h32.1v48h4v-49.6c0.1-0.3 0.1-0.5 0-0.8v-49.6h-4zm16 0v49.4c-0.1 0.4-0.1 0.8 0 1.2v49.4h4v-48h32.1l-13.5 13.6c-0.8 0.8-0.8 2.1 0 2.9s2.1 0.8 2.9 0l18.4-18.4-18.4-18.4c-0.4-0.4-1-0.7-1.6-0.6-0.1 0-0.2 0-0.3 0.1-0.7 0.1-1.4 0.7-1.6 1.4s0 1.5 0.6 2l13.5 13.4h-32.1v-48h-4z' fill='white' stroke='white'/%3E%3C/svg%3E");
  background-size: 90%;
  background-repeat: no-repeat;
  background-position: top;
}

.modal-container .modal {
  direction: rtl;
  resize: horizontal;
  overflow: auto;
}

.modal-container .modal * {
  direction: ltr;
}