/*
  Copyright 1998-2026 PasDoc developers.

  This file is part of "PasDoc".

  "PasDoc" is free software; you can redistribute it and/or modify
  it under the terms of the GNU General Public License as published by
  the Free Software Foundation; either version 2 of the License, or
  (at your option) any later version.

  "PasDoc" is distributed in the hope that it will be useful,
  but WITHOUT ANY WARRANTY; without even the implied warranty of
  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  GNU General Public License for more details.

  You should have received a copy of the GNU General Public License
  along with "PasDoc"; if not, write to the Free Software
  Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA

  ----------------------------------------------------------------------------
*/

/* === Custom Properties === */
:root {
  --pasdoc-accent: #0d6efd;
  --pasdoc-accent-hover: #0a58ca;
  --pasdoc-accent-light: #e7f1ff;
  --pasdoc-sidebar-width: 18rem;
  --pasdoc-sidebar-bg: #f8f9fa;
  --pasdoc-border-color: #dee2e6;
  --pasdoc-code-bg: #f8f9fa;
  --pasdoc-muted: #6c757d;
}

/* === Layout: sidebar + content === */

@media (min-width: 768px) {
  .offcanvas-md {
    width: var(--pasdoc-sidebar-width) !important;
    position: fixed !important;
    top: 0;
    bottom: 0;
    left: 0;
    border-right: 1px solid var(--pasdoc-border-color);
    overflow-y: auto;
    background-color: var(--pasdoc-sidebar-bg) !important;
  }
  .pasdoc-content {
    margin-left: var(--pasdoc-sidebar-width);
  }
}

/* === Sidebar navigation styling (with Bootstrap) === */

.offcanvas-body {
  /* Override Bootstrap default flex making row, which would put
     <h2> from --title on the left of the menu. */
  flex-direction: column;
}

.offcanvas-body h2 {
  font-size: 1.1rem;
  padding: 0.5rem 0.75rem;
  margin: 0.5rem 0;
}

.offcanvas-body .nav-link {
  color: #495057;
  font-size: 0.9rem;
  border-radius: 0.25rem;
}
.offcanvas-body .nav-link:hover {
  color: var(--pasdoc-accent);
  background-color: var(--pasdoc-accent-light);
}

/* === Section tabs === */

.sections {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  margin-bottom: 1rem;
  padding: 0;
  background: transparent;
}
.sections .one_section {
  display: inline-block;
  background: transparent;
  margin: 0;
  padding: 0;
}
.sections .one_section a.section {
  display: inline-block;
  padding: 0.3rem 0.7rem;
  font-size: 0.85rem;
  font-weight: 500;
  color: var(--pasdoc-accent);
  background-color: var(--pasdoc-accent-light);
  border-radius: 2rem;
  text-decoration: none;
}
.sections .one_section a.section:hover {
  background-color: var(--pasdoc-accent);
  color: white;
  text-decoration: none;
}

/* === Tables === */

table.wide_list {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 1rem;
}
table.wide_list td,
table.wide_list th {
  vertical-align: top;
  padding: 0.5rem 0.75rem;
  border-bottom: 1px solid var(--pasdoc-border-color);
}

tr.listheader {
  background-color: var(--pasdoc-sidebar-bg);
  border-bottom: 2px solid var(--pasdoc-border-color);
}
tr.listheader th {
  font-weight: 600;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.025em;
  color: var(--pasdoc-muted);
}

