@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@500;600&family=IBM+Plex+Sans:wght@400;500&family=IBM+Plex+Mono:wght@400;500&display=swap");

gitea-theme-meta-info {
  --theme-display-name: "Servhub Code";
  --theme-color-scheme: "light dark";
}

:root {
  --servhub-font-display: "Poppins", sans-serif;
  --servhub-font-sans: "IBM Plex Sans", system-ui, sans-serif;
  --servhub-font-mono: "IBM Plex Mono", ui-monospace, monospace;

  --servhub-teal-50: #f0fdfa;
  --servhub-teal-100: #ccfbf1;
  --servhub-teal-300: #5eead4;
  --servhub-teal-400: #2dd4bf;
  --servhub-teal-500: #14b8a6;
  --servhub-teal-600: #0d9488;
  --servhub-teal-700: #0f766e;
  --servhub-teal-900: #134e4a;
  --servhub-fjord-50: #eef2f8;
  --servhub-fjord-100: #d9e1ee;
  --servhub-fjord-300: #9fb3ce;
  --servhub-fjord-400: #6e8fb8;
  --servhub-fjord-500: #547199;
  --servhub-fjord-600: #3d5a80;
  --servhub-fjord-700: #324a6a;
  --servhub-fjord-900: #1f2e43;
  --servhub-slate-0: #ffffff;
  --servhub-slate-50: #f8fafc;
  --servhub-slate-100: #f1f5f9;
  --servhub-slate-200: #e2e8f0;
  --servhub-slate-300: #cbd5e1;
  --servhub-slate-400: #94a3b8;
  --servhub-slate-500: #64748b;
  --servhub-slate-600: #475569;
  --servhub-slate-700: #334155;
  --servhub-slate-800: #1e293b;
  --servhub-slate-900: #0f172a;
  --servhub-slate-950: #020617;

  --is-dark-theme: false;
  --fonts-proportional: var(--servhub-font-sans);
  --fonts-monospace: var(--servhub-font-mono);
  --color-primary: var(--servhub-teal-500);
  --color-primary-contrast: #ffffff;
  --color-primary-dark-1: var(--servhub-teal-600);
  --color-primary-dark-2: var(--servhub-teal-700);
  --color-primary-dark-3: var(--servhub-teal-900);
  --color-primary-dark-4: #0b5f59;
  --color-primary-dark-5: #073f3b;
  --color-primary-dark-6: #052f2c;
  --color-primary-dark-7: #021b19;
  --color-primary-light-1: var(--servhub-teal-400);
  --color-primary-light-2: var(--servhub-teal-300);
  --color-primary-light-3: #8af0df;
  --color-primary-light-4: var(--servhub-teal-100);
  --color-primary-light-5: #d9fbf5;
  --color-primary-light-6: var(--servhub-teal-50);
  --color-primary-light-7: #fbfffe;
  --color-primary-alpha-10: #14b8a619;
  --color-primary-alpha-20: #14b8a633;
  --color-primary-alpha-30: #14b8a64d;
  --color-primary-alpha-40: #14b8a666;
  --color-primary-alpha-50: #14b8a680;
  --color-primary-alpha-60: #14b8a699;
  --color-primary-alpha-70: #14b8a6b3;
  --color-primary-alpha-80: #14b8a6cc;
  --color-primary-alpha-90: #14b8a6e6;
  --color-primary-hover: var(--color-primary-dark-1);
  --color-primary-active: var(--color-primary-dark-2);

  --color-secondary: var(--servhub-slate-200);
  --color-secondary-dark-1: var(--servhub-slate-300);
  --color-secondary-dark-2: var(--servhub-slate-400);
  --color-secondary-dark-3: var(--servhub-slate-500);
  --color-secondary-dark-4: var(--servhub-slate-600);
  --color-secondary-dark-5: var(--servhub-slate-700);
  --color-secondary-dark-6: var(--servhub-slate-800);
  --color-secondary-dark-7: var(--servhub-slate-900);
  --color-secondary-dark-8: var(--servhub-slate-950);
  --color-secondary-light-1: var(--servhub-slate-100);
  --color-secondary-light-2: var(--servhub-slate-50);
  --color-secondary-light-3: #fbfdff;
  --color-secondary-light-4: #ffffff;
  --color-secondary-alpha-10: #e2e8f019;
  --color-secondary-alpha-20: #e2e8f033;
  --color-secondary-alpha-30: #e2e8f04d;
  --color-secondary-alpha-40: #e2e8f066;
  --color-secondary-alpha-50: #e2e8f080;
  --color-secondary-alpha-60: #e2e8f099;
  --color-secondary-alpha-70: #e2e8f0b3;
  --color-secondary-alpha-80: #e2e8f0cc;
  --color-secondary-alpha-90: #e2e8f0e6;
  --color-secondary-button: var(--servhub-fjord-600);
  --color-secondary-hover: var(--servhub-fjord-700);
  --color-secondary-active: var(--servhub-fjord-900);

  --color-red: #dc2626;
  --color-orange: #d97706;
  --color-yellow: #f59e0b;
  --color-olive: #64748b;
  --color-green: #16a34a;
  --color-teal: var(--servhub-teal-500);
  --color-blue: #2563eb;
  --color-violet: #6d5bd0;
  --color-purple: #7c3aed;
  --color-pink: #db2777;
  --color-brown: #8b5e34;
  --color-black: var(--servhub-slate-900);
  --color-grey: var(--servhub-slate-500);
  --color-grey-light: var(--servhub-slate-400);
  --color-white: #ffffff;
  --color-git: #f05133;
  --color-logo: var(--servhub-teal-500);

  --color-body: var(--servhub-slate-50);
  --color-box-header: var(--servhub-slate-100);
  --color-box-body: #ffffff;
  --color-box-body-highlight: var(--servhub-teal-50);
  --color-text-dark: var(--servhub-slate-950);
  --color-text: var(--servhub-slate-900);
  --color-text-light: var(--servhub-slate-700);
  --color-text-light-1: var(--servhub-slate-600);
  --color-text-light-2: var(--servhub-slate-500);
  --color-text-light-3: var(--servhub-slate-400);
  --color-footer: var(--color-nav-bg);
  --color-timeline: var(--servhub-slate-200);
  --color-input-text: var(--servhub-slate-950);
  --color-input-background: #ffffff;
  --color-input-toggle-background: var(--servhub-slate-200);
  --color-input-border: var(--servhub-slate-300);
  --color-light: #0f172a08;
  --color-light-border: #0f172a1f;
  --color-hover: #0f172a0a;
  --color-hover-opaque: var(--servhub-slate-100);
  --color-active: #0f172a14;
  --color-menu: #ffffff;
  --color-card: #ffffff;
  --color-markup-table-row: #0f766e0a;
  --color-markup-code-block: #0f172a10;
  --color-markup-code-inline: #0f172a12;
  --color-button: #ffffff;
  --color-code-bg: #fbfdff;
  --color-shadow: #0f172a20;
  --color-shadow-opaque: var(--servhub-slate-300);
  --color-secondary-bg: var(--servhub-slate-100);
  --color-expand-button: var(--servhub-teal-100);
  --color-placeholder-text: var(--servhub-slate-400);
  --color-editor-line-highlight: var(--color-secondary-alpha-30);
  --color-editor-selection: var(--color-primary-alpha-30);
  --color-project-column-bg: var(--servhub-slate-100);
  --color-caret: var(--servhub-slate-950);
  --color-reaction-bg: #0f172a0a;
  --color-reaction-hover-bg: var(--servhub-teal-100);
  --color-reaction-active-bg: var(--servhub-teal-50);
  --color-tooltip-text: #ffffff;
  --color-tooltip-bg: #020617f0;
  --color-nav-bg: #ffffff;
  --color-nav-hover-bg: var(--servhub-slate-100);
  --color-nav-text: var(--servhub-slate-900);
  --color-secondary-nav-bg: var(--servhub-slate-50);
  --color-label-text: var(--servhub-slate-900);
  --color-label-bg: #94a3b84d;
  --color-label-hover-bg: #94a3b899;
  --color-label-active-bg: #94a3b8ff;
  --color-accent: var(--servhub-teal-500);
  --color-small-accent: var(--servhub-teal-100);
  --color-highlight-fg: #7c5f00;
  --color-highlight-bg: #fef3c7;
  --color-overlay-backdrop: #02061799;
  --color-danger: var(--color-red);
  --color-transparency-grid-light: #fafafa;
  --color-transparency-grid-dark: #e2e8f0;

  --color-error-border: #fca5a5;
  --color-error-bg: #fee2e2;
  --color-error-bg-active: #fecaca;
  --color-error-bg-hover: #fee2e2;
  --color-error-text: #b91c1c;
  --color-success-border: #86efac;
  --color-success-bg: #dcfce7;
  --color-success-text: #15803d;
  --color-warning-border: #fcd34d;
  --color-warning-bg: #fef3c7;
  --color-warning-text: #b45309;
  --color-info-border: #93c5fd;
  --color-info-bg: #dbeafe;
  --color-info-text: #1d4ed8;

  --color-diff-added-fg: #15803d;
  --color-diff-added-linenum-bg: #dcfce7;
  --color-diff-added-row-bg: #f0fdf4;
  --color-diff-added-row-border: #bbf7d0;
  --color-diff-added-word-bg: #bbf7d0;
  --color-diff-moved-row-bg: #fef3c7;
  --color-diff-moved-row-border: #fcd34d;
  --color-diff-removed-fg: #b91c1c;
  --color-diff-removed-linenum-bg: #fee2e2;
  --color-diff-removed-row-bg: #fef2f2;
  --color-diff-removed-row-border: #fecaca;
  --color-diff-removed-word-bg: #fecaca;
  --color-diff-inactive: var(--servhub-slate-100);

  --color-console-fg: var(--servhub-slate-100);
  --color-console-fg-subtle: var(--servhub-slate-400);
  --color-console-bg: var(--servhub-slate-950);
  --color-console-border: var(--servhub-slate-800);
  --color-console-hover-bg: var(--servhub-slate-900);
  --color-console-active-bg: var(--servhub-slate-800);
  --color-console-menu-bg: var(--servhub-slate-900);
  --color-console-menu-border: var(--servhub-slate-700);
  --color-console-link: var(--servhub-teal-300);

  --color-syntax-keyword: #0f766e;
  --color-syntax-bool: #1d4ed8;
  --color-syntax-control: #b45309;
  --color-syntax-name: #7c5f00;
  --color-syntax-type: #3d5a80;
  --color-syntax-number: #2563eb;
  --color-syntax-operator: #0f766e;
  --color-syntax-regexp: #7c3aed;
  --color-syntax-string: #15803d;
  --color-syntax-comment: #64748b;
  --color-syntax-invalid: #b91c1c;
  --color-syntax-link: var(--color-primary);
  --color-syntax-tag: #0f766e;
  --color-syntax-attribute: #3d5a80;
  --color-syntax-property: #2563eb;
  --color-syntax-variable: #b45309;
  --color-syntax-string-special: #b45309;
  --color-syntax-escape: #7c5f00;
  --color-syntax-entity: #7c3aed;
  --color-syntax-preproc: #15803d;
  --color-syntax-preproc-file: #2563eb;
  --color-syntax-decorator: #15803d;
  --color-syntax-namespace: #475569;
  --color-syntax-name-pseudo: #7c3aed;
  --color-syntax-comment-special: #7c3aed;
  --color-syntax-text: inherit;
  --color-syntax-text-alt: #475569;
  --color-syntax-punctuation: inherit;
  --color-syntax-whitespace: #cbd5e1;
  --color-syntax-diff-fg: #020617;
  --color-syntax-deleted-bg: #fee2e2;
  --color-syntax-inserted-bg: #dcfce7;
  --color-syntax-emph: #b45309;
  --color-syntax-strong: inherit;
  --color-syntax-heading: #b45309;
  --color-syntax-subheading: #15803d;
  --color-syntax-output: #64748b;
  --color-syntax-prompt: #b45309;
  --color-syntax-traceback: #b91c1c;
  --color-syntax-matching-bracket-bg: #14b8a638;
  --color-syntax-nonmatching-bracket-bg: #dc262638;

  accent-color: var(--color-accent);
  color-scheme: light;
}

