/* SPDX-FileCopyrightText: Fondation RERO+ */
/* SPDX-License-Identifier: BSD-3-Clause */

h1 {
  font-weight: 700;
}

.content h1 {
  font-weight: 700;
}

.content  h2 {
  font-weight: 600;
}

.content h1, .content h2 {
  border-bottom: solid 2px;
  margin-top: 2rem;
}

.content h3, .content h4, .content h5, .content h6 {
  border-bottom: solid 1px lightgray;
  margin-top: 1rem;
}

.content p, .content ul, .content ol {
  max-width: 55rem;
}

/* Figures, as rendered for an image carrying a title. */
.content figure {
  max-width: 85%;
  margin: 0 auto;
  padding: 1rem;
  background-color: #f8f9fa;
  border-radius: 5px;
}

.content figure img {
  border-radius: 5px;
}

.content figcaption {
  padding-top: 0.5rem;
  text-align: center;
  font-size: 90%;
  color: #6c757d;
}

/* Article and table of contents: one column on a small screen, two on a wide
   one. */
.wiki-page {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem 2.5rem;
  max-width: 75rem;
  margin-inline: auto;
}

/* Anchors land a little under the top of the viewport, not flush against it. */
.content h1, .content h2, .content h3,
.content h4, .content h5, .content h6 {
  scroll-margin-top: 1rem;
}

/* The TOC comes first in the source, so it comes first on a narrow screen,
   where it must not push the article out of sight. */
.wiki-toc {
  max-height: 30vh;
  overflow-y: auto;
}

.wiki-toc ul {
  padding-left: 1rem;
}

@media (min-width: 768px) {
  /* The second column exists only on a page that has an outline. */
  .wiki-page:has(.wiki-toc) {
    grid-template-columns: minmax(0, 1fr) 15rem;
  }

  .wiki-content {
    grid-area: 1 / 1;
  }

  .wiki-toc {
    grid-area: 1 / 2;
    align-self: start; /* a stretched item has no room to stick */
    position: sticky;
    top: 1rem;
    max-height: calc(100vh - 2rem);
  }
}

.wiki-editor textarea {
  height: 400px;
}

.wiki-toasts {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 1090;
}

.wiki-files,
.wiki-page,
.wiki-editor {
    position: relative;
}

.wiki-files figure img {
  max-width: 15rem;
  max-height: 15rem;
}

.wiki-files form .custom-file {
  position: relative;
  overflow: hidden;
  display: inline-block;
}

.wiki-files form input[type='file'] {
  font-size: 100px;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
}