/* NOT INPUT-SPECIFIC */

label {
    font-family: Poppins, sans-serif;
    font-size: 18px;
    line-height: 1.56;
    color: #3c3c3c;
}

input {
    border-radius: 5px;
    border: solid 1px #bcbcbc;
}

::placeholder {
    color: #bcbcbc;
}

/* SELECTS */

.custom-select {
    box-shadow: none;
    color: #3c3c3c;
    background: url("../img/arrow_down-black.svg") no-repeat right .5rem center/20px;
}

:not(.form-control).custom-select {
    border: none;
}

.custom-select.filter:not(.default),
.custom-select.filter:focus:not(.default),
.custom-select.filter:active:not(.default) {
    transition: none;
    color: #eb5f24;
}

option.filter {
    color: #eb5f24;
}

option[value='default'].filter {
    color: #3c3c3c;
}

/* TEXTAREA */

textarea {
    resize: none;
}

textarea.form-control {
    resize: vertical;
}

/* TOGGLES */

.switch {
    position: relative;
    display: inline-block;
    width: 30px;
    height: 15px;
    margin-left: 30px;
}

.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

:disabled ~ .slider {
    cursor: default;
}

.slider:before {
    position: absolute;
    content: "";
    height: 60%;
    width: 30%;
    left: 15%;
    bottom: 20%;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked + .slider {
    background-color: #eb5f24;
}

input:focus + .slider {
    box-shadow: 0 0 1px #eb5f24;
}

input:checked + .slider:before {
    -webkit-transform: translateX(125%);
    -ms-transform: translateX(125%);
    transform: translateX(125%);
}

/* ROUNDED TOGGLES */

.slider.round {
    border-radius: 34px;
}

.slider.round:before {
    border-radius: 100%;
}

/* FILE UPLOAD */

.custom-file-label {
    border-radius: 5px;
    background-color: #bcbcbc;
    color: white;
    text-align: center;
}

.custom-file-label::after {
    display: none;
}

/* VALIDATION */
.was-validated .custom-file-input.is-invalid:valid ~ .custom-file-label {
    border-color: #dc3545;
}

.was-validated .form-control.is-invalid:valid {
    border-color: #dc3545;
    padding-right: calc(1.5em + .75rem);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(.375em + .1875rem) center;
    background-size: calc(.75em + .375rem) calc(.75em + .375rem);
}

/* valid on client, invalid on server = invalid */
.was-validated .is-invalid:valid ~ .valid-feedback {
    display: none;
}

tr.is-invalid {
    color: #dc3545 !important;
    animation: shake 0.5s;
}

@keyframes shake {
    0% {
        transform: translate(1px, 1px) rotate(0deg);
    }
    10% {
        transform: translate(-1px, -2px) rotate(-1deg);
    }
    20% {
        transform: translate(-3px, 0px) rotate(1deg);
    }
    30% {
        transform: translate(3px, 2px) rotate(0deg);
    }
    40% {
        transform: translate(1px, -1px) rotate(1deg);
    }
    50% {
        transform: translate(-1px, 2px) rotate(-1deg);
    }
    60% {
        transform: translate(-3px, 1px) rotate(0deg);
    }
    70% {
        transform: translate(3px, 1px) rotate(-1deg);
    }
    80% {
        transform: translate(-1px, -1px) rotate(1deg);
    }
    90% {
        transform: translate(1px, 2px) rotate(0deg);
    }
    100% {
        transform: translate(1px, -2px) rotate(-1deg);
    }
}