﻿/*
    bem

    assumptions:
    modifier is not used for default
    modifier is used for: small, large, color, filter, action, drop-down? (down arrow)

    policies:
    filter buttons are white-grey and default
    action buttons are white-secondary and default
*/

/* Fix for tag input box not disappearing quick enough (bad transition) */
.chosen-container-multi .chosen-choices {
    transition: none;
    -webkit-transition: none;
}

    .chosen-container-multi .chosen-choices li.search-field input[type="text"] {
        transition: none;
        -webkit-transition: none;
    }

/* dropdown */
.albany-dropdown {
    text-align: left;
    display: inline-block;
    font-family: proximasoft-regular;
    font-weight: normal;
    font-size: 14px;
    line-height: 16px;
    border-radius: 0;
    cursor: pointer;
    text-shadow: none;
    margin: 0px;
    padding: 0px;
    position: static;
}

.albany-dropdown__btn {
    display: inline-block;
    text-align: left;
    /*default*/
    padding: 10px 15px;
    margin: 0px;
}

.albany-dropdown__child-btn {
    display: inline-block;
    text-align: left;
    /*default*/
    margin: 0px;
}

.albany-dropdown__btn .fa-chevron-down {
    display: unset;
}

.albany-dropdown__list {
    text-align: left;
    display: none;
    margin: 0px;
    padding: 0px;
    list-style-type: none;
    position: absolute;
    margin-top: 0.25rem;
    z-index: 1;
    white-space: nowrap;
}

    .albany-dropdown__list > li {
        text-align: left;
        margin: 0px;
        padding: 5px 15px;
        padding-right: 45px;
    }

form.albany-dropdown__list > span {
    display: inline-block;
    text-align: left;
    margin: 0px;
    padding: 10px 15px;
    padding-right: 30px;
}




.albany-dropdown__child-list {
    text-align: left;
    display: none;
    margin: 0px;
    padding: 0px;
    list-style-type: none;
    position: absolute;
    margin-top: 0.25rem;
    z-index: 1;
    white-space: nowrap;
    background: white;
    border: 2px solid gray;
}

    .albany-dropdown__child-list > li {
        text-align: left;
        margin: 0px;
        padding: 5px 15px;
        padding-right: 45px;
    }
/* color: white-secondary */
.albany-dropdown--white-secondary {
}

    .albany-dropdown--white-secondary > .albany-dropdown__btn, .albany-dropdown--white-secondary > .albany-dropdown__btn:visited {
        background: white;
        color: #2270CC;
        border: 2px solid #2270CC;
    }

    .albany-dropdown--white-secondary > .albany-dropdown__list {
        background: white;
        border: 2px solid #2270CC;
    }

        .albany-dropdown--white-secondary > .albany-dropdown__list > li {
            background: white;
            color: #2270CC;
        }

            .albany-dropdown--white-secondary > .albany-dropdown__list > li > * {
                background: white;
                color: #2270CC;
            }

            .albany-dropdown--white-secondary > .albany-dropdown__list > li:hover {
                background: #2270CC;
                color: white;
            }

                .albany-dropdown--white-secondary > .albany-dropdown__list > li:hover > * {
                    background: #2270CC;
                    color: white;
                }

/* color: white-grey */
.albany-dropdown--white-grey {
}

    .albany-dropdown--white-grey > .albany-dropdown__btn, .albany-dropdown--white-grey > .albany-dropdown__btn:visited {
        background: white;
        color: black;
        border: 2px solid grey;
    }

    .albany-dropdown--white-grey > .albany-dropdown__list {
        background: white;
        border: 2px solid grey;
    }

        .albany-dropdown--white-grey > .albany-dropdown__list > li {
            background: white;
            color: black;
        }

            .albany-dropdown--white-grey > .albany-dropdown__list > li > * {
                background: white;
                color: black;
            }

            .albany-dropdown--white-grey > .albany-dropdown__list > li:hover {
                background: grey;
                color: white;
            }

                .albany-dropdown--white-grey > .albany-dropdown__list > li:hover > * {
                    background: grey;
                    color: white;
                }

