﻿:root {
    --green: #06D001;
    --light-green: #dff3b1;
    --dar-green: 0;
    --gray: #F8FAFC;
    --border-color: #eef2f7;
}


input[type="checkbox"] {
    --primary-color: var(--green);
}
.btn-green {
    background: transparent;
    border: 1px solid #00000061;
    display: flex;
    width: max-content;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    gap: 7px;
    font-size: 13px;
    cursor: pointer;
    background: var(--green);
    border-color: var(--green);
    color: var(--white);
    padding: 11px 17px;
}

    .btn-green > i {
        color: var(--white);
    }


/*#region car-nav*/

#car-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 30px;
    user-select: none;
}

    #car-nav > div {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 7px;
        font-size: 13px;
        white-space: nowrap;
    }

        #car-nav > div > div {
            background: var(--white);
            border: var(--border);
            border-radius: 50%;
            height: 35px;
            width: 35px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

            #car-nav > div > div > i {
            }

    #car-nav > span {
        height: 3px;
        width: 100%;
        background: var(--btn-gray);
    }

        #car-nav > span.active {
            background: var(--green);
        }

    #car-nav > div > div.check {
        background: var(--green);
        color: var(--white);
        border-color: var(--green);
    }

        #car-nav > div > div.check > i {
            color: var(--white);
        }

/*#endregion*/

@media(max-width:1400px) {
}

@media(max-width:1200px) {
}

@media(max-width:992px) {
}

@media(max-width:768px) {
    #car-nav > div {
        font-size: 10px;
    }

        #car-nav > div > div {
            height: 28px;
            width: 28px;
        }

    #car-nav > span {
        height: 2px;
    }
}

@media(max-width:576px) {
}
