/* All CSS here will be loaded for users of the Vector 2022 skin */

/* Taerel Wiki Light Mode Theme by Stevie Lambert */
/* Copyright Stevie Lambert 2023 - 2024 - All rights reserved */

/* Define the colors for the vars */

:root {
  --taerel-light-mode-bg-primary: #dae1e8;
  --taerel-light-mode-bg-primary-transparent: rgba(218, 225, 232, 0.8);
  --taerel-light-mode-bg-secondary: #f7fafc;
  --taerel-light-mode-bg-tertiary: #ebf2fa;
  --taerel-light-mode-bg-header-footer: #c3e0fa;
  --taerel-light-mode-border-color: #4ea9e6;
  --taerel-light-mode-text-primary: black;
  --taerel-light-mode-text-secondary: #003f75;
  --taerel-light-mode-link-color: #003f75;
  --taerel-light-mode-visited-link-color: #010a5c;
}

.mw-page-container {
  background: none;
}

.vector-header-container .mw-header,
.vector-header-container .vector-sticky-header {
  background-color: var(--taerel-light-mode-bg-secondary);
  color: var(--taerel-light-mode-text-secondary);
  border: 1px solid var(--taerel-light-mode-border-color);
}

.mw-content-container {
  background-color: var(--taerel-light-mode-bg-secondary);
  border: 1px solid var(--taerel-light-mode-border-color);
  padding-left: 1em;
  padding-right: 1em;
  color: var(--taerel-light-mode-text-primary);
}

.vector-page-titlebar .firstHeading {
  color: var(--taerel-light-mode-text-primary);
}

.vector-pinned-container {
  background-color: var(--taerel-light-mode-bg-tertiary);
  color: var(--taerel-light-mode-text-secondary);
  border: 1px solid var(--taerel-light-mode-border-color);
  overflow: hidden;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

#vector-page-tools-dropdown {
display:none;
}

#left-navigation {
margin-right:2em;
}

.vector-feature-zebra-design-disabled #vector-page-tools-pinned-container .vector-page-tools {
  background-color: var(--taerel-light-mode-bg-tertiary);
  color: var(--taerel-light-mode-text-secondary);
  padding-left: 1em;
  border: 1px solid var(--taerel-light-mode-border-color);
}

.vector-feature-zebra-design-disabled #vector-page-tools-pinned-container .vector-page-tools::after {
  background: none;
}

.vector-feature-zebra-design-disabled .vector-pinnable-element > *:not(:last-child),
.vector-feature-zebra-design-disabled .vector-dropdown-content > *:not(:last-child) {
  border-bottom: none;
}

.vector-pinnable-header-label {
  color: var(--taerel-light-mode-text-primary);
}

.vector-menu-heading .mw-headline {
  color: var(--taerel-light-mode-text-primary);
}

.vector-feature-zebra-design-disabled .vector-pinnable-element .vector-menu-heading,
.vector-feature-zebra-design-disabled .vector-dropdown-content .vector-menu-heading {
  color: var(--taerel-light-mode-text-secondary);
}

h1 span,
h2 span,
h3 span,
h4 span {
  color: var(--taerel-light-mode-text-primary);
}

.vector-menu-tabs .mw-list-item.selected a,
.vector-menu-tabs .mw-list-item.selected a:visited {
  color: var(--taerel-light-mode-text-primary);
}

#catlinks {
  background-color: var(--taerel-light-mode-bg-tertiary);
  color: var(--taerel-light-mode-text-secondary);
  margin-bottom: 1em;
}

.vector-feature-zebra-design-disabled .mw-body .vector-page-titlebar {
  border-top: 1px solid var(--taerel-light-mode-border-color);
  border-left: 1px solid var(--taerel-light-mode-border-color);
  border-right: 1px solid var(--taerel-light-mode-border-color);
  padding: 1em;
  background-color: var(--taerel-light-mode-bg-tertiary);
}

.vector-feature-zebra-design-disabled .mw-body .vector-page-toolbar {
  border-left: 1px solid var(--taerel-light-mode-border-color);
  border-right: 1px solid var(--taerel-light-mode-border-color);
  padding: 1em;
  background-color: var(--taerel-light-mode-bg-tertiary);
}

.vector-feature-zebra-design-disabled .mw-body #bodyContent {
  border-left: 1px solid var(--taerel-light-mode-border-color);
  border-right: 1px solid var(--taerel-light-mode-border-color);
  border-bottom: 1px solid var(--taerel-light-mode-border-color);
  padding: 1em;
  background-color: var(--taerel-light-mode-bg-tertiary);
}

