/* vars */
:root {
  /* Media-Querys */
  --y-screensize-xl: 1600px;
  --y-screensize-l: 1280px;
  --y-screensize-m: 1024px;
  --y-screensize-s: 768px;
  --y-screensize-xs: 420px;
  /* Color-Scheme */
  /* Light */
  --y-light-page-bg: var(--color-content-bg);
  --y-light-page-bg-alt: var(--color-content-bg-alt);
  --y-light-page-border-color:  var(--color-content-border);
  --y-light-page-heading: var(  --color-content-heading);
  --y-light-page-text: var(--color-content-text);
  --y-light-page-link: var(--color-content-link);
  --y-light-page-link-hover: var(--color-content-link-hover);
  --y-light-page-primary: var(--color-content-primary);
  --y-light-page-secondary: var(--color-content-secondary);
  --y-light-page-faded: var(--color-content-faded);
  --y-light-page-overlay: var(--color-content-overlay);

  --y-tmce-highlight-bg: #f1f1f1;
  /* -------------------- */
  /* Dark */
  --y-dark-page-bg: var(--color-alt-content-bg);
  --y-dark-page-bg-alt: var(--color-alt-content-bg-alt);
  --y-dark-page-border-color:  var(--color-alt-content-border);
  --y-dark-page-heading: var(  --color-alt-content-heading);
  --y-dark-page-text: var(--color-alt-content-text);
  --y-dark-page-link: var(--color-alt-content-link);
  --y-dark-page-link-hover: var(--color-alt-content-link-hover);
  --y-dark-page-primary: var(--color-alt-content-primary);
  --y-dark-page-secondary: var(--color-alt-content-secondary);
  --y-dark-page-faded: var(--color-alt-content-faded);
  --y-dark-page-overlay: var(--color-alt-content-overlay);
  /* -------------------- */
  /* Container */
  --y-header-height: var(--header-height);
  --y-container-with: var(--site-content-width,1200px);
  --y-container-padding: var(--yuhura-global-padding);
  /* Typo */


  /* globals */
  --y-global-transition-speed: 0.3s;
  --y-font-family-code: monospace;
  /* Sizes */
  --y-site-content-width: var(--site-content-width);
  --y-box-padding: 1.5rem;
  --y-block-margin: 3rem;
  --y-header-sticky-height: var(--header-sticky-height);
  /* Border */
  --y-border-size: 1px;
  --y-border-radius-m: var(--yuhura-global-border-radius);
  --y-border-radius-s: 0.25em;
  /* Focus */
  --y-focus-border-dark: dashed 2px black;
  --y-focus-border-light: dashed 2px #ffffff;
  --y-focus-offset: 0.2em;
  /* Tooltip */
  --y-tooltip-bg: #000000;
  --y-tooltip-color: #ffffff;
  --y-tooltip-size: 0.85rem;
  --y-tooltip-borderradius: 0.2em;
  /* Grids */
}



/* Page-Color */
.y-dark {
  background: var(--y-dark-page-bg)
}
/* Text-Color */
.y-text-light * {
  color: var(--y-dark-page-text)
}
.y-text-light a {
  color: var(--y-dark-page-link)
}
.y-text-light a:hover {
  color: var(--y-dark-page-link-hover)
}


/* Focus */
.y-focus:focus-visible,
.w-grid.y-focus a:focus-visible {
  outline: var(--y-focus-border-dark);
}
.y-dark .y-focus:focus-visible,
.y-dark .w-grid.y-focus a:focus-visible {
  outline: var(--y-focus-border-light);
}

.y-focus-inside:focus-visible,
.w-grid.y-focus-inside a:focus-visible {
  outline-offset: calc(var(--y-focus-offset) * -1)
}
.y-focus-outside:focus-visible,
.w-grid.y-focus-outside a:focus-visible {
  outline-offset: var(--y-focus-offset)
}
/* Pille */
.y-pill {
  padding: 0.2em 0.85em!important;
  border-radius: 99999rem;
  white-space: nowrap;
  font-size: 0.8rem;
}
.y-pill-solid {
  background: var(--y-light-page-primary);
  color: var(--y-dark-page-text);
}
/* Tooltip */
.y-has-tooltip {
  position: relative;
}
.y-has-tooltip .y-tooltip {
  background: var(--y-tooltip-bg);
  color: #ffffff;
  display: inline;
  padding:  0.5rem;
  position: absolute;
  z-index: 11;
  pointer-events: none;
  opacity: 0;
  font-size: var(--y-tooltip-size);
  line-height: 1.4;
  transition: all var(--y-global-transition-speed);
  transition-delay: var(--y-global-transition-speed);
  transition-timing-function: ease-out;
  width: 100vw;
  max-width: 200px;
  border-radius: 0.5em;
}
.y-has-tooltip:focus-visible .y-tooltip,
.y-has-tooltip:hover .y-tooltip {
  opacity: 1;
}
.y-has-tooltip .y-tooltip:after {
  content: "";
  background: var(--y-tooltip-bg);
  width: 10px;
  height: 10px;
  position: absolute;
  z-index: 10;
}
/* Tooltip Bottom */
.y-has-tooltip.y-tooltip-bottom .y-tooltip {
  transform: translateX(calc(-50% + 12.5px));
  top: calc(100% + 15px);
}
.y-has-tooltip.y-tooltip-bottom .y-tooltip:after {
  left: 50%;
  top: -5px;
  transform: translate(-50%, 0) rotate(45deg)
}
/* Tooltip Right */
.y-has-tooltip.y-tooltip-right .y-tooltip {
  left: calc(100% + 10px);
  top: 0;
  text-align: left;
}
.y-has-tooltip.y-tooltip-right .y-tooltip:after {
  left: 0;
  top: calc(var(--y-tooltip-borderradius) * 3);
  transform: translate(-50%, 0) rotate(45deg)
}




