/* This line is theme specific - it includes the base theme CSS */
/* The Read the Docs default theme "theme.css" can be found here:
/* source > _themes > sphinx_rtd_theme > static > css > theme.css */
@import "theme.css";

/* color variables added by Allard - they are used through the entire file */
:root {
  /* Main semantic color */
  /*nextanno teal*/
  --sd-color-primary: hsl(183, 81%, 39%);
  --sd-color-primary-highlight: hsl(183, 81%, 29%);
  --sd-color-primary-text: hsl(183, 81%, 99%);
  --sd-color-primary-transparent: hsla(183, 81%, 39%, 0.2);

  /* Secondary / neutral colors */
  /*nextnano "gray"*/
  --sd-color-secondary: hsl(183, 1%, 39%);
  --sd-color-secondary-highlight: hsl(183, 1%, 29%);
  --sd-color-secondary-text: hsl(183, 1%, 9%);
  --sd-color-secondary-transparent: hsla(183, 1%, 39%, 0.2);

  /*nextanno green*/
  --sd-color-success: hsl(120, 81%, 35%);
  --sd-color-success-highlight: hsl(120, 81%, 25%);
  --sd-color-success-text: hsl(120, 81%, 99%);
  --sd-color-success-transparent: hsla(120, 81%, 35%, 0.2);

   /*nextanno teal*/
  --sd-color-info: hsl(183, 81%, 39%);
  --sd-color-info-highlight: hsl(183, 81%, 29%);
  --sd-color-info-text: hsl(183, 81%, 99%);
  --sd-color-info-transparent: hsla(183, 81%, 39%, 0.2);

  /*nextnano orange*/
  --sd-color-warning: hsl(38, 81%, 50%);
  --sd-color-warning-highlight: hsl(38, 81%, 40%);
  --sd-color-warning-text: hsl(38, 81%, 99%);
  --sd-color-warning-transparent: hsla(38, 75%, 50%, 0.2);

  /*nextnano red*/
  --sd-color-danger: hsl(350, 81%, 45%);
  --sd-color-danger-highlight: hsl(350, 81%, 35%);
  --sd-color-danger-text: hsl(350, 81%, 99%);
  --sd-color-danger-transparent: hsla(350, 81%, 45%, 0.2);

  /*nextnano "gray"*/
  --sd-color-muted: hsl(183, 1%, 39%);
  --sd-color-muted-highlight: hsl(183, 1%, 29%);
  --sd-color-muted-text: hsl(183, 1%, 99%);
  --sd-color-muted-transparent: hsla(183, 1%, 39%, 0.2);

  --sd-color-light: hsl(183, 1%, 99%);
  --sd-color-light-highlight: hsl(183, 1%, 80%);
  --sd-color-light-text: hsl(183, 1%, 20%);
  --sd-color-light-transparent: hsla(183, 1%, 90%, 0.2);

  --sd-color-dark: hsl(180, 1%, 19%);
  --sd-color-dark-highlight: hsl(183, 1%, 24%);
  --sd-color-dark-text: hsl(183, 1%, 89%);
  --sd-color-dark-transparent: hsla(183, 1%, 19%, 0.2);

  /* Card styling */
  --sd-color-card-border:  var(--sd-color-dark);
  --sd-color-card-border-hover: var(--sd-color-primary);
  --sd-color-card-background: var(--sd-color-light);
  --sd-color-card-text: var(--sd-color-light-text);
  --sd-color-card-header: var(--sd-color-light-text);

  --sd-color-windows: rgb(0,120,212);
  --sd-color-rhel: rgb(204,0,0);
  --sd-color-ubuntu: rgb(233,84,32);
  --sd-color-macos: rgb(0,0,0);

  /* Dropdowns */
  --sd-fontsize-dropdown-title: 1rem;
  --sd-fontweight-dropdown-title: 600;

  /* Shadow *//*
  --sd-color-shadow: var(--sd-color-dark)*/
  
  /* Tabs, if used */
  --sd-color-tabs-label-active: var(--sd-color-primary);
  --sd-color-tabs-label-hover: var(--sd-color-primary-highlight);
  --sd-color-tabs-label-inactive: var(--sd-color-primary);

  --sd-color-tabs-underline-active: var(--sd-color-primary);
  --sd-color-tabs-underline-hover: var(--sd-color-primary-transparent);
  --sd-color-tabs-underline-inactive: var(--sd-color-muted-transparent);


}