.vector-feature-zebra-design-disabled.client-js.vector-sticky-header-enabled #vector-page-tools-pinned-container .vector-page-tools {
  background-color: var(--taerel-light-mode-bg-tertiary);
  color: var(--taerel-light-mode-text-primary);
  padding-left: 1em;
  border: 1px solid var(--taerel-light-mode-border-color);
}

.vector-feature-zebra-design-disabled #vector-toc-pinned-container .vector-toc::after {
  background: none;
}

.vector-feature-zebra-design-disabled.client-js.vector-feature-toc-pinned-clientpref-0 body:not(.vector-sticky-header-visible) .vector-page-titlebar-toc .vector-toc {
  background-color: var(--taerel-light-mode-bg-tertiary);
  color: var(--taerel-light-mode-text-primary);
  border: 1px solid var(--taerel-light-mode-border-color);
}

.vector-feature-zebra-design-disabled .vector-toc .vector-toc-list-item-active > .vector-toc-link .vector-toc-text,
.vector-feature-zebra-design-disabled .vector-toc .vector-toc-level-1-active:not(.vector-toc-list-item-expanded) > .vector-toc-link .vector-toc-text,
.vector-feature-zebra-design-disabled .vector-toc .vector-toc-list-item-active.vector-toc-level-1-active > .vector-toc-link .vector-toc-text {
  color: var(--taerel-light-mode-text-secondary);
}

a {
  color: var(--taerel-light-mode-link-color);
}

a:visited {
  color: var(--taerel-light-mode-visited-link-color);
}

.vector-feature-zebra-design-disabled .vector-toc .vector-pinnable-header-label {
  color: var(--taerel-light-mode-text-primary);
}

.vector-feature-zebra-design-disabled .vector-toc .vector-toc-list-item a {
  color: var(--taerel-light-mode-link-color);
}

.vector-feature-zebra-design-disabled .vector-pinnable-element .mw-list-item a:not(.mw-selflink):visited,
.vector-feature-zebra-design-disabled .vector-dropdown-content .mw-list-item a:not(.mw-selflink):visited {
  color: var(--taerel-light-mode-visited-link-color);
}

.vector-feature-zebra-design-disabled .vector-pinnable-element .mw-list-item a,
.vector-feature-zebra-design-disabled .vector-dropdown-content .mw-list-item a {
  color: var(--taerel-light-mode-link-color);
}

.vector-feature-zebra-design-disabled .vector-dropdown .mw-list-item a:not(.mw-selflink) {
  color: var(--taerel-light-mode-link-color);
}

.vector-feature-zebra-design-disabled.vector-feature-limited-width-clientpref-0 .mw-body,
.vector-feature-zebra-design-disabled.vector-feature-limited-width-content-disabled .mw-body {
  background-color: var(--taerel-light-mode-bg-header-footer);
}

.vector-feature-zebra-design-disabled.vector-feature-page-tools-pinned-enabled .mw-body {
  background-color: var(--taerel-light-mode-bg-header-footer);
}

.vector-feature-zebra-design-disabled .mw-body {
  background-color: var(--taerel-light-mode-bg-header-footer);
}

.mw-footer li {
  color: var(--taerel-light-mode-text-primary);
  margin: 0;
  padding: 0.5em 0;
  font-size: 0.75em;
}

.vector-feature-toc-pinned-clientpref-0 body:not(.vector-sticky-header-visible) .vector-page-titlebar .vector-toc-landmark,
.vector-feature-toc-pinned-clientpref-0 .vector-sticky-header-visible .vector-sticky-header-context-bar .vector-toc-landmark,
.vector-feature-toc-pinned-clientpref-1 .vector-column-start .vector-toc-landmark {
  margin-left: 0.7em;
}

.vector-pinnable-element .mw-list-item a,
.vector-dropdown-content .mw-list-item a {
  color: var(--taerel-light-mode-link-color);
}

.vector-pinnable-element .mw-list-item a:not(.mw-selflink):visited,
.vector-dropdown-content .mw-list-item a:not(.mw-selflink):visited {
  color: var(--taerel-light-mode-visited-link-color);
}

#vector-main-menu > div.vector-main-menu-action.vector-main-menu-action-opt-out > div > div {
  display: none;
}

#mw-content-text > div:nth-child(22) > ul > li:nth-child(4) > a {
  display: none;
}