/* color: action-call */
.albany-dropdown--action-call {
}

    .albany-dropdown--action-call > .albany-dropdown__btn, .albany-dropdown--action-call > .albany-dropdown__btn:visited {
        /* 80% saturation, 80% brightness */
        border: 2px solid #ca5f44;
        background: #ca5f44;
        color: white;
    }

        .albany-dropdown--action-call > .albany-dropdown__btn:hover {
            /* 50% saturation, 80% brightness */
            border: 2px solid #b26e5b;
            background: #b26e5b;
            color: white;
        }

        .albany-dropdown--action-call > .albany-dropdown__btn:hover {
            /* 50% saturation, 80% brightness */
            border: 2px solid #b26e5b;
            background: #b26e5b;
            color: white;
        }

        .albany-dropdown--action-call > .albany-dropdown__btn:active {
            /* 100% saturation, 60% brightness */
            border: 2px solid #c2492f;
            background: #c2492f;
            color: white;
        }

        .albany-dropdown--action-call > .albany-dropdown__btn:focus {
            /* border, 60% brightness */
            border: 2px solid #F15B3B;
            background: #c2492f;
            color: white;
        }

        .albany-dropdown--action-call > .albany-dropdown__btn:disabled {
            /* 50% saturation, 90% brightness */
            border: 2px solid #bd7460;
            background: #bd7460;
            color: white;
        }

    .albany-dropdown--action-call > .albany-dropdown__list,
    .albany-dropdown--action-call .albany-dropdown__child-list {
        background: white;
        border: 2px solid grey;
    }

        .albany-dropdown--action-call > .albany-dropdown__list > li,
        .albany-dropdown--action-call .albany-dropdown__child-list > li {
            background: white;
            color: black;
        }

            .albany-dropdown--action-call > .albany-dropdown__list > li > *,
            .albany-dropdown--action-call .albany-dropdown__child-list > li > * {
                background: white;
                color: black;
            }

            .albany-dropdown--action-call > .albany-dropdown__list > li:hover,
            .albany-dropdown--action-call .albany-dropdown__child-list > li:hover {
                background: #ca5f44;
                color: white;
            }

                .albany-dropdown--action-call > .albany-dropdown__list > li:hover > *:not(ul),
                .albany-dropdown--action-call .albany-dropdown__child-list > li:hover > *:not(ul) {
                    background: #ca5f44;
                    color: white;
                }

/* color: green-primary */
.albany-dropdown--green-primary {
}

    .albany-dropdown--green-primary > .albany-dropdown__btn, .albany-dropdown--green-primary > .albany-dropdown__btn:visited {
        /* 80%  saturation, 80% brightness */
        border: 2px solid #7CC142;
        background: #7CC142;
        color: white
    }

        .albany-dropdown--green-primary > .albany-dropdown__btn:hover {
            /* 50% saturation, 80% brightness */
            border: 2px solid #8aa770;
            background: #8aa770;
            color: white;
        }

        .albany-dropdown--green-primary > .albany-dropdown__btn:hover {
            /* 50% saturation, 80% brightness */
            border: 2px solid #8aa770;
            background: #8aa770;
            color: white;
        }

        .albany-dropdown--green-primary > .albany-dropdown__btn:active {
            /* 100% saturation, 60% brightness */
            border: 2px solid #649b35;
            background: #649b35;
            color: white;
        }

        .albany-dropdown--green-primary > .albany-dropdown__btn:focus {
            /* border, 60% brightness */
            border: 2px solid #649b35;
            background: #7cc142;
            color: white;
        }

        .albany-dropdown--green-primary > .albany-dropdown__btn:disabled {
            /* 50% saturation, 90% brightness */
            border: 2px solid #9ebc82;
            background: #9ebc82;
            color: white;
        }

    .albany-dropdown--green-primary > .albany-dropdown__list {
        background: white;
        border: 2px solid grey;
    }

        .albany-dropdown--green-primary > .albany-dropdown__list > li {
            background: white;
            color: black;
        }

            .albany-dropdown--green-primary > .albany-dropdown__list > li > * {
                background: white;
                color: black;
            }

            .albany-dropdown--green-primary > .albany-dropdown__list > li:hover {
                background: #7CC142;
                color: white;
            }

                .albany-dropdown--green-primary > .albany-dropdown__list > li:hover > * {
                    background: #7CC142;
                    color: white;
                }

/* Sliders */
.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
    float: right;
}

    .switch input {
        display: none;
    }

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: white;
    border: 2px solid #2270CC;
    -webkit-transition: .4s;
    transition: .4s;
}

    .slider:before {
        position: absolute;
        content: "";
        height: 24px;
        width: 24px;
        left: 3px;
        bottom: 3px;
        background-color: #2270CC;
        -webkit-transition: .4s;
        transition: .4s;
    }

.on {
    display: none;
    left: 28%;
    color: #2270CC
}

.off {
    color: #2270CC;
    left: 72%;
}

.on, .off {
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    font-size: 10px;
    font-family: Verdana, sans-serif;
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

    .slider.round:before {
        border-radius: 50%;
    }
/* End Toggle Button */