.ui.primary.button,
.ui.primary.buttons .button {
  background: var(--color-primary);
  color: var(--color-primary-contrast);
  font-weight: 500;
}

.ui.primary.button:hover,
.ui.primary.buttons .button:hover {
  background: var(--color-primary-hover);
}

.ui.button,
.ui.buttons .button {
  border-radius: 6px;
  font-weight: 500;
}

.ui.secondary.button,
.ui.secondary.buttons .button {
  background: var(--servhub-fjord-600);
  color: #ffffff;
}

.ui.secondary.button:hover,
.ui.secondary.buttons .button:hover {
  background: var(--servhub-fjord-700);
}

.ui.menu,
.ui.segment,
.ui.attached.header,
.repository.file.list #repo-files-table,
.repository .diff-file-box,
.repository .file-view,
.ui.table {
  border-color: var(--color-light-border);
}

.ui.header,
.repo-title,
.repository .repo-header .repo-title,
h1,
h2,
h3 {
  font-family: var(--servhub-font-display);
  font-weight: 600;
  letter-spacing: 0;
}

body {
  font-family: var(--servhub-font-sans);
  letter-spacing: 0;
}

code,
kbd,
pre,
.mono,
.lines-num,
.code-view,
.blame .code-inner {
  font-family: var(--servhub-font-mono);
}

