@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Fira+Code&display=swap');

/* Catppuccin theme for Homer */

#app.theme-default.dark {
  --catppuccin-base: #1e1e2e;
  --catppuccin-surface0: #313244;
  --catppuccin-surface1: #45475a;
  --catppuccin-surface2: #585b70;
  --catppuccin-text: #cdd6f4;
  --catppuccin-teal: #94e2d5;
  --catppuccin-green: #a6e3a1;
  --catppuccin-peach: #fab387;
  --catppuccin-pink: #f5c2e7;
  --catppuccin-mauve: #cba6f7;
  --catppuccin-red: #f38ba8;
  --catppuccin-yellow: #f9e2af;
  --catppuccin-text-dark: var(--catppuccin-surface2);

  --highlight-primary: transparent;
  --highlight-secondary: var(--catppuccin-surface0);
  --highlight-hover: var(--catppuccin-surface0);
  --background: var(--catppuccin-base);
  --highlight-hover: var(--catppuccin-surface0);
  --card-background: var(--catppuccin-surface0);
  --text: var(--catppuccin-text);
  --text-header: var(--catppuccin-text);
  --text-title: var(--catppuccin-text);
  --text-subtitle: var(--catppuccin-teal);
  --link: var(--catppuccin-green);
  --link-hover: var(--catppuccin-green);
}

#app.theme-default.dark a {
  color: var(--catppuccin-green);
}

#app.theme-default.dark .card {
  background-color: var(--catppuccin-surface0);
  border: 0;
}

#app.theme-default.dark .card:hover {
  background-color: var(--catppuccin-surface1);
}

#app.theme-default.dark .card .title,
#app.theme-default.dark .card h3 {
  color: var(--catppuccin-text);
}

#app.theme-default.dark .card .subtitle {
  color: var(--catppuccin-teal);
}

#app.theme-default.dark .card .tag {
  background-color: var(--catppuccin-surface2);
  color: var(--catppuccin-text);
}

#app.theme-default.dark .card .icon {
  color: var(--catppuccin-pink);
}

#app.theme-default.dark .message {
  background-color: var(--catppuccin-surface0);
  border-color: var(--catppuccin-surface1);
}

#app.theme-default.dark .message .message-header {
  background-color: var(--catppuccin-surface1);
  color: var(--catppuccin-text);
}

#app.theme-default.dark .message .message-body {
  color: var(--catppuccin-text);
}

#app.theme-default.dark .navbar {
  background-color: var(--catppuccin-base);
}

#app.theme-default.dark .navbar .navbar-item {
  color: var(--catppuccin-text);
}

#app.theme-default.dark .navbar .navbar-item:hover {
  background-color: var(--catppuccin-surface0);
  color: var(--catppuccin-text);
}

#app.theme-default.dark .footer {
  background-color: var(--catppuccin-surface0);
  color: var(--catppuccin-text);
}

#app.theme-default.dark .search-label {
  color: var(--catppuccin-text);
}

#app.theme-default.dark .search-bar {
  background-color: var(--catppuccin-surface1);
  border-color: var(--catppuccin-surface2);
  color: var(--catppuccin-text);
}

#app.theme-default.dark .search-bar:focus {
  border-color: var(--catppuccin-mauve);
}

#app.theme-default.dark .search-bar::placeholder {
  color: var(--catppuccin-text-dark);
}

#app.theme-default.dark .status.online {
  background-color: var(--catppuccin-green);
  color: var(--catppuccin-base);
}

#app.theme-default.dark .status.offline {
  background-color: var(--catppuccin-red);
  color: var(--catppuccin-base);
}

#app.theme-default.dark .status.bad {
  background-color: var(--catppuccin-peach);
  color: var(--catppuccin-base);
}