/* -----------------------------------------------------------------
    - General Styles
----------------------------------------------------------------- */
:root {
    /* colors */
    --primary: #ff994e;
    --primary-color-soft: #ff994e33;
    --background-color: #272333;
    --text-color: #DEDDE0;
    --box-background-color: #615a79;
    --tab-background-color: #302C40;
    --white: #ffffff;
}

@media only screen and (max-width: 991px) {
    .nav-container {
        background: rgba(48, 43, 64, 0.75);
    }
}

.input,
.textarea,
select,
.custom-select {
    background-color: #2C283A;
    border: 1px solid #2C283A;
    color: #fff;
}

.input:focus,
.textarea:focus,
select:focus,
.custom-select:focus {
    background-color: #272333;
    border: 1px solid #0D86FF;
    color: #fff;
}

.input--white {
    background-color: #2C283A;
}

.input--white:focus {
    background-color: #2C283A;
}

.textarea--white {
    background-color: #2C283A;
}

.textarea--white:focus {
    background-color: #2C283A;
}

.form-group .font-icon {
    color: rgba(222, 221, 224, 0.5);
}

.form-control::-webkit-input-placeholder {
    color: rgba(222, 221, 224, 0.5);
}

.form-control::-moz-placeholder {
    color: rgba(222, 221, 224, 0.5);
}

.form-control:-ms-input-placeholder {
    color: rgba(222, 221, 224, 0.5);
}

.form-control::-ms-input-placeholder {
    color: rgba(222, 221, 224, 0.5);
}

.form-control::placeholder {
    color: rgba(222, 221, 224, 0.5);
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-text-fill-color: #2C283A !important;
}

.custom-control-input:focus~.custom-control-label::before {
    box-shadow: 0 0 0 0.125rem rgba(13, 134, 255, 0.25);
}

.custom-control-input:focus:not(:checked)~.custom-control-label::before {
    border-color: #0D86FF;
}

.custom-control-input:not(:disabled):active~.custom-control-label::before {
    border-color: #8697A8;
}

.custom-control-input:checked~.custom-control-label::before {
    border-color: #0D86FF;
    background-color: #0D86FF;
}

.custom-control-label::before {
    border: 1px solid #8697A8;
}

select,
.custom-select {
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3e%3cpath fill='%23fff' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.1rem center/10px 16px;
}

select option,
.custom-select option {
    color: #fff;
}

.dropdown-menu {
    background-color: #302C40;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.5);
    color: #DEDDE0;
}

.dropdown-menu::before {
    border-bottom: 0.4rem solid #302C40;
}

.dropdown.dropup .dropdown-menu::before {
    border-top: 0.4rem solid #302C40;
}

.progress {
    background-color: #302C40;
}

.progress-bar {
    background-color: #0D86FF;
}

.badge--blue {
    background-color: #0D86FF;
}

.badge--dark {
    background-color: #272333;
}

.tooltip-inner {
    background-color: #302C40;
    box-shadow: 0px 16px 48px rgba(0, 0, 0, 0.25), 0px 2px 32px rgba(0, 0, 0, 0.5);
}

.bs-tooltip-top .arrow::before,
.bs-tooltip-auto[x-placement^="top"] .arrow::before {
    border-top-color: #302C40;
}

.bs-tooltip-right .arrow::before,
.bs-tooltip-auto[x-placement^="right"] .arrow::before {
    border-right-color: #302C40;
}

.bs-tooltip-left .arrow::before,
.bs-tooltip-auto[x-placement^="left"] .arrow::before {
    border-left-color: #302C40;
}

.bs-tooltip-bottom .arrow::before,
.bs-tooltip-auto[x-placement^="bottom"] .arrow::before {
    border-bottom-color: #302C40;
}


/* -----------------------------------------------------------------
    - Sections
----------------------------------------------------------------- */
.box {
    background-color: var(--tab-background-color);
}

.box__second {
    background-color: #2C283A;
    box-shadow: unset;
}

.box-inner {
    background-color: transparent;
}

.box-inner::before,
.box-inner::after {
    background-color: transparent;
}

.shadow {
    box-shadow: 0px 40px 50px rgba(32, 29, 42, 0.75) !important;
}

.shadow::before {
    box-shadow: 0px 40px 50px rgba(32, 29, 42, 0.75);
}

.social__link {
    color: #fff;
}