/**
 * kOS JavaDoc custom style sheet
 * @author  Ben Zabloski
 * @version 2025-09-09
 */

@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Source+Code+Pro:ital,wght@0,200..900;1,200..900&display=swap");

:root {
  /**
  * Font families
  * The following properties define the font families used for various kinds of text in the page.
  */

  /* Defines the base font family for the page */
  --body-font-family: "Montserrat", sans-serif;

  /* Defines the font family used for blocks of documentation */
  --block-font-family: "Montserrat", sans-serif;

  /* Defines the font family used to display program code */
  --code-font-family: "Montserrat", sans-serif; /* "Source Code Pro", monospace; */

  /**
  * Font sizes
  * The following custom properties define font sizes for basic text in the page. Note that font sizes for specific elements such as headings and navigation links are derived from these custom properties:
  */

  /* Defines the base font size for normal text */
  --body-font-size: 16px;

  /* Defines the base font size for program code */
  --code-font-size: 16px;

  /**
  * Background colors
  * The following custom properties define background colors for various generic page elements.
  */

  /* Defines the main background color of the page */
  /* --body-background-color */

  /* Defines the background color of primary page sections */
  --section-background-color: #fafafa;

  /* Defines the background color of the details section */
  /* --detail-background-color */

  /* Defines the background color of the primary navigation bar and inactive tab buttons */
  --navbar-background-color: #fafafa;

  /* Defines the background color of the secondary navigation bar and table headers */
  --subnav-background-color: #f1f1f1;

  /* Defines the background color of selected navigation items and tab buttons */
  --selected-background-color: #f1f1f1;

  /* Defines the background color of even-numbered table rows in summary tables */
  /* --even-row-color */

  /* Defines the background color of odd-numbered table rows in summary tables */
  /* --odd-row-color */

  /**
  * Text colors
  * The following custom properties define text colors of various generic page elements.
  */

  /* Defines the main text color of the page */
  /* --body-text-color */

  /* Defines the text color for text blocks */
  /* --block-text-color */

  /* Defines the text color for the navigation bars */
  --navbar-text-color: #ffffff;

  /* Defines the text color for selected navigation items and tab buttons */
  --selected-text-color: #0293dc;

  /* Defines the text color for links in selected navigation items and tab buttons */
  --selected-link-color: #096dd9;

  /* Defines the text color for the page title */
  --title-color: #262626;

  /* Defines the text color for links */
  --link-color: #0293dc;

  /* Defines the text color for active links */
  --link-color-active: #40a9ff;

  /**
  * Colors for specific features
  * The following custom properties define background and text colors for various specific elements in the page.
  */

  /* Defines the background color for code snippets */
  /* --snippet-background-color */

  /* Defines the text color for code snippets */
  /* --snippet-text-color */

  /* Defines the text color for highlights in code snippets */
  /* --snippet-highlight-color */

  /* Defines the color for borders of section boxes */
  --border-color: #dfdfdf;

  /* Defines the color for border of tables */
  /* --table-border-color */

  /* Defines the background color for the search input */
  /* --search-input-background-color */

  /* Defines the text color for the search input */
  /* --search-input-text-color */

  /* Defines the text color for the search input placeholder text */
  /* --search-input-placeholder-color */

  /* Defines the background color for highlighted search tags */
  /* --search-tag-highlight-color */

  /* Defines the brightness for the copy-to-clipboard icon */
  /* --copy-icon-brightness */

  /* Defines the background for the copy-to-clipboard button */
  /* --copy-button-background-color-active */

  /* Defines the background color for invalid-tag notifications */
  /* --invalid-tag-background-color */

  /* Defines the text color for invalid-tag notifications */
  /* --invalid-tag-text-color */
}

:root {
  /**
  * Undocumented javadoc CSS Variables...
  */

  --sub-nav-height: initial;
  --top-nav-height: 72px;
}

/**
* Miscellaneous
* Extra changes to morph the documentation style into the desired look and
* feel...
*/

a:link {
  color: var(--link-color);
}
a:visited {
  color: var(--link-color);
}
a:active {
  color: var(--link-color-active);
}

body {
  font-family: var(--body-font-family);
  font-size: var(--body-font-size);
}

div.block {
  font-family: var(--block-font-family);
}

