@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap');

@import url(styles/reset.css);
@import url(styles/header.css);
@import url(styles/highlight.css);
@import url(styles/cards.css);
@import url(styles/footer.css);
@import url(styles/MainCarousel.css);
@import url(styles/cart.css);
@import url(styles/about.css);
@import url(styles/help.css);

:root {
    --main-font: 'Poppins', sans-serif;
    --color-one: #38220f;
    --color-two: #634832;
    --color-three: #967259;
    --color-four: #dbc1ac;
    --color-five: #ece0d1;
    --color-white: #FFFFFF;
    --color-black: #000000;

}

body {
    background-color: var(--color-five);
    font-family: var(--main-font);
    font-weight: 400;
    font-size: 1rem;
}

.main {
    background-color: var(--color-three);
}

::-webkit-scrollbar {
    width: 16px;
}

::-webkit-scrollbar-track {
    background: var(--color-two);
}

::-webkit-scrollbar-thumb {
    background: var(--color-one);
    border-radius: 10px;
    border: 3px solid transparent;
    background-clip: content-box;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--color-three);
    border: 3px solid transparent;
    background-clip: content-box;
}

.prevent-select {
    -webkit-user-select: none;
    /* Safari */
    -ms-user-select: none;
    /* IE 10 and IE 11 */
    user-select: none;
    /* Standard syntax */
}