/* Forgejo v17.0 — Gitea-like repository sidebar.
 * Only affects the repository root when fj-repo-layout is present.
 * Uses the existing Forgejo theme for colors and fonts.
 */

.repository.file.list .fj-repo-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  align-items: start;
  gap: 24px;
  margin-block-start: 4px;
}

.repository.file.list .fj-repo-main {
  min-width: 0;
}

.repository.file.list .fj-repo-main .repository-summary #language-stats,
.repository.file.list .fj-repo-main .repository-summary [data-test-name="repo-size"] {
  display: none;
}

.repository.file.list .fj-repo-main .repository-summary {
  margin-block-end: 12px;
}

.repository.file.list .fj-repo-main .repository-summary .repository-menu {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 12px;
}

.repository.file.list .fj-repo-main .repo-button-row {
  flex-wrap: wrap;
  gap: 8px;
}

.repository.file.list .fj-repo-main #repo-files-table {
  width: 100%;
}

.repository.file.list .fj-repo-sidebar {
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: 13px;
  line-height: 1.5;
  color: var(--color-text, inherit);
}

.repository.file.list .fj-side-section + .fj-side-section {
  margin-block-start: 16px;
  padding-block-start: 16px;
  border-block-start: 1px solid var(--color-secondary, #555);
}

.repository.file.list .fj-side-heading {
  margin: 0 0 8px;
  font-size: 14px;
  line-height: 1.45;
  font-weight: 600;
  color: var(--color-text, inherit);
}

.repository.file.list .fj-side-description.repo-description {
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
}

.repository.file.list .fj-side-description #repo-desc {
  font-size: 13px;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.repository.file.list .fj-side-description .no-description {
  color: var(--color-text-light-2, #999);
}

.repository.file.list .fj-side-website {
  display: flex;
  align-items: start;
  gap: 7px;
  margin-block-start: 8px;
}

.repository.file.list .fj-side-website svg {
  flex: none;
  margin-block-start: 2px;
  color: var(--color-text-light-2, #999);
}

.repository.file.list .fj-side-website span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.repository.file.list .fj-side-topics.repo-topics {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  align-items: center;
  margin: 10px 0 0;
}

.repository.file.list .fj-side-topics .repo-topic.ui.label {
  margin: 0;
  font-size: 11px;
  padding: 4px 7px;
}

.repository.file.list .fj-side-topics #manage_topic {
  margin: 3px 0 0;
}

.repository.file.list .fj-repo-sidebar #topic_edit {
  flex-wrap: wrap;
}

.repository.file.list .fj-repo-sidebar #topic_edit .fj-topic-buttons {
  display: flex;
  gap: 4px;
}

.repository.file.list .fj-repo-sidebar #topic_edit .ui.button {
  padding-inline: 8px;
}

.repository.file.list .fj-side-details {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.repository.file.list .fj-side-item {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 21px;
  color: var(--color-text, inherit);
  text-decoration: none;
}

.repository.file.list a.fj-side-item:hover {
  color: var(--color-primary, currentColor);
  text-decoration: underline;
}

.repository.file.list .fj-side-item svg {
  flex: 0 0 16px;
  color: var(--color-text-light-2, #999);
}

.repository.file.list .fj-language-bar {
  display: flex;
  width: 100%;
  height: 8px;
  overflow: hidden;
  border-radius: 100px;
  background-color: var(--color-secondary, #555);
  margin-block: 12px 10px;
}

.repository.file.list .fj-language-slice {
  display: block;
  height: 100%;
  flex: 0 0 auto;
  min-width: 0;
}

.repository.file.list .fj-language-legend {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 10px;
  row-gap: 9px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.repository.file.list .fj-language-legend li {
  display: flex;
  align-items: baseline;
  gap: 6px;
  min-width: 0;
  line-height: 1.3;
  overflow-wrap: anywhere;
  font-size: 12px;
}

.repository.file.list .fj-language-dot {
  display: inline-block;
  flex: 0 0 10px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
}

.repository.file.list .fj-language-pct {
  color: var(--color-text-light-2, #999);
  white-space: nowrap;
}

@media (max-width: 1020px) {
  .repository.file.list .fj-repo-layout {
    grid-template-columns: minmax(0, 1fr) 230px;
    gap: 16px;
  }
}

@media (max-width: 767.98px) {
  .repository.file.list .fj-repo-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
  }

  .repository.file.list .fj-repo-sidebar {
    padding-block-start: 16px;
    border-block-start: 1px solid var(--color-secondary, #555);
  }

  .repository.file.list .fj-language-legend {
    grid-template-columns: repeat(auto-fit, minmax(135px, 1fr));
  }
}

@media (max-width: 767.98px) {
  .repository.file.list .fj-repo-sidebar {
    grid-row: 1;
    padding-block-end: 16px;
    border-block-end: 1px solid var(--color-secondary, #555);
  }

  .repository.file.list .fj-repo-main {
    grid-row: 2;
  }
}