a,
.ui.breadcrumb a,
.ui.link.list .item a {
  color: var(--color-primary);
}

a:hover,
.ui.breadcrumb a:hover,
.ui.link.list .item a:hover {
  color: var(--color-primary-hover);
}

.following.bar.light {
  box-shadow: 0 1px 0 var(--color-light-border);
}

.ui.menu .active.item,
.ui.vertical.menu .active.item {
  color: var(--color-primary);
  box-shadow: inset 0 -2px 0 var(--color-primary);
}

.ui.repository.list .item:not(:first-child) {
  border-top-color: var(--color-light-border);
}

.ui.label,
.ui.labels .label {
  border-radius: 6px;
  font-weight: 500;
}

.ui.form input:not([type]),
.ui.form input[type="date"],
.ui.form input[type="datetime-local"],
.ui.form input[type="email"],
.ui.form input[type="number"],
.ui.form input[type="password"],
.ui.form input[type="search"],
.ui.form input[type="tel"],
.ui.form input[type="text"],
.ui.form input[type="time"],
.ui.form input[type="url"],
.ui.form textarea,
.ui.input input,
.ui.selection.dropdown {
  border-radius: 6px;
}

.ui.form input:focus,
.ui.form textarea:focus,
.ui.input input:focus,
.ui.selection.active.dropdown,
.ui.selection.active.dropdown:hover {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px var(--color-primary-alpha-20);
}