.vector-toc .vector-toc-list-item-active > .vector-toc-link .vector-toc-text,
.vector-toc .vector-toc-level-1-active:not(.vector-toc-list-item-expanded) > .vector-toc-link .vector-toc-text,
.vector-toc .vector-toc-list-item-active.vector-toc-level-1-active > .vector-toc-link .vector-toc-text .vector-pinnable-element .vector-menu-heading {
  color: var(--taerel-light-mode-text-primary);
}

.vector-pinnable-element .vector-menu-heading {
  background: var(--taerel-light-mode-bg-header-footer);
  border: 1px solid var(--taerel-light-mode-border-color);
  margin: 5px 0;
  padding: 0 5px;
  text-align: center;
  color: var(--taerel-light-mode-text-primary);
}

.vector-pinnable-header-toggle-button {
  background-color: var(--taerel-light-mode-bg-header-footer);
  background: var(--taerel-light-mode-bg-header-footer);
  margin-top: 5px;
  border: 1px solid var(--taerel-light-mode-border-color);
  text-align: center;
  color: var(--taerel-light-mode-text-primary);
}

.vector-pinnable-header-label {
  background: var(--taerel-light-mode-bg-header-footer);
  border: 1px solid var(--taerel-light-mode-border-color);
  margin: 5px 0;
  padding: 0 5px;
  text-align: center;
  color: var(--taerel-light-mode-text-primary);
}

a {
  color: var(--taerel-light-mode-link-color);
}

.vector-toc .vector-toc-link .vector-toc-text {
  color: var(--taerel-light-mode-link-color);
}

#mp-left {
  border: 1px solid var(--taerel-light-mode-border-color);
  background-color: var(--taerel-light-mode-bg-tertiary);
  color: var(--taerel-light-mode-text-primary);
  width: 50%;
  vertical-align: top;
  padding: 8px;
}

#mp-right {
  border: 1px solid var(--taerel-light-mode-border-color);
  background-color: var(--taerel-light-mode-bg-tertiary);
  color: var(--taerel-light-mode-text-primary);
  width: 49%;
  vertical-align: top;
  padding: 8px;
}

#mp-upper {
  color: var(--taerel-light-mode-text-primary);
  width: 100%;
  padding: 8px;
}

#mp-lower {
  border: 1px solid var(--taerel-light-mode-border-color);
  background-color: var(--taerel-light-mode-bg-tertiary);
  color: var(--taerel-light-mode-text-primary);
  width: 49%;
  vertical-align: top;
  padding: 8px;
}

#mp-left .mp-h2,
#mp-right .mp-h2, 
#mp-lower .mp-h2 {
  background: var(--taerel-light-mode-bg-header-footer);
  border: 1px solid var(--taerel-light-mode-border-color);
  margin: 5px 0;
  padding: 0 5px;
  text-align: center;
}

::-webkit-scrollbar {
  width: 0px;
  background: transparent;
}

.container {
  display: grid;
  width: 200%;
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 1em;
  padding-top: 20px;
}

.button {
  padding: 8px;
  text-align: center;
  cursor: pointer;
  background-color: var(--taerel-light-mode-bg-header-footer);
  border: 1px solid var(--taerel-light-mode-border-color);
  color: var(--taerel-light-mode-text-primary);
  font-size: 1em;
}

#mwDA {
  border: none;
}

#ooui-3 {
  background-color: var(--taerel-light-mode-bg-secondary);
  border: 1px solid var(--taerel-light-mode-border-color);
  color: var(--taerel-light-mode-text-primary);
}

#mw-content-text > div.mw-htmlform-ooui-wrapper.oo-ui-layout.oo-ui-panelLayout.oo-ui-panelLayout-padded.oo-ui-panelLayout-framed {
  display: none;
}

.cdx-menu {
  border: none;
  box-shadow: none;
}

.cdx-menu--has-footer .cdx-menu-item:last-of-type:not(:first-of-type) {
  border: none;
  box-shadow: none;
}

.cdx-search-input--has-end-button .cdx-search-input__input-wrapper .cdx-text-input__input {
  background-color: var(--taerel-light-mode-bg-header-footer);
  color: var(--taerel-light-mode-text-primary);
}

#cdx-typeahead-search-menu-0 {
  background-color: var(--taerel-light-mode-bg-secondary);
  border: 1px solid var(--taerel-light-mode-border-color);
  color: var(--taerel-light-mode-text-primary);
}

.cdx-typeahead-search__search-footer {
  background-color: var(--taerel-light-mode-bg-secondary);
}

.cdx-search-result-title {
  color: var(--taerel-light-mode-text-primary);
}

.cdx-thumbnail,
.cdx-typeahead-search__search-footer {
  display: none;
}

