/**
* @name TokyoPichu
* @author Nyria#3863 / EndLordHD
* @description The layout of LilyPichu with the colors of Tokyo Dark (made for Stealthykiller)
* @invite rtBQX5D3bD
* @version 1.4
* @donate https://ko-fi.com/nyria
*/
@import url("https://endcod3r.github.io/TokyoPichu/main.css");

/* Remove decorations */
@import url("https://endcod3r.github.io/TokyoPichu/stuff/overlay.css");

:root {
  /* --- User variables --- */

  /* Jumping GIF */
  --jumping-gif: url("https://i.imgur.com/dCd49s0.gif");

  /* Background (if you want an image replace it by : 

--background-tertiary-alt: url("image-link"); without that => */
  --background-tertiary-alt: var(--background-secondary-alt);

  /* Border-radius for the whole theme */
  --border-radius: 20px;
}

.theme-dark {
  /* Text */
  --text-normal: #b1bae6;
  --header-primary: #565f89;
  --interactive-normal: #5f647e;
  --channels-default: #949ba4;

  --text-muted: #565f89;
  --interactive-muted: #55576b;

  --header-secondary: #171722;
  --interactive-hover: #a2a6c2;
  --interactive-active: #b5bad1;

  /* Background color */
  --background-primary: #1a1b26;
  --background-secondary: #171722;
  --background-secondary-alt: #13131a;
  --background-tertiary: #16161e;
  --background-floating: #161620;
  --background-accent: #434461;
  --channeltextarea-background: var(--background-secondary);
  --modal-background: var(--background-primary);
  --background-modifier-hover: #212331c0;
  --background-modifier-active: #282a3680;
  --background-modifier-selected: #24263171;
  --toast-background: #5e3640 !important;
  --toast-header: #3b1d24 !important;
  --toast-contents: #49292f !important;
  --toast-border: #49292f !important;
  --input-background: var(--background-secondary);

  /* Scrollbar */
  --scrollbar-auto-thumb: #2b2b46af;
  --scrollbar-auto-track: #27273d85;
  --scrollbar-thin-thumb: var(--background-tertiary);
  --scrollbar-thin-track: transparent;

  /* Other */
  --channel-text-area-placeholder: var(--interactive-normal);
  --deprecated-quickswitcher-input-background: var(--background-primary);
}
.colorBrand-3cPPsm {
  color: #c5536c;
}
.colorDefault-CDqZdO.focused-3qFvc8,
.colorDefault-CDqZdO:active:not(.hideInteraction-2jPGL_) {
  background-color: var(--background-modifier-hover) !important;
}

/* Buttons */
.lookFilled-1H2Jvj {
  background-color: #c5536c !important;
}
.lookFilled-1H2Jvj:active,
.lookFilled-1H2Jvj:hover {
  background-color: #b64a61 !important;
}
.lookOutlined-3yKVGo:not(.colorWhite-1H92hK) {
  color: #c5536c;
  border-color: #c5536c;
}

/* Hover background */
.colorDefault-CDqZdO.focused-3qFvc8,
.colorDefault-CDqZdO:active:not(.hideInteraction-2jPGL_) {
  color: var(--interactive-normal);
}

.theme-light {
  /* Text */
  --text-normal: #a86373;
  --header-primary: #a86373;
  --interactive-normal: #a86373;
  --channels-default: #a86373;

  --text-muted: #a86373;
  --interactive-muted: #cf92a0;

  --header-secondary: #cf92a0;
  --interactive-hover: #be7d8c;
  --interactive-active: #b36f7f;

  /* Background color */
  --background-primary: #ffffff;
  --background-secondary: #ffeeee;
  --background-secondary-alt: #fdc7c7;
  --background-tertiary: #ffbbbb;
  --background-floating: #ffbbbb;
  --background-accent: #c5536c;
  --channeltextarea-background: var(--background-secondary);
  --background-modifier-hover: rgba(56, 31, 31, 0.062);
  --background-modifier-active: rgba(19, 12, 12, 0.123);
  --background-modifier-selected: rgba(31, 21, 21, 0.11);

  /* Scrollbar */
  --scrollbar-auto-thumb: var(--background-tertiary);
  --scrollbar-auto-track: var(--background-secondary-alt);
  --scrollbar-thin-thumb: var(--background-tertiary);
  --scrollbar-thin-track: transparent;

  /* Other */
  --deprecated-quickswitcher-input-background: var(--background-primary);
}

.colorDefault-CDqZdO.focused-3qFvc8,
.colorDefault-CDqZdO:active:not(.hideInteraction-2jPGL_) {
  background-color: var(--background-modifier-hover) !important;
}

/* Buttons */
.lookFilled-1H2Jvj {
  background-color: #c5536c !important;
}
.lookFilled-1H2Jvj:active,
.lookFilled-1H2Jvj:hover {
  background-color: #b64a61 !important;
}
.lookOutlined-3yKVGo:not(.colorWhite-1H92hK) {
  color: #c5536c;
  border-color: #c5536c;
}

/* Hover background */
.colorDefault-CDqZdO.focused-3qFvc8,
.colorDefault-CDqZdO:active:not(.hideInteraction-2jPGL_) {
  color: var(--interactive-normal);
}