/* ----------------------------- */
/* Design elements for dropdowns */
/* ----------------------------- */

.nn-dropdown {
    border: 1px solid var(--sd-color-dark);
}

.nn-dropdown-title {
    background-color: var(--sd-color-dark);
    color: var(--sd-color-dark-text);
    font-weight: 700;
}


/* ---------------------------------- */
/* Design elements for download cards */
/* ---------------------------------- */

/* General download card */
.general-card {
    border: 1px solid var(--sd-color-dark);
    border-left: 0.35rem solid var(--sd-color-success);
    border-radius: 0.6rem;
}
/* Hover state */
.general-card:hover {
    border-color: var(--sd-color-primary);
    box-shadow: 0 0.15rem 0.5rem;
}
/* Title */
.general-card-title {
    color: var(--sd-color-success);
}
/* Hover state */
.general-card:hover .general-card-title {
    color: var(--sd-color-primary);
}

/* Windows download card */
.windows-card {
    border: 1px solid var(--sd-color-dark);
    border-left: 0.35rem solid var(--sd-color-windows);
    border-radius: 0.6rem;
}
/* Hover state */
.windows-card:hover {
    border-color: var(--sd-color-primary);
    box-shadow: 0 0.15rem 0.5rem;
}
/* Title */
.windows-card-title {
    color: var(--sd-color-windows);
}
/* Hover state */
.windows-card:hover .windows-card-title {
    color: var(--sd-color-primary);
}

/* Ubuntu download card */
.ubuntu-card {
    border: 1px solid var(--sd-color-dark);
    border-left: 0.35rem solid var(--sd-color-ubuntu);
    border-radius: 0.6rem;
}
/* Hover state */
.ubuntu-card:hover {
    border-color: var(--sd-color-primary);
    box-shadow: 0 0.15rem 0.5rem;
}
/* Title */
.ubuntu-card-title {
    color: var(--sd-color-ubuntu);
}
/* Hover state */
.ubuntu-card:hover .ubuntu-card-title {
    color: var(--sd-color-primary);
}

/* RHEL download card */
.rhel-card {
    border: 1px solid var(--sd-color-dark);
    border-left: 0.35rem solid var(--sd-color-rhel);
    border-radius: 0.6rem;
}
/* Hover state */
.rhel-card:hover {
    border-color: var(--sd-color-primary);
    box-shadow: 0 0.15rem 0.5rem;
}
/* Title */
.rhel-card-title {
    color: var(--sd-color-rhel);
}
/* Hover state */
.rhel-card:hover .rhel-card-title {
    color: var(--sd-color-primary);
}

/* macOS download card */
.macos-card {
    border: 1px solid var(--sd-color-dark);
    border-left: 0.35rem solid var(--sd-color-macos);
    border-radius: 0.6rem;
}
/* Hover state */
.macos-card:hover {
    border-color: var(--sd-color-primary);
    box-shadow: 0 0.15rem 0.5rem;
}
/* Title */
.macos-card-title {
    color: var(--sd-color-macos);
}
/* Hover state */
.macos-card:hover .macos-card-title {
    color: var(--sd-color-primary);
}

/* ------------------------------------------- */
/* Design elements for the logo in the sidebar */
/* ------------------------------------------- */

/* removes the logo on top */
.side-bar-logo {
  display: none;
}

/* For smaller screen sizes (mobile) */

@media screen and (max-width: 768px) {
    .wy-nav-content-wrap {
    background-color: var(--sd-color-dark);
  }
  .wy-nav-content {
    background-color: var(--sd-color-light);
  }
}

/* ------ */
/* Search */
/* ------ */

.wy-side-nav-search .wy-form input[type="text"] {
    border-style: none;
}

/* -------------- */
/* Navigation bar */
/* -------------- */

/* Navigation background */
.wy-nav-side {
  background: var(--sd-color-dark);
  transition: top 0.3s;
}

/* Navigation links */
.wy-menu-vertical a {
  color: var(--sd-color-dark-text);
}

/* Navigation hover */
.wy-menu-vertical a:hover {
  background-color: var(--sd-color-dark-highlight);
  color: var(--sd-color-light-highlight);
}

