/* Css override to make MudBlazor components look a bit more like Tractie */
:root {
    /* Colors: https://tractie.ns.nl/2e23992f3/p/669cde-colors/t/page-669cde-87615821-30d435-9 */

    --tractie-green-50: #dafbf0;
    --tractie-green-100: #b9f4db;
    --tractie-green-500: #3e9d7b;
    --tractie-red-50: #fceaeb;
    --tractie-red-100: #fadcdd;
    --tractie-red-600: #ce092d;
    --tractie-blue-100: #deeafd;
    --tractie-blue-500: #0062d1;
    --tractie-blue-700: #0a3680;
    --tractie-yellow-50: #fbf7db;
    --tractie-yellow-100: #fff2c8;
    --tractie-yellow-600: #e0ad06;
    --tractie-white-300: #c4c5cb;
    --tractie-white-500: #75767c;
    --tractie-white-800: #252528;
    --tractie-white-100: #e4e5e8;
    --tractie-white: #ffffff;
    --tractie-orange-50: #fbf1e7;
    --tractie-orange-500: #f05c00;
}

.mud-button-root {
    border-radius: 6px; /* Add round corners */
}

.mud-paper {
    border-radius: 6px; /* Add round corners */
}


.mud-alert-text-success {
    background: var(--tractie-green-50) !important;
    border-left: 4px solid var(--tractie-green-500);
}

.mud-alert-text-error {
    background: var(--tractie-red-50);
    border-left: 4px solid var(--tractie-red-600);
}

.mud-alert-text-warning {
    background: var(--tractie-orange-50);
    border-left: 4px solid var(--tractie-orange-500);
}

.black-text {
    color: var(--tractie-white-800) !important;
}

.gray-text {
    color: var(--tractie-white-300) !important;
}

.mud-button-filled-primary {
    background: var(--tractie-blue-500) !important;
}