/*
Flexoki
MIT License
Copyright (c) 2023 Steph Ango
https://stephango.com/flexoki
*/

/* --- Atkinson Hyperlegible Font Import --- */
@import url('https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:ital,wght@0,400;0,700;1,400;1,700&display=swap');


/* --- Apply Atkinson Hyperlegible using Obsidian's CSS Variables --- */
body {
  --font-text-theme: 'Atkinson Hyperlegible', sans-serif; /* Main text font */
  --font-interface-theme: 'Atkinson Hyperlegible', sans-serif; /* UI elements, like sidebars, navigation */
  --font-monospace-theme: 'Atkinson Hyperlegible', monospace; /* Code blocks and inline code */
  
  /* Applying Atkinson to headings using specific font variables */
  --h1-font: 'Atkinson Hyperlegible', sans-serif;
  --h2-font: 'Atkinson Hyperlegible', sans-serif;
  --h3-font: 'Atkinson Hyperlegible', sans-serif;
  --h4-font: 'Atkinson Hyperlegible', sans-serif;
  --h5-font: 'Atkinson Hyperlegible', sans-serif;
  --h6-font: 'Atkinson Hyperlegible', sans-serif;
}

/* --- Make H1 and H2 Bigger & Accent Color --- */
body {
  --h1-size: 3.5em; /* Adjust this value as needed */
  --h2-size: 2.5em; /* Adjust this value as needed */

  /* Apply accent color to headings using Obsidian's variables */
  --h1-color: var(--text-accent);
  --h2-color: var(--text-accent);
  --h3-color: var(--text-accent); /* You might want other headings to be accent too */
  --h4-color: var(--text-accent);
  --h5-color: var(--text-accent);
  --h6-color: var(--text-accent);
}


/* --- Existing Flexoki Theme Styles --- */
.theme-light {
  --color-red-rgb: 175, 48, 41;
  --color-orange-rgb: 188, 82, 21;
  --color-yellow-rgb: 173, 131, 1;
  --color-green-rgb: 102, 128, 11;
  --color-cyan-rgb: 36, 131, 123;
  --color-blue-rgb: 32, 94, 166;
  --color-purple-rgb: 94, 64, 157;
  --color-pink-rgb: 160, 47, 111;

  --color-red: #AF3029;
  --color-orange: #BC5215;
  --color-yellow: #AD8301;
  --color-green: #66800B;
  --color-cyan: #24837B;
  --color-blue: #205EA6;
  --color-purple: #5E409D;
  --color-pink: #A02F6F;

  --accent-h: 175;
  --accent-s: 57%;
  --accent-l: 33%;

  --color-base-00: #FFFCF0;
  --color-base-05: #FFFCF0;
  --color-base-10: #F2F0E5;
  --color-base-20: #F2F0E5;
  --color-base-25: #E6E4D9;

  --color-base-30: #E6E4D9;
  --color-base-35: #DAD8CE;
  --color-base-40: #CECDC3;

  --color-base-50: #B7B5AC;
  --color-base-60: #878580;
  --color-base-70: #6F6E69;
  --color-base-100: #100F0F;
}
.theme-dark {
  --color-red-rgb: 209, 77, 65;
  --color-orange-rgb: 218, 112, 44;
  --color-yellow-rgb:208, 162, 21;
  --color-green-rgb: 135, 154, 57;
  --color-cyan-rgb: 58, 169, 159;
  --color-blue-rgb: 67, 133, 190;
  --color-purple-rgb: 139, 126, 200;
  --color-pink-rgb: 206, 93, 151;

  --color-red: #D14D41;
  --color-orange: #DA702C;
  --color-yellow: #D0A215;
  --color-green: #879A39;
  --color-cyan: #3AA99F;
  --color-blue: #4385BE;
  --color-purple: #8B7EC8;
  --color-pink: #CE5D97;

  --accent-h: 175;
  --accent-s: 57%;
  --accent-l: 33%;

  --color-base-00: #100F0F;
  --color-base-05: #100F0F;
  --color-base-10: #1C1B1A;
  --color-base-20: #1C1B1A;
  --color-base-25: #282726;

  --color-base-30: #282726;
  --color-base-35: #343331;
  --color-base-40: #403E3C;

  --color-base-50: #575653;
  --color-base-60: #6F6E69;
  --color-base-70: #878580;
  --color-base-100: #CECDC3;
}