.y-card-title {
  font-size: 1.2rem;
  margin-top: 0;
  font-size: 1.2rem;

}
.y-sr-only {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
/* Resets */
.y-ul-reset,
.y-ul-reset ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
/* Helper */
.y-border-solid {
  border: solid var(--y-light-page-border-color) var(--y-border-size)
}
.y-dark .y-border-solid {
  border: solid var(--y-dark-page-border-color) var(--y-border-size)
}
.y-dark .y-text-faded {
  color: var(--y-dark-page-faded)
}
.y-text-faded {
  color: var(--y-light-page-faded)
}
.y-border-radius-m {
  border-radius: var(--y-border-radius-m);
  overflow: hidden;
}
.y-aspect-ratio-1-1 {
  aspect-ratio: 1 / 1;
}
.y-box-padding-top {
  padding-top: var(--y-box-padding);
}
.y-box-padding-bottom {
  padding-top: var(--y-box-padding);
}
.y-block-margin-top {
  margin-top: var(--y-block-margin);
}
.y-block-margin-bottom,
.yuhura-block-margin-bottom {
  margin-bottom: var(--y-block-margin);
}

/* List-Navi vertical */
.y-list-nav-v {
  border-top: solid var(--y-border-size) var(--color-content-border);
  max-height: calc(100svh - calc( var(--y-header-sticky-height) + 4rem ));
  overflow: auto;
}
.y-list-nav-v:not(.include-h3) li ul.on-page-autonavi-sub,
.y-list-nav-v.show-h3-on-scrollspy li ul.on-page-autonavi-sub {
  display: none;
}
.y-list-nav-v.show-h3-on-scrollspy li.y-active ul.on-page-autonavi-sub {
  display: block;
}
/* h2 Ebene */
.y-list-nav-v > li {
  border-bottom: solid var(--y-border-size) var(--color-content-border);
  border-left: calc(var(--y-border-size) * 3) solid transparent;
  margin: 0;
}
.y-list-nav-v > li > a {
  padding: calc(var(--y-box-padding) / 2) ;
  display: block;
}
.y-list-nav-v > li.y-active {
  border-left: calc(var(--y-border-size) * 3) solid var(--y-light-page-border-color);
}
.y-list-nav-v > li.y-active > a {
  font-weight: bold;
  color: var(--y-light-page-link-hover);
}

/* h3 Ebene */
.y-list-nav-v > li > ul.on-page-autonavi-sub > li {
  margin: 0;
}
.y-list-nav-v > li > ul.on-page-autonavi-sub > li > a {
  padding: calc(var(--y-box-padding) / 2) ;
  padding-left: var(--y-box-padding);
  display: block;
}
.y-list-nav-v > li.y-active > ul > li.y-active > a {
  color: var(--y-light-page-link-hover);
}







.y-status-message {
  padding: var(--yuhura-global-padding);
  border-radius: var(--yuhura-global-border-radius);
}
.y-status-message.y-status-message-info {
	background: var(--yuhura-info);
	color: #ffffff;
}
.y-status-message.y-status-message-warning {
	background: var(--yuhura-warning);
	color: #ffffff;
}
.y-status-message.y-status-message-alert {
	background: var(--yuhura-alert);
	color: #ffffff;
}


/* Slideshow */
/* Wrapper */
.y-slide-wrapper {
    position: relative;
    overflow: hidden;
    width: 100%;
}

/* Track bewegt sich horizontal */
.y-slide-track {
    display: flex;
    transition: transform 0.5s ease;
}

/* Einzelnes Slide */
.y-slide-item {
    flex: 0 0 100%;
}

.y-slide-item img {
    width: 100%;
    height: auto;
    display: block;
}

/* Navigation (optional) */
.y-slide-prev,
.y-slide-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0,0,0,0.4);
    color: #fff;
    border: none;
    padding: 8px 14px;
    cursor: pointer;
    font-size: 22px;
}

.y-slide-prev { left: 10px; }
.y-slide-next { right: 10px; }

/* ---------------------- */
/* Action Menü */
/* ---------------------- */

.y-selection-actions-wrap {
  position: relative;
  display: inline-block;
}

.y-selection-actions-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 220px;
  padding: 8px;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  z-index: 1000;
}

.y-selection-actions-menu button {
  display: block;
  width: 100%;
  padding: 10px 12px;
  text-align: left;
  background: none;
  border: 0;
  cursor: pointer;
  border-radius: 6px;
}

.y-selection-actions-menu button:hover,
.y-selection-actions-menu button:focus {
  background: #f5f5f5;
}

.y-toolbar-wrapper {
  display: flex;
}
.y-toolbar-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  width: 100%;
}
@media (max-width: 1023px) {
  .y-toolbar-row,
  .y-toolbar-wrapper.ylb-selection-bar {
    display: flex;
    flex-direction: column;
}

}
.y-toolbar-left {
  display: flex;
  gap: 0.5rem;
}
.y-toolbar-right {
  display: flex;
  gap: 0.5rem;
}