:root{
    --primary-color: #000080;
    --secondary-color : #ff0000;
    --white-color: #ffffff;
    --gray-color: #f0f0f0;

    --primary-text-color: #222222;
    --secondary-text-color: #ffffff; 
    --font-size-p: 14px;
    --font-size-title: 26px;
    --font-size-subtitle: 20px;


    --linear-gradient-white : linear-gradient(135deg, #ffffff 0%, #dae8ff 50%);
    --linear-gradient-right-blue: linear-gradient(to right, var(--primary-color), #000030);
    --linear-gradient-left-blue: linear-gradient(to left, var(--primary-color), #000030);
    --linear-gradient-bottom-red: linear-gradient(to bottom , var(--secondary-color), #aa0000);
}

body {
    font-family: 'Helvetica Neue', Arial, sans-serif;
    line-height: 1.4;
    color: var(--text-color);
    background: var(--linear-gradient-white);
    margin: 0;
    padding: 0;
    font-size: var(--font-size);
}

/* Chrome, Safari, Edge */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type="number"] {
    -moz-appearance: textfield;
}

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

::-webkit-scrollbar-track {
    background: var(--gray-color);
    border-radius: 5px;
}

::-webkit-scrollbar-thumb {
    background: var(--primary-color); 
    border-radius: 5px; 
    border: 3px solid var(--white-color);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--secondary-color);
}
main {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}