Jotzy/frontend/src/main.css

@import "tailwindcss";
@plugin "@tailwindcss/typography";
@import "@catppuccin/tailwindcss/macchiato.css";

@theme {
    --color-base: 
;
}

@theme {
    /* Map Tailwind classes to CSS variables */
    --color-ctp-base: var(--color-ctp-base);
    --color-ctp-mantle: var(--color-ctp-mantle);
    --color-ctp-crust: var(--color-ctp-crust);

    --color-ctp-text: var(--color-ctp-text);
    --color-ctp-subtext0: #a5adcb;
    --color-ctp-overlay0: #6e738d;

    --color-ctp-mauve: var(--color-ctp-mauve);
    --color-ctp-blue: var(--color-ctp-blue);
    --color-ctp-green: #a6da95;
    --color-ctp-red: #ed8796;
    --color-ctp-yellow: #eed49f;
    --color-ctp-teal: #8bd5ca;
    --color-ctp-sapphire: #7dc4e4;
    --color-ctp-peach: #f5a97f;

    /* Surface colors */
    --color-ctp-surface0: #363a4f;
    --color-ctp-surface1: #494d64;
    --color-ctp-surface2: #5b6078;
}

/* Default values (Macchiato) - injected by JS, but good as fallback */
:root {
    --color-ctp-base: #24273a;
    --color-ctp-mantle: #1e2030;
    --color-ctp-crust: #181926;
    --color-ctp-text: #cad3f5;
    --color-ctp-mauve: #c6a0f6;
    --color-ctp-blue: #8aadf4;
}

/* Override MDXEditor and all its children */
[class*="mdxeditor"],
._mdxeditor-root-content-editable,
.mdxeditor-root-contenteditable,
div[contenteditable="true"] {
    color: var(--color-ctp-text) !important;
}

._listItemChecked_1tncs_73::before {
    --accentSolid: var(--color-ctp-mauve) !important;
    border-color: var(--color-ctp-mauve-900) !important;
    border: 2px;
}

._listItemChecked_1tncs_73::after {
    border-color: var(--color-ctp-mauve-900) !important;
}

.standard-input {
    @apply border border-ctp-mauve rounded-sm px-2 py-1 w-full focus:outline-none focus:ring-2 focus:ring-ctp-mauve bg-ctp-base text-ctp-text placeholder:text-ctp-overlay0;
}