tr.list { background-color: #ffffff; }
tr.list2 { background-color: var(--pasdoc-sidebar-bg); }
tr.list:hover,
tr.list2:hover { background-color: var(--pasdoc-accent-light); }

table.detail {
  border: 1px solid var(--pasdoc-border-color);
  border-radius: 0.375rem;
  overflow: hidden;
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
  width: 100%;
}
table.detail td {
  padding: 0.5rem 0.75rem;
  vertical-align: top;
}

table.summary td.itemcode,
table.detail td.itemcode { width: 100%; }
td.itemname { white-space: nowrap; }
td.itemunit { white-space: nowrap; }
td.itemdesc { width: 100%; }

/* === Visibility badges === */

.badge.vis-public    { background-color: #198754; font-size: 0.7rem; }
.badge.vis-published { background-color: #0d6efd; font-size: 0.7rem; }
.badge.vis-protected { background-color: #fd7e14; font-size: 0.7rem; }
.badge.vis-private   { background-color: #dc3545; font-size: 0.7rem; }
.badge.vis-automated { background-color: #6c757d; font-size: 0.7rem; }

td.visibility {
  width: 2.5rem;
  text-align: center;
  vertical-align: middle;
}
td.visibility a { text-decoration: none; }

table.markerlegend { width: auto; }
table.markerlegend td.legendmarker { text-align: center; padding-right: 1rem; }

/* === Code styling === */

code {
  font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
  font-size: 0.875em;
}

/* Style applied to Pascal code in documentation
   (e.g. produced by @longcode tag) } */
.longcode {
  font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
  font-size: 0.875em;
  background-color: var(--pasdoc-code-bg);
  border: 1px solid var(--pasdoc-border-color);
  border-radius: 0.375rem;
  padding: 1rem;
  overflow-x: auto;
}

pre.preformatted {
  font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
  font-size: 0.875em;
  background-color: var(--pasdoc-code-bg);
  border: 1px solid var(--pasdoc-border-color);
  border-radius: 0.375rem;
  padding: 1rem;
  overflow-x: auto;
}

/* Pascal syntax highlighting */
span.pascal_string { color: #0a3069; }
span.pascal_keyword { font-weight: 600; color: #cf222e; }
span.pascal_comment { color: #6e7781; font-style: italic; }
span.pascal_compiler_comment { color: #116329; }
span.pascal_numeric { color: #0550ae; }
span.pascal_hex { color: #0550ae; }

/* === Links === */

a:link, a:visited { color: var(--pasdoc-accent); text-decoration: none; }
a:hover { color: var(--pasdoc-accent-hover); text-decoration: underline; }

a.bold:link, a.bold:visited { color: var(--pasdoc-accent); font-weight: 600; text-decoration: none; }
a.bold:hover { text-decoration: underline; }

a.section { color: var(--pasdoc-accent); text-decoration: none; font-weight: 600; }
a.section:hover { text-decoration: none; }

ul.useslist a:link, ul.useslist a:visited { color: var(--pasdoc-accent); font-weight: 600; }
ul.useslist a:hover { text-decoration: underline; }

p.unitlink a:link, p.unitlink a:visited { color: var(--pasdoc-accent); font-weight: 600; }
p.unitlink a:hover { text-decoration: underline; }

/* === Lists === */

ul.hierarchy { list-style-type: none; padding-left: 1.5rem; }
ul.hierarchylevel { list-style-type: none; padding-left: 1.5rem; }

/* Actually this reduces vertical space between *every* paragraph
   inside list with @itemSpacing(compact).
   While we would like to reduce this space only for the
   top of 1st and bottom of last paragraph within each list item.
   But, well, user probably will not do any paragraph breaks
   within a list with @itemSpacing(compact) anyway, so it's
   acceptable solution. */
ul.compact_spacing p { margin-top: 0; margin-bottom: 0; }
ol.compact_spacing p { margin-top: 0; margin-bottom: 0; }
dl.compact_spacing p { margin-top: 0; margin-bottom: 0; }

/* === Description elements === */

/* The paragraph "This item has no description." with this CSS class appears
   on items that have no description, and no ancestor from which
   to take a description.
   By default we hide it, you can inhide it to explicitly see where descriptions are missing. */
p.nodescription {
  color: var(--pasdoc-muted);
  display: none;
}
p.inheritdescription, p.description-inherited { color: var(--pasdoc-muted); font-style: italic; }
dl.description dt { color: var(--pasdoc-muted); }
dl.parameters dt { color: var(--pasdoc-accent); font-weight: 500; }

/* Various browsers have various default styles for <h6>,
   sometimes ugly for our purposes, so it's best to set things
   like font-size and font-weight in out pasdoc.css explicitly. */
h6.description_section {
  font-size: 1rem;
  font-weight: 600;
  /* By default browsers usually have some large margin-bottom and
     margin-top for <h1-6> tags. In our case, margin-bottom is
     unnecessary, we want to visually show that description_section
     is closely related to content below. In this situation
     (where the font size is just as a normal text), smaller bottom
     margin seems to look good. */
  margin-top: 1.25rem;
  margin-bottom: 0.25rem;
}

/* === Warning and Note tags === */

dl.tag.warning {
  background-color: #f8d7da;
  border: 1px solid #f5c2c7;
  border-left: 4px solid #dc3545;
  border-radius: 0.375rem;
  padding: 0.75rem 1rem;
  margin: 0.5rem 0;
}
dl.tag.warning dt { color: #842029; }
dl.tag.warning dd { color: #58151c; margin-left: 0; }

dl.tag.note {
  background-color: #fff3cd;
  border: 1px solid #ffecb5;
  border-left: 4px solid #ffc107;
  border-radius: 0.375rem;
  padding: 0.75rem 1rem;
  margin: 0.5rem 0;
}
dl.tag.note dt { color: #664d03; }
dl.tag.note dd { color: #664d03; margin-left: 0; }

/* === Misc === */

p.hint_directive { color: #dc3545; font-style: italic; }

hr {
  border: 0;
  border-top: 1px solid var(--pasdoc-border-color);
  margin: 1.5rem 0;
}

.appinfo {
  float: right;
  text-align: right;
  margin-bottom: 1rem;
  font-size: 0.8rem;
  color: var(--pasdoc-muted);
}

img { border: 0; }

acronym.mispelling { background-color: #f00; }

/*
input#search_text { }
input#search_submit_button { }
*/

.source_position {
  font-size: 80%;
  color: gray;
}

.show-members-toggles {
  margin: 0.75em 0;
  padding: 0.4em 0.75em;
  background: var(--pasdoc-code-bg);
  border: 1px solid var(--pasdoc-border-color);
  border-radius: 0.25rem;
  font-size: 0.875rem;
}
.show-members-toggles .show-members-toggles-label {
  color: var(--pasdoc-muted);
  margin-right: 0.75em;
}
.show-members-toggles label { margin-right: 1em; user-select: none; cursor: pointer; }

/* === Search form === */

.search-form { white-space: nowrap; }
.search-input input {
  max-width: 80%;
  padding: 0.25rem 0.5rem;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
  font-size: 0.875rem;
}
.search-input input:focus {
  border-color: var(--pasdoc-accent);
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.25);
}
.search-input input, .search-button { display: inline-block; vertical-align: middle; }
.search-input { display: inline-block; }

/* === User-created tables (@table tag) === */

/* Style for table created by @table tags:
   just some thin border.

   This way we have some borders around the cells
   (so cells are visibly separated), but the border
   "blends with the background" so it doesn't look too ugly.
   Hopefully it looks satisfactory in most cases and for most
   people.

   We add padding for cells, otherwise they look too close.
   This is normal thing to do when border-collapse is set to
   collapse (because this eliminates spacing between cells).
*/
table.table_tag { border-collapse: collapse; }
table.table_tag td, table.table_tag th {
  border: 1px solid var(--pasdoc-border-color);
  padding: 0.5rem;
}
table.table_tag th {
  background-color: var(--pasdoc-sidebar-bg);
  font-weight: 600;
}

/* Do not make extra vertical space at the beginning/end of table cells.
   We need ">" selector, to not change paragraphs inside lists inside
   table cells. */
table.table_tag td > p:first-child,
table.table_tag th > p:first-child,
       td.itemdesc > p:first-child { margin-top: 0; }

table.table_tag td > p:last-child,
table.table_tag th > p:last-child,
       td.itemdesc > p:last-child { margin-bottom: 0; }