@tailwind base;
@tailwind components;
@tailwind utilities;

/* fixes stroke around text in the home page */
.fix-text-stroke {
  paint-order: stroke fill;
}

/* Style the footnotes section. */
[data-footnotes] {
  @apply mt-6;
}

[data-footnote-backref] {
  @apply no-underline;
}

[data-footnote-ref] {
  @apply no-underline;
}

/* Place `[` and `]` around footnote references. */
[data-footnote-ref]::before {
  content: '[';
}

[data-footnote-ref]::after {
  content: ']';
}

/* fixes the colour for latex text in posts */
.katex-display {
  @apply text-foreground;
}

@layer base {
  :root {
    --rosewater: 11 59% 67%;
    --flamingo: 0 60% 67%;
    --pink: 316 73 69;
    --mauve: 266 85 58;
    --red: 347 87 44;
    --maroon: 355 76 59;
    --peach: 22 99 52;
    --yellow: 35 77 49;
    --green: 109 58 40;
    --teal: 183 74 35;
    --sky: 197 97 46;
    --sapphire: 189 70 42;
    --blue: 220 91 54;
    --lavender: 231 97 72;

    --background: 220 23.076923191547394% 98.90196108818054%; /* base */
    --foreground: 234 16.022099554538727% 35.49019694328308%; /* text */

    --muted: 223 15.909090638160706% 82.74509906768799%; /* surface0 */
    --muted-foreground: 233 12.796208262443542% 41.372549533843994%; /* subtext1 */

    --popover: 220 23.076923191547394% 94.90196108818054%; /* base */
    --popover-foreground: 234 16.022099554538727% 35.49019694328308%; /* text */

    --card: 220 23.076923191547394% 94.90196108818054%; /* base */
    --card-foreground: 234 16.022099554538727% 35.49019694328308%; /* text */

    --border: 225 13.55932205915451% 76.86274647712708%; /* surface1 */
    --input: 225 13.55932205915451% 76.86274647712708%; /* surface1 */

    --primary: 266 85.04672646522522% 58.03921818733215%; /* accent - Mauve */
    --primary-foreground: 220 23.076923191547394% 94.90196108818054%; /* base */

    --secondary: 223 15.909090638160706% 82.74509906768799%; /* surface0 */
    --secondary-foreground: 234 16.022099554538727% 35.49019694328308%; /* text */

    --accent: 223 15.909090638160706% 82.74509906768799%; /* surface0 */
    --accent-foreground: 234 16.022099554538727% 35.49019694328308%; /* text */

    --destructive: 347 86.66666746139526% 44.117647409439087%; /* red */
    --destructive-foreground: 220 21.95121943950653% 91.96078181266785%; /* mantle */

    --ring: 234 16.022099554538727% 35.49019694328308%; /* text */

    --radius: 0.37rem;

    --chart-1: 347 86.66666746139526% 44.117647409439087%; /* red */
    --chart-2: 183 73.86363744735718% 34.50980484485626%; /* teal */
    --chart-3: 220 91.4893627166748% 53.92156839370728%; /* blue */
    --chart-4: 35 76.98412537574768% 49.41176474094391%; /* yellow */
    --chart-5: 109 57.63546824455261% 39.803922176361084%; /* green */
  }

  .dark {
    --rosewater: 10 56% 91%;
    --flamingo: 0 59% 88%;
    --pink: 316 72 86;
    --mauve: 267 84 81;
    --red: 343 81 75;
    --maroon: 350 65 77;
    --peach: 23 92 75;
    --yellow: 41 86 83;
    --green: 115 54 76;
    --teal: 170 57 73;
    --sky: 189 71 73;
    --sapphire: 199 76 69;
    --blue: 217 92 76;
    --lavender: 232 97 85;
    
    --background: 240 21.052631735801697% 13.901961386203766%; /* base */
    --foreground: 226 63.93442749977112% 88.03921341896057%; /* text */

    --muted: 237 16.239316761493683% 22.94117659330368%; /* surface0 */
    --muted-foreground: 227 35.29411852359772% 80.0000011920929%; /* subtext1 */

    --popover: 240 21.052631735801697% 14.901961386203766%; /* base */
    --popover-foreground: 226 63.93442749977112% 88.03921341896057%; /* text */

    --card: 240 21.052631735801697% 14.901961386203766%; /* base */
    --card-foreground: 226 63.93442749977112% 88.03921341896057%; /* text */

    --border: 234 13.20754736661911% 31.17647171020508%; /* surface1 */
    --input: 234 13.20754736661911% 31.17647171020508%; /* surface1 */

    --primary: 267 83.50515365600586% 80.98039031028748%; /* accent - Mauve */
    --primary-foreground: 240 21.052631735801697% 14.901961386203766%; /* base */

    --secondary: 237 16.239316761493683% 22.94117659330368%; /* surface0 */
    --secondary-foreground: 226 63.93442749977112% 88.03921341896057%; /* text */

    --accent: 237 16.239316761493683% 22.94117659330368%; /* surface0 */
    --accent-foreground: 226 63.93442749977112% 88.03921341896057%; /* text */

    --destructive: 343 81.25% 74.90196228027344%; /* red */
    --destructive-foreground: 240 21.311475336551666% 11.96078434586525%; /* mantle */

    --ring: 226 63.93442749977112% 88.03921341896057%; /* text */

    --chart-1: 343 81.25% 74.90196228027344%; /* red */
    --chart-2: 170 57.35294222831726% 73.33333492279053%; /* teal */
    --chart-3: 217 91.86992049217224% 75.88235139846802%; /* blue */
    --chart-4: 41 86.04651093482971% 83.13725590705872%; /* yellow */
    --chart-5: 115 54.09836173057556% 76.07843279838562%; /* green */
  }
}