/* SPDX-License-Identifier: LicenseRef-PavelPakhomov-Proprietary */
/* Copyright (c) 2026 Pavel Pakhomov. All rights reserved. */

.platform-shell {
  min-height: calc(100vh - 9rem);
}

.platform-content {
  min-width: 0;
}

.platform-sidebar {
  width: 100%;
}

.platform-sidebar .nav-link {
  align-items: center;
  display: flex;
  gap: 0.75rem;
  min-height: 2.375rem;
  white-space: nowrap;
}

.platform-sidebar .nav-link:not(.active) {
  color: var(--bs-body-color);
}

.platform-sidebar .nav-link:not(.active):hover {
  background-color: var(--bs-tertiary-bg);
}

.platform-sidebar-section-title {
  align-items: center;
  background-color: var(--bs-tertiary-bg);
  border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
  border-radius: var(--bs-border-radius);
  color: var(--bs-secondary-color);
  cursor: pointer;
  display: flex;
  font-family: inherit;
  font-size: 0.8125rem;
  font-weight: 600;
  gap: 0.75rem;
  margin-bottom: 0.5rem;
  min-height: 2.375rem;
  padding: 0.5rem 0.75rem;
  text-align: left;
  text-transform: uppercase;
  white-space: nowrap;
  width: 100%;
}

.platform-sidebar-section-title.collapsed {
  margin-bottom: 0;
}

.platform-sidebar-section-title:hover {
  color: var(--bs-body-color);
}

.platform-sidebar-section-title:focus-visible {
  outline: 0.1875rem solid rgba(var(--bs-primary-rgb), 0.35);
  outline-offset: 0.125rem;
}

#platform-sidebar-accordion .collapsing {
  transition: none;
}

.platform-sidebar-section-chevron {
  margin-left: auto;
}

.platform-sidebar-section-title.collapsed .platform-sidebar-section-chevron {
  transform: rotate(-90deg);
}

.platform-sidebar .bi {
  flex: 0 0 1.25rem;
  text-align: center;
  width: 1.25rem;
}

.grammar-markdown-pane {
  height: clamp(28rem, 65vh, 48rem);
  min-height: 28rem;
}

.grammar-markdown-editor {
  resize: none;
}

.grammar-markdown-preview {
  overflow: auto;
}

.grammar-markdown-preview pre {
  overflow-x: auto;
}

.app-max-w-30rem {
  max-width: 30rem;
}

.app-max-w-36rem {
  max-width: 36rem;
}

.app-max-w-38rem {
  max-width: 38rem;
}

.app-max-w-42rem {
  max-width: 42rem;
}

.app-max-w-44rem {
  max-width: 44rem;
}

.app-max-w-46rem {
  max-width: 46rem;
}

.app-max-w-48rem {
  max-width: 48rem;
}

.app-max-w-52rem {
  max-width: 52rem;
}

.app-max-w-54rem {
  max-width: 54rem;
}

.app-max-w-56rem {
  max-width: 56rem;
}

.app-max-w-58rem {
  max-width: 58rem;
}

.app-max-w-62rem {
  max-width: 62rem;
}

.app-max-w-64rem {
  max-width: 64rem;
}

.app-max-w-70rem {
  max-width: 70rem;
}

.app-max-w-96rem {
  max-width: 96rem;
}

.app-max-h-18rem {
  max-height: 18rem;
}

.app-width-auto {
  width: auto;
}

.app-whitespace-pre-line {
  white-space: pre-line;
}

.app-progress-thin {
  height: 0.5rem;
}