img[src$="/assets/img/logo.svg"],
img[src*="/assets/img/logo.svg"] {
  max-height: 34px;
  width: auto;
}

.servhub-home {
  padding: 0;
}

.servhub-home-hero {
  background:
    linear-gradient(120deg, var(--color-body) 0%, var(--color-body) 48%, var(--color-secondary-bg) 48%, var(--color-secondary-bg) 100%);
  border-bottom: 1px solid var(--color-light-border);
}

.servhub-home-hero-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 420px);
  gap: 48px;
  align-items: center;
  width: min(1120px, calc(100% - 48px));
  min-height: clamp(500px, 68vh, 720px);
  margin: 0 auto;
  padding: 64px 0;
}

.servhub-home-copy {
  max-width: 680px;
}

.servhub-home-logo {
  display: block;
  width: min(322px, 78vw);
  height: auto;
  max-height: none !important;
  margin-bottom: 36px;
}

.servhub-home h1 {
  max-width: 760px;
  margin: 0;
  color: var(--color-text-dark);
  font-size: clamp(2.5rem, 5vw, 5.25rem);
  line-height: .95;
  text-wrap: balance;
}

.servhub-home-copy p {
  max-width: 640px;
  margin: 24px 0 0;
  color: var(--color-text-light);
  font-size: 1.25rem;
  line-height: 1.55;
  text-wrap: balance;
}

.servhub-home-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 32px;
}

.servhub-home-actions .ui.button {
  margin: 0;
}

.servhub-home-panel {
  border: 1px solid var(--color-light-border);
  border-radius: 8px;
  background: var(--color-card);
  box-shadow: 0 24px 70px var(--color-shadow);
  overflow: hidden;
}

