/*
This is an example of data/user.css file to change colors from Blue to Teal.
Example color palettes available here: https://material.io/guidelines/style/color.html#color-color-palette
- Base color: #009688i
- Focus color: #00796Bi
- Active color: #004D40i
 */

:root {
    --base-color: #1b5e20;
    --focus-color: #003300;
    --active-color: #4c8c4a;
}
div.awesomplete > ul > li[aria-selected=true],
.button-primary,
[type="radio"]:checked + label:after,
[type="radio"].with-gap:checked + label:after,
[type=checkbox].filled-in:checked + label:after,
.switch label input[type=checkbox]:checked + .lever:after,
.header-main {
    background-color: var(--base-color);
}
.button-primary:hover, .button-primary:focus{
    background-color: var(--focus-color);
}
.button-primary:active{
    background-color: var(--active-color);
}

a,
label.active {
    color: var(--base-color); 
}

a:hover, a:focus {
    color: var(--focus-color); 
}

a:active {
    color: var(--active-color); 
}

input[type=text]:focus,
input[type=search]:focus,
input[type=number]:focus,
input[type=password]:focus,
textarea:focus {
    border-color: var(--base-color);
    box-shadow: 0 1px 0 var(--base-color);
    outline: none; 
}
input.input-big:focus{
    box-shadow: none;
}

select:focus,
[type="radio"]:checked + label:after,
[type="radio"].with-gap:checked + label:before,
[type="radio"].with-gap:checked + label:after,
[type="checkbox"]:checked + label:before,
[type="checkbox"] :indeterminate + label:before,
[type=checkbox].filled-in:checked + label:after {
    border-color: var(--base-color);
}

.subheader{
    background-color: var(--focus-color);
}