@keyframes dashed-player {
 0% {
  opacity: 1;
 }
 60% {
  opacity: 0;
 }
 100% {
  opacity: 1;
 }
}

@keyframes icon-fade {
 0% {
  opacity: 1;
 }
 60% {
  opacity: 0;
 }
 100% {
  opacity: 1;
 }
}

@keyframes icon-fade-half {
 0% {
  opacity: 1;
 }
 60% {
  opacity: 0.5;
 }
 100% {
  opacity: 1;
 }
}

.chakra-stack .MuiLinearProgress-dashed {
      /* animation: dashed-player 3s infinite linear !important;
      background-image: radial-gradient(var(--chakra-colors-color-palette-solid) 0%, var(--chakra-colors-color-palette-solid) 16%, transparent 42%);
      background-position: 0 -1px !important; */
      animation: unset !important;
      background-image: unset !important;
      background-position: unset !important;
      background-color: var(--chakra-colors-color-palette-muted) 
}
.playerContainer .chakra-stack .MuiLinearProgress-dashed {
      background-color: var(--chakra-colors-color-palette-emphasized) 
}
.chakra-stack .MuiLinearProgress-bar1 {
      background-color: var(--chakra-colors-color-palette-solid) !important;
}
.chakra-stack .MuiLinearProgress-bar2 {
      background-color: var(--chakra-colors-color-palette-500) !important;
}

/** high animation **/

/* .chakra-stack .MuiLinearProgress-indeterminate {
      background-color: var(--chakra-colors-color-palette-500) !important;
} */


/** low animation **/

@keyframes slide { to { background-position: 26px 0; } }
.chakra-stack .MuiLinearProgress-indeterminate {
      background-color: var(--chakra-colors-color-palette-500) !important;
      background: linear-gradient(45deg,
      #fff 25%,
      #71717a 25%,
      #71717a 50%,
      #fff 50%,
      #fff 75%,
      #71717a 75%);
      background: linear-gradient(45deg, 
      var(--chakra-colors-color-palette-700) 25%,
      var(--chakra-colors-color-palette-400) 25%,
      var(--chakra-colors-color-palette-400) 50%,
      var(--chakra-colors-color-palette-700) 50%,
      var(--chakra-colors-color-palette-700) 75%,
      var(--chakra-colors-color-palette-400) 75%);
      background-size: 25px 26px;
      animation: slide 3s linear infinite;
}
.chakra-stack .MuiLinearProgress-indeterminate .MuiLinearProgress-bar1,.chakra-stack .MuiLinearProgress-indeterminate .MuiLinearProgress-bar2  {
      display: none;
}
.chakra-stack .MuiLinearProgress-root {
      height: 8px;
}

.ansi-cyan-fg {
      color: var(--chakra-colors-color-palette-solid)
}

.logline code span:first-child {
      color: var(--chakra-colors-gray-500);
}

.playDataGrid {
      display: grid;
      --gap: 1rem;
      --max-columns: 3;
      gap: var(--gap);
      grid-template-columns: repeat(auto-fill,
                  minmax(min(100%, max(10rem, (100% - (var(--max-columns) - 1) * var(--gap)) / var(--max-columns))), 1fr));
}

.chakra-select__itemGroupLabel {
  padding-inline: var(--chakra-spacing-2);
  padding-block: var(--chakra-spacing-1);
  font-size: var(--chakra-font-sizes-xs);
  font-weight: var(--chakra-font-weights-semibold);
  text-transform: uppercase;
  color: var(--chakra-colors-fg-muted);
}

.chakra-select__itemGroup .chakra-select__item {
      padding-inline: var(--chakra-spacing-3)
}

.chakra-combobox__item:nth-child(odd):not([data-highlighted=""]) {
      --mix-subtle-background: color-mix(in srgb, var(--chakra-colors-bg-muted) 60%, transparent);
      background: var(--mix-subtle-background)
}