div.block pre {
  background-color: var(--section-background-color);
}

code {
  font-family: var(--code-font-family);
  font-size: var(--code-font-size);
}

.about-language {
  margin: 0;
}

.kos-header {
  display: flex;
  align-items: center;
}

.kos-logo {
  background-image: url("./resources/assets/kos-logo.svg");
  background-repeat: no-repeat;
  width: 67px;
  height: 25px;
}

.top-nav {
  background-color: #262626;
}

.title {
  color: var(--title-color);
}

/* Modifies the main section border and layout... */
.summary section[class$="-summary"],
.details section[class$="-details"],
.class-uses .detail,
.serialized-class-details {
  border: none;
  border-radius: 16px;
  padding: 17px 32px 32px 32px;
  background-color: var(--section-background-color);
}

/* Modifies the sub-section border... */
.inherited-list,
section[class$="-details"] .detail {
  border-radius: 8px;
  border: 1px solid #dfdfdf;
  padding-left: 16px;
  overflow: hidden;
}

/* Modifies the table border and layout... */
div.table-tabs {
  margin-bottom: 16px;
}
div.table-tabs > button.active-table-tab {
  background-color: transparent;
  color: var(--selected-text-color);
  text-decoration: underline;
  text-underline-offset: 12px;
}
div.table-tabs > button {
  padding-left: 0;
}
div.table-tabs > button.table-tab {
  background: transparent;
  color: #262626;
  font-weight: 400;
}
.summary-table,
.details-table {
  border-radius: 8px;
  border: 1px solid #dfdfdf;
  background: #ffffff;
  overflow: hidden;
}

.table-header {
  background-color: var(--subnav-background-color);
}
.even-row-color {
  background-color: #ffffff;
}
.odd-row-color {
  background-color: var(--section-background-color);
}

body.class-declaration-page .summary h3,
body.class-declaration-page .details h3,
body.class-declaration-page .summary .inherited-list h2 {
  background-color: var(--subnav-background-color);
}

/* Modifies header styles and layout... */
body.class-declaration-page .details h2 {
  font-style: normal;
}
body.class-declaration-page .details h3 {
  border: none;
  font-size: 16px;
  margin-left: -16px;
  padding-left: 16px;
}
body.class-declaration-page .summary h2 {
  font-style: normal;
}
body.class-declaration-page .summary h3 {
  border: none;
  font-size: 16px;
  margin-left: -16px;
  padding-left: 16px;
}

/* Modifies the styles and layout of heading nodes... */
.caption {
  margin-bottom: 16px;
}
.caption a:visited {
  color: var(--link-color-active);
}
.caption a:hover {
  color: var(--link-color-active);
}
.caption span {
  padding-left: 0;
  background-color: transparent;
}

/* Modifies the search input styles and layout... */
.sub-nav {
  background-color: transparent;
}
.sub-nav .nav-list-search {
  padding: 0 12px;
  position: relative;
}
input#page-search-input,
input#search-input,
input.filter-input {
  background-position: 8px 10px;
  border: 1px solid #dfdfdf;
  border-radius: 12px;
  color: #262626;
  margin: 12px 16px;
  outline: 1px solid var(--link-color-active);
  padding: 8px 24px 8px 24px;
}
input#reset-button,
input#reset-search,
input.reset-filter {
  cursor: pointer;
  left: calc(100% - 36px);
  position: absolute;
  top: 21px;
}

/* Modifies the nav bar layout... */
ul.nav-list {
  padding-left: 16px;
}

/* Modifies the nav bar selection styles... */
.nav-bar-cell1-rev {
  background-color: transparent;
  color: #ffffff;
  font-weight: 700;
  text-decoration: underline var(--selected-text-color);
  text-underline-offset: 6px;
}

/* Modifies page padding... */
ol.sub-nav-list {
  padding-left: 16px;
}
.main-grid nav.toc > ol.toc-list {
  padding-left: 16px;
}

/* Modifies autocomplete dropdown */
.ui-autocomplete-category {
  color: var(--title-color);
  background: var(--subnav-background-color);
}
.ui-autocomplete-category:hover {
  background-color: var(--subnav-background-color);
}

/* Trying to target dropdown orange colour... */
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
  background: transparent;
  border: 1px solid transparent;
}
