﻿/*
    The following styles are implemented to enhance accessibility.
    Please exercise caution while modifying to ensure compliance with 
    accessibility standards (e.g., WCAG) and maintain a positive user experience.

    Note: This file is the sole location for implementing accessibility fixes.
*/

:root {
    --white-color: #ffffff;
    --button-shadow: 0 0 0 0.1rem #FFF, 0 0 0 0.3rem rgb(42 144 229 / 98%);
    --input-shadow: 0 0 0 0.2rem rgb(42 144 229 / 98%);
    --border-color: #888b8e;
    --placeholder-color: #757575;
    --error-color: #E00000;
}
/***********************************       BUTTONS       ***********************************/
.btn-primary {
    --bg-color: #C54902;
    --bg-hover-color: #ab4002;
    --bg-active-color: #923601;
}

    .btn-primary,
    .btn-primary.disabled,
    .btn-primary:disabled {
        --bs-btn-hover-bg: var(--bg-color);
        --bs-btn-hover-border-color: var(--bg-color);
        background-color: var(--bg-color);
        border-color: var(--bg-color);
        color: var(--white-color);
        box-shadow: none;
    }

        .btn-primary:hover {
            background-color: var(--bg-hover-color);
            color: var(--white-color);
        }

        .btn-primary:not(:disabled):not(.disabled):active,
        .btn-primary:not(:disabled):not(.disabled).active,
        .show > .btn-primary.dropdown-toggle {
            background-color: var(--bg-active-color);
            border-color: var(--bg-active-color);
            color: var(--white-color);
        }

.btn:focus,
.btn.focus,
.btn:not(:disabled):not(.disabled):active:focus,
.btn:not(:disabled):not(.disabled).active:focus,
.show > .btn.dropdown-toggle:focus {
    outline: 0;
    box-shadow: var(--button-shadow);
}

/***********************************       INPUTS       ***********************************/
textare,
input[type="text"],
input[type="password"] {
    border-color: var(--border-color);
}

    textarea:focus,
    input[type="text"]:focus,
    input[type="password"]:focus {
        border-color: var(--white-color);
        box-shadow: var(--input-shadow);
    }

    input[type="text"]::-webkit-input-placeholder,
    input[type="password"]::-webkit-input-placeholder {
        color: var(--placeholder-color);
    }

.field-validation-error,
.validation-summary-errors {
    color: var(--error-color);
}

/***********************************       ALERTS       ***********************************/
.alert-success {
    background-color: #dff0d8;
    border-color: #d6e9c6;
    color: #3C773D;
}

.alert-info {
    color: #3a87ad;
    background-color: #d9edf7;
    border-color: #bce8f1;
}

.alert-warning {
    color: #c09853;
    background-color: #fcf8e3;
    border-color: #fbeed5;
}

.alert-danger,
.alert-error {
    color: #b94a48;
    background-color: #f2dede;
    border-color: #eed3d7;
}

.toast-warning {
    background-color: #A96504;
}

.toast-success {
    background-color: #208537 !important;
}