.app-progress-width-0 { width: 0%; }
.app-progress-width-1 { width: 1%; }
.app-progress-width-2 { width: 2%; }
.app-progress-width-3 { width: 3%; }
.app-progress-width-4 { width: 4%; }
.app-progress-width-5 { width: 5%; }
.app-progress-width-6 { width: 6%; }
.app-progress-width-7 { width: 7%; }
.app-progress-width-8 { width: 8%; }
.app-progress-width-9 { width: 9%; }
.app-progress-width-10 { width: 10%; }
.app-progress-width-11 { width: 11%; }
.app-progress-width-12 { width: 12%; }
.app-progress-width-13 { width: 13%; }
.app-progress-width-14 { width: 14%; }
.app-progress-width-15 { width: 15%; }
.app-progress-width-16 { width: 16%; }
.app-progress-width-17 { width: 17%; }
.app-progress-width-18 { width: 18%; }
.app-progress-width-19 { width: 19%; }
.app-progress-width-20 { width: 20%; }
.app-progress-width-21 { width: 21%; }
.app-progress-width-22 { width: 22%; }
.app-progress-width-23 { width: 23%; }
.app-progress-width-24 { width: 24%; }
.app-progress-width-25 { width: 25%; }
.app-progress-width-26 { width: 26%; }
.app-progress-width-27 { width: 27%; }
.app-progress-width-28 { width: 28%; }
.app-progress-width-29 { width: 29%; }
.app-progress-width-30 { width: 30%; }
.app-progress-width-31 { width: 31%; }
.app-progress-width-32 { width: 32%; }
.app-progress-width-33 { width: 33%; }
.app-progress-width-34 { width: 34%; }
.app-progress-width-35 { width: 35%; }
.app-progress-width-36 { width: 36%; }
.app-progress-width-37 { width: 37%; }
.app-progress-width-38 { width: 38%; }
.app-progress-width-39 { width: 39%; }
.app-progress-width-40 { width: 40%; }
.app-progress-width-41 { width: 41%; }
.app-progress-width-42 { width: 42%; }
.app-progress-width-43 { width: 43%; }
.app-progress-width-44 { width: 44%; }
.app-progress-width-45 { width: 45%; }
.app-progress-width-46 { width: 46%; }
.app-progress-width-47 { width: 47%; }
.app-progress-width-48 { width: 48%; }
.app-progress-width-49 { width: 49%; }
.app-progress-width-50 { width: 50%; }
.app-progress-width-51 { width: 51%; }
.app-progress-width-52 { width: 52%; }
.app-progress-width-53 { width: 53%; }
.app-progress-width-54 { width: 54%; }
.app-progress-width-55 { width: 55%; }
.app-progress-width-56 { width: 56%; }
.app-progress-width-57 { width: 57%; }
.app-progress-width-58 { width: 58%; }
.app-progress-width-59 { width: 59%; }
.app-progress-width-60 { width: 60%; }
.app-progress-width-61 { width: 61%; }
.app-progress-width-62 { width: 62%; }
.app-progress-width-63 { width: 63%; }
.app-progress-width-64 { width: 64%; }
.app-progress-width-65 { width: 65%; }
.app-progress-width-66 { width: 66%; }
.app-progress-width-67 { width: 67%; }
.app-progress-width-68 { width: 68%; }
.app-progress-width-69 { width: 69%; }
.app-progress-width-70 { width: 70%; }
.app-progress-width-71 { width: 71%; }
.app-progress-width-72 { width: 72%; }
.app-progress-width-73 { width: 73%; }
.app-progress-width-74 { width: 74%; }
.app-progress-width-75 { width: 75%; }
.app-progress-width-76 { width: 76%; }
.app-progress-width-77 { width: 77%; }
.app-progress-width-78 { width: 78%; }
.app-progress-width-79 { width: 79%; }
.app-progress-width-80 { width: 80%; }
.app-progress-width-81 { width: 81%; }
.app-progress-width-82 { width: 82%; }
.app-progress-width-83 { width: 83%; }
.app-progress-width-84 { width: 84%; }
.app-progress-width-85 { width: 85%; }
.app-progress-width-86 { width: 86%; }
.app-progress-width-87 { width: 87%; }
.app-progress-width-88 { width: 88%; }
.app-progress-width-89 { width: 89%; }
.app-progress-width-90 { width: 90%; }
.app-progress-width-91 { width: 91%; }
.app-progress-width-92 { width: 92%; }
.app-progress-width-93 { width: 93%; }
.app-progress-width-94 { width: 94%; }
.app-progress-width-95 { width: 95%; }
.app-progress-width-96 { width: 96%; }
.app-progress-width-97 { width: 97%; }
.app-progress-width-98 { width: 98%; }
.app-progress-width-99 { width: 99%; }
.app-progress-width-100 { width: 100%; }

@media (min-width: 992px) {
  .platform-sidebar {
    flex: 0 0 17rem;
    min-height: calc(100vh - 4.5rem);
    overflow-x: hidden;
    overflow-y: auto;
    position: sticky;
    top: 0;
    transition: flex-basis 0.15s ease, width 0.15s ease;
    width: 17rem;
  }

  .platform-sidebar-collapsed .platform-sidebar {
    flex-basis: 4.75rem;
    width: 4.75rem;
  }

  .platform-sidebar-collapsed .platform-sidebar-label {
    display: none;
  }

  .platform-sidebar-collapsed .platform-sidebar .nav-link {
    justify-content: center;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }

  .platform-sidebar-collapsed .platform-sidebar-section-title {
    justify-content: center;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }

  .platform-sidebar-collapsed .platform-sidebar-section-chevron {
    display: none;
  }

  .platform-sidebar-collapsed .platform-sidebar-toggle-icon {
    transform: rotate(180deg);
  }
}

@media (max-width: 991.98px) {
  .platform-sidebar {
    border-bottom: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
    border-right: 0 !important;
  }
}
.app-pre-line {
  white-space: pre-line;
}