@import url(/css/style.css);

:root {
  --editor-foreground: hsl(0deg 0% 0%);
  --editor-background: hsl(200, 21%, 95%);
  --comment-fg: #5D6C79;
  --string-fg: #C41A16;
  --char-fg: #1C00CF;
  --num-fg: #1C00CF;
  --keyword-fg: #9B2393;
  --link-fg: #0E0EFF;
  --type-dec-fg: #0B4F79;
  --other-dec-fg: #0F68A0;
  --pr-class-fg: #1C464A;
  --pr-func-fg: #326D74;
  --pr-const-fg: #326D74;
  --pr-properties-global-fg: #326D74;
  --pr-type-fg: #1C464A;
  --other-class-fg: #3900A0;
  --other-func-fg: #6C36A9;
  --other-const-fg: #6C36A9;
  --other-properties-global-fg: #3900A0;
  --other-type-fg: #3900A0;
  --plain-text-fg: rgba(0, 0, 0, 0.85);
}

/* Normalize Jekyll / Rouge code blocks */
.highlight {
  position: relative;
  margin-top: 0;
  margin-bottom: 1.5rem;
}

.highlight::before {
  content: attr(data-lang);
  position: absolute;
  top: 10px;
  left: 20px;

  font-family: 'SST';
  font-size: 0.75rem;
  font-weight: 500;
  text-transform: lowercase;

  color: var(--plain-text-fg);
  opacity: 0.5;
}

.highlight pre {
  margin: 0;
  padding: 2.5rem 1.5rem 1.25rem 1.5rem;
  overflow-x: auto;

  font-family: 'MD IO';
  font-size: 0.85rem;
  font-weight: 500;
  line-height: 1.4;

  background: var(--editor-background);
  color: var(--editor-foreground);
  border-radius: 18px;
}

/* ============================= */
/* Syntax highlighting (Rouge)  */
/* ============================= */

/* Comments */
.highlight .c,
.highlight .c1,
.highlight .cm,
.highlight .cs {
  color: var(--comment-fg);
}

/* Strings & Characters */
.highlight .s,
.highlight .s1,
.highlight .s2,
.highlight .sb,
.highlight .sc,
.highlight .sd,
.highlight .se,
.highlight .sh,
.highlight .si,
.highlight .sr,
.highlight .sx,
.highlight .sa {
  color: var(--string-fg);
}

.highlight .sc {
  color: var(--char-fg);
}

/* Numbers */
.highlight .m,
.highlight .mi,
.highlight .mf,
.highlight .mh,
.highlight .mo {
  color: var(--num-fg);
}

/* Keywords */
.highlight .k,
.highlight .kc,
.highlight .kd,
.highlight .kn,
.highlight .kp,
.highlight .kr,
.highlight .kt {
  color: var(--keyword-fg);
}

/* Types & Declarations */
.highlight .nc,
.highlight .kt {
  color: var(--type-dec-fg);
}

.highlight .nd {
  color: var(--other-dec-fg);
}

/* Functions */
.highlight .nf {
  color: var(--pr-func-fg);
}

/* Classes */
.highlight .nc {
  color: var(--pr-class-fg);
}

/* Constants */
.highlight .no {
  color: var(--pr-const-fg);
}

/* Variables */
.highlight .nv,
.highlight .vc,
.highlight .vi,
.highlight .vg,
.highlight .cp {
  color: var(--plain-text-fg);
}

/* Built-ins */
.highlight .nb,
.highlight .bp {
  color: var(--link-fg);
}

/* Namespaces */
.highlight .nn {
  color: var(--other-type-fg);
}

/* Operators & Punctuation */
.highlight .o,
.highlight .ow,
.highlight .p {
  color: var(--plain-text-fg);
}

/* ============================= */
/* Swift-specific overrides     */
/* ============================= */

/* `self`, `Self`, `Type`-like identifiers */
.highlight .nb.self,
.highlight .kt.self {
  color: var(--keyword-fg);
  font-style: italic;
}

/* `#Preview`, `#if`, compiler directives */
.highlight .cp {
  font-weight: 600;
}

/* Mutating / throwing emphasis */
.highlight .kr {
  color: var(--keyword-fg);
  font-weight: 600;
}

/* Diff */
.highlight .gi {
  color: #2ecc71;
}

.highlight .gd {
  color: #e74c3c;
}

@media (prefers-color-scheme: dark) {
  :root {
    --editor-foreground: hsl(0, 0%, 100%);
    --editor-background: hsl(223, 9%, 15%);
    --comment-fg: #6C7986;
    --string-fg: #FC6A5D;
    --char-fg: #D0BF69;
    --num-fg: #D0BF69;
    --keyword-fg: #FC5FA3;
    --link-fg: #5482FF;
    --type-dec-fg: #5DD8FF;
    --other-dec-fg: #41A1C0;
    --pr-class-fg: #9EF1DD;
    --pr-func-fg: #9EF1DD;
    --pr-const-fg: #9EF1DD;
    --pr-properties-global-fg: #9EF1DD;
    --pr-type-fg: #9EF1DD;
    --other-class-fg: #D0A8FF;
    --other-func-fg: #A167E6;
    --other-const-fg: #A167E6;
    --other-properties-global-fg: #A167E6;
    --other-type-fg: #D0A8FF;
    --plain-text-fg: #FFFFFF;
  }
}