/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

@import "buttons.css";
@import "navbar.css";
@import "home.css";
@import "recipes.css";
@import "auth.css";
@import "recipe_detail.css";


:root {
    --accent-color: #33492F;
    --accent-color-dark: #233021;
    --accent-color-light: #D9E4C9;
    --accent-transparent: rgba(251, 247, 238, 0.14);
    --ink: #252B22;

    --background-color: #FBF7EE;

    --font-serif: "Fraunces", Georgia, serif;
    --font-sans: "Karla", system-ui, sans-serif;
    --font-mono: 'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;
}

* {
    box-sizing: border-box;
}

body {
    font-family: var(--font-sans);
    background-color: var(--background-color);
    margin: 0;
}