#p-search .cdx-menu-item:hover {
  background-color: var(--taerel-light-mode-bg-header-footer);
}

.mw-search-profile-tabs {
  background: var(--taerel-light-mode-bg-header-footer);
  border: 1px solid var(--taerel-light-mode-border-color);
}

#ooui-php-1 {
  background: var(--taerel-light-mode-bg-header-footer);
  border: 1px solid var(--taerel-light-mode-border-color);
  color: var(--taerel-light-mode-text-primary);
}

.vector-sticky-pinned-container::after {
  background: none;
  background-repeat: no-repeat;
}

#mw-content-text > div:nth-child(2) > a,
#mw-content-text > div:nth-child(5) > a {
  background: var(--taerel-light-mode-bg-header-footer);
  border: 1px solid var(--taerel-light-mode-border-color);
  color: var(--taerel-light-mode-text-primary);
  padding: 0.3em;
}

#mw-content-text > div.mw-allpages-body {
  margin-top: 2em;
  margin-bottom: 2em;
}

#mw-content-text > div:nth-child(5) {
  padding: 1em;
}

#ooui-1 {
  background: var(--taerel-light-mode-bg-secondary);
  border: 1px solid var(--taerel-light-mode-border-color);
  color: var(--taerel-light-mode-text-primary);
}

#ooui-1 .oo-ui-menuOptionWidget:hover {
  background-color: var(--taerel-light-mode-bg-header-footer);
}

.article-copyright {
  border: 1px solid var(--taerel-light-mode-border-color);
  background-color: var(--taerel-light-mode-bg-tertiary);
  color: var(--taerel-light-mode-text-primary);
  margin-bottom: 0.5em;
  margin-top: 10px;
  padding: 0 5px;
}

.article-copyright img {
  width: 100px;
}

#footer-poweredbyico {
  filter: invert(100%);
}


@media (max-width: 850px) {
.skin-vector {
background-image: none;
background-color: #ebf2fa;
}
}


@media (min-width: 850px) {
.skin-vector {
  background: linear-gradient(
      to bottom,
      transparent 0%,
      var(--taerel-light-mode-bg-primary-transparent) 50%,
      var(--taerel-light-mode-bg-primary) 75%,
      var(--taerel-light-mode-bg-primary) 100%
    ),
    url(https://taerel.com/Wiki/images/4/4d/853012.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-color: var(--taerel-light-mode-bg-primary);
  background-size: 100vw 100vh;
}
}

.vector-page-toolbar-container .mw-portlet-views {
    display: block;
    position: absolute;
    right: 30em;
    }
    
    /* --- Tools Menu Size Adjustments --- */

/* Sets the overall width of the right-hand sidebar container */
.vector-column-end {
    width: 15em !important; /* Adjust this value to match your desired width */
    min-width: 15em;
}

/* Adjusts the internal padding and font size for the Tools menu items */
#vector-page-tools .vector-menu-content-list {
    padding: 8px !important;
    font-size: 0.85em; /* Slightly smaller text for a more compact look */
}

/* --- Mobile View Overrides --- */
@media (max-width: 850px) {
  /* 1. Fix the 200% width on the Page Hub buttons causing horizontal scroll */
  .container {
    width: 100% !important;
    grid-template-columns: 1fr 1fr !important; /* Stack buttons 2-per-row */
    display: grid !important;
  }

  /* 2. Push the "Read/Edit/View" tabs out of the header so they don't overlap */
  .vector-page-toolbar-container .mw-portlet-views {
    position: relative !important;
    right: auto !important;
    top: auto !important;
    margin: 10px 0 !important;
  }

  /* 3. Force the side-by-side tables to stack vertically into the content area */
  #mp-upper, #mp-upper tbody, #mp-upper tr, #mp-upper td {
    display: block !important;
    width: 102% !important;
    box-sizing: border-box !important;
    margin-bottom:1em;
    margin-top:1em;
  }
  
  /* 4. Keep Read, Edit, and View history on one single line */
  #p-views .vector-menu-content-list {
    display:none;
  }

  #p-views .mw-list-item {
    margin-right: 12px !important;
  }

  /* 5. Ensure the main page container doesn't overflow the phone screen */
  .mw-page-container, .mw-content-container, .mw-body {
    width: 98% !important;
    margin: 0 !important;
    padding: 5px !important;
    overflow-x: hidden !important;
   
  }
  
   .vector-pinned-container {
   display:none;
   }
   
td#mp-lower {
  position: relative;
  top: -3em;
  margin-bottom: -5em;
}