.servhub-home-panel-header {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  padding: 20px 22px;
  border-bottom: 1px solid var(--color-light-border);
}

.servhub-home-kicker,
.servhub-home-panel-grid span {
  color: var(--color-text-light-2);
  font-size: .78rem;
  font-weight: 500;
}

.servhub-home-panel-header strong {
  color: var(--color-primary);
  font-family: var(--servhub-font-display);
  font-size: 1.45rem;
  font-weight: 600;
}

.servhub-home-panel-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.servhub-home-panel-grid div {
  min-height: 132px;
  padding: 22px;
  border-right: 1px solid var(--color-light-border);
  border-bottom: 1px solid var(--color-light-border);
}

.servhub-home-panel-grid div:nth-child(2n) {
  border-right: 0;
}

.servhub-home-panel-grid div:nth-last-child(-n + 2) {
  border-bottom: 0;
}

.servhub-home-panel-grid strong {
  display: block;
  margin-top: 12px;
  color: var(--color-text);
  font-family: var(--servhub-font-display);
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.2;
}

.servhub-home-band {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  width: min(1120px, calc(100% - 48px));
  margin: 0 auto;
  padding: 48px 0 72px;
}

.servhub-home-feature {
  padding: 28px;
  background: var(--color-card);
  border: 1px solid var(--color-light-border);
}

.servhub-home-feature h2 {
  margin: 0;
  color: var(--color-text-dark);
  font-size: 1.15rem;
}

.servhub-home-feature p {
  margin: 12px 0 0;
  color: var(--color-text-light);
  line-height: 1.55;
}

@media (max-width: 860px) {
  .servhub-home-hero {
    background: var(--color-body);
  }

  .servhub-home-hero-inner,
  .servhub-home-band {
    width: min(100% - 32px, 640px);
  }

  .servhub-home-hero-inner,
  .servhub-home-band {
    grid-template-columns: 1fr;
  }

  .servhub-home-hero-inner {
    gap: 32px;
    min-height: auto;
    padding: 40px 0;
  }

  .servhub-home h1 {
    font-size: clamp(2.35rem, 12vw, 4rem);
  }
}

