@import 'trix/dist/trix.css';
@tailwind base;
@tailwind components;
@tailwind utilities;

@font-face {
    font-family: "Font Awesome 7 Sharp Local";
    src: url("/fontawesome/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 Local";
    src: url("/fontawesome/fontawesome-7-brands-regular-400.otf") format("opentype");
    font-style: normal;
    font-weight: 400;
    font-display: block;
}

:where(.fa, .fa-sharp, .fa-regular, .fa-solid, .fa-brands) {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    line-height: 1;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

:where(.fa, .fa-sharp, .fa-regular, .fa-solid)::before {
    font-family: "Font Awesome 7 Sharp Local";
    font-weight: 400;
}

:where(.fa-brands)::before {
    font-family: "Font Awesome 7 Brands Local";
    font-weight: 400;
}

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

.fa-lg {
    font-size: 1.25em;
    line-height: 0.05em;
    vertical-align: -0.075em;
}

.fa-xl {
    font-size: 1.5em;
    line-height: 0.04167em;
    vertical-align: -0.125em;
}

.fa-spin {
    animation: fa-spin 2s infinite linear;
}

@keyframes fa-spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.fa-align-left::before { content: "\f036"; }
.fa-ban::before { content: "\1f6ab"; }
.fa-bars::before { content: "\f0c9"; }
.fa-bullseye-arrow::before { content: "\1f3af"; }
.fa-calendar-day::before { content: "\f783"; }
.fa-cart-shopping::before { content: "\1f6d2"; }
.fa-check::before { content: "\f00c"; }
.fa-chevron-down::before { content: "\f078"; }
.fa-chevron-up::before { content: "\f077"; }
.fa-circle-arrow-right::before { content: "\f0a9"; }
.fa-circle-check::before { content: "\f05d"; }
.fa-circle-info::before { content: "\f05a"; }
.fa-circle-play::before { content: "\f144"; }
.fa-circle-plus::before { content: "\f055"; }
.fa-circle-question::before { content: "\f29c"; }
.fa-clock::before { content: "\1f553"; }
.fa-cloud-arrow-down::before { content: "\f381"; }
.fa-code::before { content: "\f121"; }
.fa-comment-lines::before { content: "\f4b0"; }
.fa-copy::before { content: "\f0c5"; }
.fa-credit-card::before { content: "\1f4b3"; }
.fa-display::before { content: "\e163"; }
.fa-egg::before { content: "\1f95a"; }
.fa-envelope::before { content: "\1f582"; }
.fa-eye::before { content: "\1f441"; }
.fa-face-frown::before { content: "\f119"; }
.fa-face-sad-tear::before { content: "\1f622"; }
.fa-face-smile::before { content: "\1f642"; }
.fa-face-smile-beam::before { content: "\1f60a"; }
.fa-file-lines::before { content: "\1f5ce"; }
.fa-gear::before { content: "\f013"; }
.fa-gift::before { content: "\1f381"; }
.fa-google::before { content: "\f1a0"; }
.fa-graduation-cap::before { content: "\1f393"; }
.fa-heading::before { content: "\f1dc"; }
.fa-heart::before { content: "\1f9e1"; }
.fa-laptop::before { content: "\1f4bb"; }
.fa-life-ring::before { content: "\f1cd"; }
.fa-link::before { content: "\1f517"; }
.fa-lock::before { content: "\1f512"; }
.fa-lock-alt::before { content: "\f30d"; }
.fa-magnifying-glass::before { content: "\1f50d"; }
.fa-money-bill-wave::before { content: "\f53a"; }
.fa-paper-plane::before { content: "\f1d9"; }
.fa-pen-to-square::before { content: "\f044"; }
.fa-play::before { content: "\f04b"; }
.fa-plug::before { content: "\1f50c"; }
.fa-plus::before { content: "\f067"; }
.fa-rocket::before { content: "\f135"; }
.fa-spinner-third::before { content: "\f3f4"; }
.fa-square-caret-down::before { content: "\f150"; }
.fa-square-caret-up::before { content: "\f151"; }
.fa-star::before { content: "\f006"; }
.fa-store::before { content: "\f54e"; }
.fa-tag::before { content: "\1f3f7"; }
.fa-trash::before { content: "\f1f8"; }
.fa-tv-retro::before { content: "\1f4fa"; }
.fa-up-right-from-square::before { content: "\f35d"; }
.fa-user::before { content: "\1f464"; }
.fa-users::before { content: "\f0c0"; }
.fa-video::before { content: "\f03d"; }
.fa-wallet::before { content: "\f555"; }
.fa-xmark::before { content: "\1f5d9"; }

:root {
    --background: #FAF7EC;
    --background-border: #E6E1CC;
    --background-max: #FFFFFF; /* white */
    --foreground: #1E1E1E;
    --foreground-muted: rgba(30, 30, 30, 0.5);
    --accent-gold: #F5C451;
    --accent-gold-soft: rgba(245, 196, 81, 0.12);
}

@theme inline {
    --color-background: var(--background);
    --color-foreground: var(--foreground);
    --font-sans: var(--font-geist-sans);
    --font-mono: var(--font-geist-mono);
}

@media (prefers-color-scheme: dark) {
    /* :root {
        --background: #272727;
        --background-border: #383631;
        --foreground: #FAF7EC;
        --background-max: #1c1c1c;
        --foreground-muted: rgba(250, 247, 236, 0.5);
    } */
}

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

trix-toolbar [data-trix-button-group="file-tools"] {
    display: none;
}

.mask-fade-top {
    -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 10%, black 100%);
    mask-image: linear-gradient(to bottom, transparent 0%, black 10%, black 100%);
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}

.mask-fade-bottom {
    -webkit-mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
    mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}

.mask-fade-top-bottom {
    -webkit-mask-image: linear-gradient(to bottom,
        transparent 0%,
        black 10%,
        black 90%,
        transparent 100%
    );
    mask-image: linear-gradient(to bottom,
        transparent 0%,
        black 10%,
        black 90%,
        transparent 100%
    );
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}