@import "tailwindcss";

@font-face {
    font-family: "Inter";
    src: url("/fonts/inter/inter-variable.ttf") format("truetype");
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
}

@font-face {
    font-family: "Font Awesome 7 Sharp";
    src: url("/fonts/fontawesome-7-sharp-regular-400.otf") format("opentype");
    font-style: normal;
    font-weight: 400;
    font-display: block;
}

@font-face {
    font-family: "Font Awesome 7 Brands";
    src: url("/fonts/fontawesome-7-brands-regular-400.otf") format("opentype");
    font-style: normal;
    font-weight: 400;
    font-display: block;
}

html {
    scroll-behavior: smooth;
}

:root {
    --primary: #00E0BF;
    --background: #FAF7EC;
    --background-border: #E6E1CC;
    --background-max: #FFFFFF; /* white */
    --foreground: #1E1E1E;
    --foreground-muted: rgba(30, 30, 30, 0.5);

    --highlight-dark: #F5C73D;
    --highlight-medium: #fce192;
    --highlight-light: #FFF2CB; 
    
    --light-blue: #9FE7FF;
    --pink: #FFD1F3;
    --green: #d5fc49;

}

@theme inline {
    --color-background: var(--background);
    --color-foreground: var(--foreground);
    --font-sans: "Inter", Arial, sans-serif;
    --font-mono: ui-monospace, monospace;
}

/* @media (prefers-color-scheme: dark) {
  :root {
    --background: #0a0a0a;
    --foreground: #ededed;
  }
} */

body {
    background: var(--background);
    color: var(--foreground);
    font-family: "Inter", Arial, sans-serif;
}

.fa-sharp {
    display: var(--fa-display, inline-block);
    font-family: "Font Awesome 7 Sharp";
    font-style: normal;
    font-variant: normal;
    font-weight: 400;
    line-height: 1;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.fa-sharp::before {
    content: var(--fa);
}

.fa-fw {
    text-align: center;
    width: 1.25em;
}

.fa-arrow-down { --fa: "\f063"; }
.fa-arrow-left-long { --fa: "\f177"; }
.fa-badge-check { --fa: "\f336"; }
.fa-bolt { --fa: "\f0e7"; }
.fa-bullhorn { --fa: "\f0a1"; }
.fa-chart-line { --fa: "\f201"; }
.fa-chevron-down { --fa: "\f078"; }
.fa-chevron-left { --fa: "\f053"; }
.fa-chevron-right { --fa: "\f054"; }
.fa-circle-check { --fa: "\f058"; }
.fa-circle-question { --fa: "\f059"; }
.fa-circle-xmark { --fa: "\f057"; }
.fa-cloud-arrow-down { --fa: "\f0ed"; }
.fa-credit-card { --fa: "\f09d"; }
.fa-envelope { --fa: "\f0e0"; }
.fa-face-smile-beam { --fa: "\f5b8"; }
.fa-file-export { --fa: "\f56e"; }
.fa-file-lines { --fa: "\f15c"; }
.fa-hourglass-half { --fa: "\f252"; }
.fa-link { --fa: "\f0c1"; }
.fa-party-horn { --fa: "\e31b"; }
.fa-seedling { --fa: "\f4d8"; }
.fa-star { --fa: "\f005"; }
.fa-tags { --fa: "\f02c"; }
.fa-up-down-left-right { --fa: "\f0b2"; }
.fa-user { --fa: "\f007"; }
.fa-user-lock { --fa: "\f502"; }
.fa-video { --fa: "\f03d"; }

.fa-moon { --fa: "\f186"; }

.fa-plug { --fa: "\f1e6"; }