@media (prefers-color-scheme: dark) {
  :root {
    --is-dark-theme: true;
    --color-primary: var(--servhub-teal-400);
    --color-primary-contrast: #042f2e;
    --color-primary-dark-1: var(--servhub-teal-300);
    --color-primary-dark-2: var(--servhub-teal-100);
    --color-primary-dark-3: var(--servhub-teal-50);
    --color-primary-dark-4: #fbfffe;
    --color-primary-dark-5: #ffffff;
    --color-primary-dark-6: #ffffff;
    --color-primary-dark-7: #ffffff;
    --color-primary-light-1: var(--servhub-teal-500);
    --color-primary-light-2: var(--servhub-teal-600);
    --color-primary-light-3: var(--servhub-teal-700);
    --color-primary-light-4: var(--servhub-teal-900);
    --color-primary-light-5: #0a3f3b;
    --color-primary-light-6: #062f2c;
    --color-primary-light-7: #021b19;
    --color-primary-alpha-10: #2dd4bf19;
    --color-primary-alpha-20: #2dd4bf33;
    --color-primary-alpha-30: #2dd4bf4d;
    --color-primary-alpha-40: #2dd4bf66;
    --color-primary-alpha-50: #2dd4bf80;
    --color-primary-alpha-60: #2dd4bf99;
    --color-primary-alpha-70: #2dd4bfb3;
    --color-primary-alpha-80: #2dd4bfcc;
    --color-primary-alpha-90: #2dd4bfe6;

    --color-secondary: var(--servhub-slate-800);
    --color-secondary-dark-1: var(--servhub-slate-700);
    --color-secondary-dark-2: var(--servhub-slate-600);
    --color-secondary-dark-3: var(--servhub-slate-500);
    --color-secondary-dark-4: var(--servhub-slate-400);
    --color-secondary-dark-5: var(--servhub-slate-300);
    --color-secondary-dark-6: var(--servhub-slate-200);
    --color-secondary-dark-7: var(--servhub-slate-100);
    --color-secondary-dark-8: var(--servhub-slate-50);
    --color-secondary-light-1: var(--servhub-slate-900);
    --color-secondary-light-2: #111827;
    --color-secondary-light-3: #0b1220;
    --color-secondary-light-4: var(--servhub-slate-950);
    --color-secondary-alpha-10: #1e293b19;
    --color-secondary-alpha-20: #1e293b33;
    --color-secondary-alpha-30: #1e293b4d;
    --color-secondary-alpha-40: #1e293b66;
    --color-secondary-alpha-50: #1e293b80;
    --color-secondary-alpha-60: #1e293b99;
    --color-secondary-alpha-70: #1e293bb3;
    --color-secondary-alpha-80: #1e293bcc;
    --color-secondary-alpha-90: #1e293be6;
    --color-secondary-button: var(--servhub-fjord-400);
    --color-secondary-hover: var(--servhub-fjord-300);
    --color-secondary-active: var(--servhub-fjord-100);

    --color-red: #ef4444;
    --color-orange: #f59e0b;
    --color-yellow: #fbbf24;
    --color-olive: #94a3b8;
    --color-green: #22c55e;
    --color-teal: var(--servhub-teal-400);
    --color-blue: #3b82f6;
    --color-black: var(--servhub-slate-950);
    --color-grey: var(--servhub-slate-500);
    --color-grey-light: var(--servhub-slate-400);

    --color-body: var(--servhub-slate-950);
    --color-box-header: var(--servhub-slate-900);
    --color-box-body: #0b1220;
    --color-box-body-highlight: #0d2d2b;
    --color-text-dark: var(--servhub-slate-50);
    --color-text: var(--servhub-slate-100);
    --color-text-light: var(--servhub-slate-300);
    --color-text-light-1: var(--servhub-slate-400);
    --color-text-light-2: var(--servhub-slate-500);
    --color-text-light-3: var(--servhub-slate-600);
    --color-timeline: var(--servhub-slate-700);
    --color-input-text: var(--servhub-slate-50);
    --color-input-background: #0b1220;
    --color-input-toggle-background: var(--servhub-slate-800);
    --color-input-border: var(--servhub-slate-700);
    --color-light: #f8fafc12;
    --color-light-border: #f8fafc20;
    --color-hover: #f8fafc14;
    --color-hover-opaque: var(--servhub-slate-900);
    --color-active: #f8fafc1f;
    --color-menu: #0b1220;
    --color-card: #0b1220;
    --color-markup-table-row: #2dd4bf0f;
    --color-markup-code-block: #f8fafc12;
    --color-markup-code-inline: #f8fafc18;
    --color-button: var(--servhub-slate-900);
    --color-code-bg: #08111f;
    --color-shadow: #02061780;
    --color-shadow-opaque: #020617;
    --color-secondary-bg: var(--servhub-slate-800);
    --color-expand-button: var(--servhub-slate-800);
    --color-placeholder-text: var(--servhub-slate-500);
    --color-project-column-bg: #0b1220;
    --color-caret: var(--servhub-slate-50);
    --color-reaction-bg: #f8fafc14;
    --color-reaction-hover-bg: var(--servhub-teal-900);
    --color-reaction-active-bg: #0a3f3b;
    --color-tooltip-text: #ffffff;
    --color-tooltip-bg: #020617f0;
    --color-nav-bg: #0b1220;
    --color-nav-hover-bg: var(--servhub-slate-900);
    --color-nav-text: var(--servhub-slate-100);
    --color-secondary-nav-bg: var(--servhub-slate-900);
    --color-label-text: var(--servhub-slate-100);
    --color-label-bg: #64748b4d;
    --color-label-hover-bg: #64748b99;
    --color-label-active-bg: #64748bff;
    --color-small-accent: #0a3f3b;
    --color-highlight-fg: #fbbf24;
    --color-highlight-bg: #3d2f0b;
    --color-overlay-backdrop: #020617c0;
    --color-transparency-grid-light: #1e293b;
    --color-transparency-grid-dark: #020617;

    --color-error-border: rgba(239, 68, 68, 0.4);
    --color-error-bg: rgba(239, 68, 68, 0.16);
    --color-error-bg-active: rgba(239, 68, 68, 0.22);
    --color-error-bg-hover: rgba(239, 68, 68, 0.2);
    --color-error-text: #f87171;
    --color-success-border: rgba(34, 197, 94, 0.4);
    --color-success-bg: rgba(34, 197, 94, 0.16);
    --color-success-text: #4ade80;
    --color-warning-border: rgba(245, 158, 11, 0.4);
    --color-warning-bg: rgba(245, 158, 11, 0.16);
    --color-warning-text: #fbbf24;
    --color-info-border: rgba(59, 130, 246, 0.4);
    --color-info-bg: rgba(59, 130, 246, 0.16);
    --color-info-text: #60a5fa;

    --color-diff-added-fg: #4ade80;
    --color-diff-added-linenum-bg: #14351f;
    --color-diff-added-row-bg: #10291b;
    --color-diff-added-row-border: #1f5130;
    --color-diff-added-word-bg: #1f5130;
    --color-diff-moved-row-bg: #3d2f0b;
    --color-diff-moved-row-border: #6b500c;
    --color-diff-removed-fg: #f87171;
    --color-diff-removed-linenum-bg: #3f1717;
    --color-diff-removed-row-bg: #2c1515;
    --color-diff-removed-row-border: #5a2020;
    --color-diff-removed-word-bg: #5a2020;
    --color-diff-inactive: var(--servhub-slate-900);

    --color-console-fg: var(--servhub-slate-100);
    --color-console-fg-subtle: var(--servhub-slate-400);
    --color-console-bg: #020617;
    --color-console-border: var(--servhub-slate-800);
    --color-console-hover-bg: var(--servhub-slate-900);
    --color-console-active-bg: var(--servhub-slate-800);
    --color-console-menu-bg: var(--servhub-slate-900);
    --color-console-menu-border: var(--servhub-slate-700);
    --color-console-link: var(--servhub-teal-300);

    --color-syntax-keyword: #5eead4;
    --color-syntax-bool: #60a5fa;
    --color-syntax-control: #fbbf24;
    --color-syntax-name: #fbbf24;
    --color-syntax-type: #9fb3ce;
    --color-syntax-number: #60a5fa;
    --color-syntax-operator: #5eead4;
    --color-syntax-regexp: #c4b5fd;
    --color-syntax-string: #4ade80;
    --color-syntax-comment: #94a3b8;
    --color-syntax-invalid: #f87171;
    --color-syntax-tag: #5eead4;
    --color-syntax-attribute: #9fb3ce;
    --color-syntax-property: #93c5fd;
    --color-syntax-variable: #fbbf24;
    --color-syntax-string-special: #fbbf24;
    --color-syntax-escape: #fbbf24;
    --color-syntax-entity: #c4b5fd;
    --color-syntax-preproc: #4ade80;
    --color-syntax-preproc-file: #93c5fd;
    --color-syntax-decorator: #4ade80;
    --color-syntax-namespace: #cbd5e1;
    --color-syntax-name-pseudo: #c4b5fd;
    --color-syntax-comment-special: #c4b5fd;
    --color-syntax-text: #e2e8f0;
    --color-syntax-text-alt: #cbd5e1;
    --color-syntax-punctuation: #e2e8f0;
    --color-syntax-whitespace: #64748b;
    --color-syntax-diff-fg: #ffffff;
    --color-syntax-deleted-bg: #5a2020;
    --color-syntax-inserted-bg: #1f5130;
    --color-syntax-emph: #fbbf24;
    --color-syntax-strong: #fbbf24;
    --color-syntax-heading: #fbbf24;
    --color-syntax-subheading: #4ade80;
    --color-syntax-output: #94a3b8;
    --color-syntax-prompt: #fbbf24;
    --color-syntax-traceback: #f87171;
    --color-syntax-matching-bracket-bg: #2dd4bf48;
    --color-syntax-nonmatching-bracket-bg: #ef444448;

    color-scheme: dark;
  }

  img[src$="/assets/img/logo.svg"],
  img[src*="/assets/img/logo.svg"] {
    content: url("/assets/servhub-code/logo-dark.svg");
  }

  .servhub-home-hero {
    background:
      linear-gradient(120deg, var(--color-body) 0%, var(--color-body) 48%, #08111f 48%, #08111f 100%);
  }
}