/* Captions in the navigation tree */
.wy-menu-vertical header,
.wy-menu-vertical p.caption {
  color: var(--sd-color-primary);
}

/* Mobile top navigation */
.wy-nav-top {
  color: var(--sd-color-primary-text);
}

.wy-nav-content-wrap.shift {
  top: inherit;
}

/* ------- */
/* Content */
/* ------- */

/* width of the content */
.wy-nav-content {
  max-width: 1240px; /*reduced from  1620px*/
  background: var(--sd-color-light)
}

/* the colour of the wrap*/
.wy-nav-content-wrap{
  background: var(--sd-color-dark);
}

/* Color of hyperlinks in the document content */
.wy-nav-content a:link,
.wy-nav-content a:visited {
  color: var(--sd-color-primary);
  text-decoration: none;
}

/* -------------------------------------------- */
/* Coloring admonitions                         */
/* -------------------------------------------- */

.admonition.important {
  background-color: var(--sd-color-info-transparent);
}
.admonition.important > .admonition-title {
  background-color: var(--sd-color-info);
  color: var(--sd-color-info-text);
}

.admonition.note {
  background-color: var(--sd-color-muted-transparent);
}
.admonition.note > .admonition-title {
  background-color: var(--sd-color-muted);
  color: var(--sd-color-muted-text);
}

.admonition.attention,
.admonition.warning {
  background-color: var(--sd-color-warning-transparent);
}
.admonition.attention > .admonition-title,
.admonition.warning > .admonition-title {
  background-color: var(--sd-color-warning);
  color: var(--sd-color-warning-text);
}
    
.admonition.danger,
.admonition.error {
  background-color: var(--sd-color-danger-transparent);
}
.admonition.danger > .admonition-title,
.admonition.error > .admonition-title {
  background-color: var(--sd-color-danger);
  color: var(--sd-color-danger-text);
}

.admonition.tip,
.admonition.hint {
  background-color: var(--sd-color-success-transparent);
}
.admonition.tip > .admonition-title,
.admonition.hint > .admonition-title {
  background-color: var(--sd-color-success);
  color: var(--sd-color-success-text);
}

/* --------------- */
/* Text formatting */
/* --------------- */

/* code literals */
.rst-content code.literal,
rst-content tt.literal{
  color: var(--sd-color-dark);
  white-space:normal;
  background: var(--sd-color-primary-almost-white);
  border: 1px solid var(--sd-color-primary);
}

/* code boxes */
.rst-content div[class^=highlight],
.rst-content pre.literal-block{
  background: var(--sd-color-light);
  border: 1px solid var(--sd-color-secondary);
}

/* guilabel */
.rst-content .guilabel {
  background: var(--sd-color-light);
  border: 1px solid var(--sd-color-secondary);
}

/* Editted by Herbert */
blockquote div dl.field-list dt,
blockquote div dl > dt {
  border-top: 2px solid var(--sd-color-primary);
  background-color: var(--sd-color-info);
  padding-left: 6px;
}

blockquote div ul > li > dl > dt {
  border-style: none;
  background: none;
  padding-left: 0px;
  font-size: 16px;
  font-weight: bold;
}

/* -------------------------------------------- */
/* Columns                                      */
/* -------------------------------------------- */

div.left-one-one {
  width: 49%;
  float: left;
}

div.right-one-one {
  margin-left: 51%;
}

div.left-two-one {
  width: 65%;
  float: left;
}

div.right-two-one {
  margin-left: 67%;
}

div.left-one-two {
  width: 33%;
  float: left;
}

div.right-one-two {
  margin-left: 35%;
}

/* Clear floats after the columns */
div.single-col {
  content: "";
  display: table;
  clear: both;
}

/* -------------------------------------------- */
/* Label equations                              */
/* -------------------------------------------- */

/* For the label of equations to be aligned on the right of them (added by NM on 21.01.2021) */

span.eqno {
    margin-left: 5px;
    margin-top: 15px;
    float: right;
    /* position the number above the equation so that :hover is activated */
    z-index: 1;
    position: relative;
}

span.eqno .headerlink {
  display: none;
  visibility: hidden;
}

span.eqno:hover .headerlink {
  display: inline-block;
  visibility: visible;
}
