/* catppuccin mocha · red */

:root {
  --background: #1e1e2e !important;
  --paper: #181825 !important;

  --foreground: #cdd6f4 !important;
  --muted: #a6adc8 !important;
  --muted-highlight: #bac2de !important;

  --border: #45475a !important;
  --ring: #f38ba8 !important;
  --subtle: #313244 !important;
  --subtle-highlight: #45475a !important;
  --brand: #f38ba8 !important;

  /* text and surfaces */
  --color-gray-50: 205 214 244 !important;
  --color-gray-100: 186 194 222 !important;
  --color-gray-200: 166 173 200 !important;
  --color-gray-300: 147 153 178 !important;
  --color-gray-400: 127 132 156 !important;
  --color-gray-500: 108 112 134 !important;
  --color-gray-600: 88 91 112 !important;
  --color-gray-700: 69 71 90 !important;
  --color-gray-800: 49 50 68 !important;
  --color-gray-900: 30 30 46 !important;
  --color-gray-950: 24 24 37 !important;

  /* red accent shades */
  --color-brand-50: 254 240 245 !important;
  --color-brand-100: 252 221 231 !important;
  --color-brand-200: 250 201 218 !important;
  --color-brand-300: 247 170 197 !important;
  --color-brand-400: 243 139 168 !important;
  --color-brand-500: 243 139 168 !important;
  --color-brand-600: 216 113 143 !important;
  --color-brand-700: 180 86 117 !important;
  --color-brand-800: 140 64 92 !important;
  --color-brand-900: 99 44 67 !important;
  --color-brand-950: 62 30 46 !important;

  /* mocha named colors */
  --red: #f38ba8 !important;
  --orange: #fab387 !important;
  --yellow: #f9e2af !important;
  --green: #a6e3a1 !important;
  --teal: #94e2d5 !important;
  --blue: #89b4fa !important;
  --purple: #cba6f7 !important;
  --pink: #f5c2e7 !important;
}

/* logo */
[data-ui='brand-logo'] {
  content: url('https://sunnygo.world/strawhat.png');
}

/* text selection */
::selection {
  background-color: #f38ba8;
  color: #11111b;
}

/* navigation */
[data-ui='sidebar'],
[data-ui='mobile-nav'] {
  background-color: #181825;
  border-color: #313244;
}

[data-ui='sidebar'] .UI-VerticalMenu__item:hover {
  background-color: #313244;
  color: #cdd6f4;
}

[data-ui='sidebar'] .UI-VerticalMenu__item[data-current='true'],
[data-ui='mobile-nav-item'][aria-current='page'] {
  background-color: rgb(243 139 168 / 0.12);
  color: #f38ba8;
}

/* menus and panels */
.UI-Modal__content,
.UI-DropdownMenu__root,
.UI-ContextMenu__root,
.UI-Popover__root,
.UI-HoverCard__root,
.UI-Tooltip__root,
[data-ui='dialog'],
[data-ui='player-menu'],
[data-ui='settings-card'] {
  background-color: #181825;
  color: #cdd6f4;
  border-color: #45475a;
}

.UI-DropdownMenu__item[data-highlighted],
.UI-ContextMenu__item[data-highlighted],
[data-ui='player-menu-item']:hover {
  background-color: #313244;
  color: #cdd6f4;
}

/* selected choices and playback buttons */
[data-ui='pill-tab'][data-selected],
[data-ui='season-pill'][data-selected],
[data-ui='hero-action'][data-name='play'],
[data-ui='item-action'][data-name='play'],
[data-ui='next-episode-action'][data-name='play'] {
  background-color: #f38ba8;
  color: #11111b;
  border-color: #f38ba8;
}

[data-ui='hero-action'][data-name='play']:hover,
[data-ui='item-action'][data-name='play']:hover,
[data-ui='next-episode-action'][data-name='play']:hover {
  background-color: #f7aac5;
  border-color: #f7aac5;
}

/* active actions */
[data-ui='item-action'][data-active],
[data-ui='episode-action'][data-active],
[data-ui='player-menu-item'][data-selected] {
  color: #f38ba8;
}

/* secondary text */
[data-ui='poster-card-subtitle'],
[data-ui='wide-card-subtitle'],
[data-ui='person-card-role'],
[data-ui='episode-synopsis'] {
  color: #a6adc8;
}

/* badges */
[data-ui='watched-badge'],
[data-ui='unwatched-count'] {
  background-color: #f38ba8;
  color: #11111b;
}

/* versions */
[data-ui='version'] {
  background-color: #1e1e2e;
  border-color: #45475a;
}

[data-ui='version'][data-cached] {
  background-color: rgb(166 227 161 / 0.06);
  border-color: rgb(166 227 161 / 0.35);
}

[data-ui='version']:hover,
[data-ui='version'][data-playing] {
  background-color: rgb(243 139 168 / 0.09);
  border-color: #f38ba8;
}

[data-ui='version-playing'] {
  color: #f38ba8;
}

/* progress and volume */
[data-ui='progress-bar'],
[data-ui='seek-bar-track'] {
  background-color: #45475a;
}

[data-ui='progress-bar-fill'],
[data-ui='seek-bar-progress'],
[data-ui='seek-bar-thumb'],
[data-ui='volume-level'],
[data-ui='volume-thumb'] {
  background-color: #f38ba8;
}

[data-ui='seek-bar-buffered'] {
  background-color: rgb(205 214 244 / 0.25);
}

/* scrollbar colors */
html {
  scrollbar-color: #585b70 #181825;
}

::-webkit-scrollbar-track {
  background-color: #181825;
}

::-webkit-scrollbar-thumb {
  background-color: #585b70;
  border-color: #181825;
}

::-webkit-scrollbar-thumb:hover {
  background-color: #6c7086;
}