@import url("../css/atom/logo.css");
@import url("../css/atom/link.css");
@import url("../css/atom/button.css");
@import url("../css/atom/search.css");

@import url("../css/element/navigation.css");
@import url("../css/element/stats.css");
@import url("../css/element/collection-card.css");
@import url("../css/element/hotwheel-card.css");

@import url("../css/module/header.css");
@import url("../css/module/jumbotron.css");
@import url("../css/module/user-info.css");
@import url("../css/module/collection.css");
@import url("../css/module/hotwheel-detail.css");

@import url("../css/taxonomy.css");

@font-face {
    font-family: 'Poppins';
    src: url('../fonts/Poppins-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

:root {
    --bg-primary: #f1ffe7;

    --text-primary: #20381d;
    --text-secondary: #376032;
    --text-colorful: #90eb88;
    --text-muted: #757068;
}

body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
    font-family: 'Poppins', sans-serif;
    margin: 0;
}

.content-wrapper {
    max-width: 1200px;
    margin: 0 auto;
    box-sizing: border-box;
}

@media (max-width: 1200px) {
    .content-wrapper {
        margin-inline: 2rem;
    }
}

@media (max-width: 600px) {
    .content-wrapper {
        margin-inline: 1rem;
    }
}

.demo-banner {
    display: flex;
    justify-content: center;
    padding: 1rem;
    background-color: var(--bg-primary);
    color: #db3838;
}