/*!
 * SmartWizard v4.3.x
 * jQuery Wizard Plugin
 * http://www.techlaboratory.net/smartwizard
 *
 * Created by Dipu Raj
 * http://dipuraj.me
 *
 * Licensed under the terms of MIT License
 * https://github.com/techlab/SmartWizard/blob/master/LICENSE
 */

/* SmartWizard Theme: Arrows */

.sw-theme-arrows {
    border-radius: 5px;
    border: 1px solid #eaeaec;

    >.sw-container {
        min-height: 200px;
    }

    .step-content {
        padding: 15px;
        border: 0px solid #eaeaec;
        background-color: #FFF;
        text-align: left;
    }

    .sw-toolbar {
        padding: 10px;
        margin-bottom: 0 !important;
    }

    > {

        .sw-toolbar-top,
        .sw-toolbar-bottom {}

        ul.step-anchor {
            border: 0;
            border-bottom: 1px solid #eaeaec;
            padding: 0px;
            background: #fff;
            border-radius: 0;
            border-top-right-radius: 5px;
            list-style: none;
            overflow: hidden;

            li+li:before {
                padding: 0;
            }

            >li {
                >a {
                    color: #5d5f61;
                    text-decoration: none;
                    padding: 10px 0 10px 45px;
                    position: relative;
                    display: block;
                    border: 0 !important;
                    border-radius: 0;
                    outline-style: none;
                    background: #f4f5f5;

                    &:hover {
                        color: #5d5f61;
                        text-decoration: none;
                        padding: 10px 0 10px 45px;
                        position: relative;
                        display: block;
                        border: 0 !important;
                        border-radius: 0;
                        outline-style: none;
                        background: #f4f5f5;
                    }

                    &:after {
                        content: " ";
                        display: block;
                        width: 0;
                        height: 0;
                        border-top: 50px solid transparent;
                        border-bottom: 50px solid transparent;
                        border-left: 30px solid #f4f5f5;
                        position: absolute;
                        top: 50%;
                        margin-top: -50px;
                        left: 100%;
                        z-index: 2;
                    }

                    &:before {
                        content: " ";
                        display: block;
                        width: 0;
                        height: 0;
                        border-top: 50px solid transparent;

                        /* Go big on the size, and let overflow hide */
                        border-bottom: 50px solid transparent;
                        border-left: 30px solid #dbdef1;
                        position: absolute;
                        top: 50%;
                        margin-top: -50px;
                        margin-left: 1px;
                        left: 100%;
                        z-index: 1;
                    }
                }

                &:first-child>a {
                    padding-left: 15px;
                }

                >a {
                    &:hover {
                        color: #5d5f61;
                        text-decoration: none;
                        outline-style: none;
                        background: #f4f5f5;
                        border-color: #f4f5f5;

                        &:after {
                            border-left-color: #f4f5f5;
                        }
                    }

                    small {}
                }

                &.clickable>a:hover {
                    color: #4285F4 !important;
                    background: #46b8da !important;
                }

                &.active>a {
                    border-color: #7673e6 !important;
                    color: #fff !important;
                    background: #7673e6 !important;

                    &:after {
                        border-left: 30px solid #7673e6 !important;
                    }
                }

                &.done>a {
                    border-color: #f4f5f5 !important;

                    /*  #7673e6*/
                    color: #5d5f61 !important;
                    background: #f4f5f5 !important;

                    &:after {
                        border-left: 30px solid #f4f5f5;

                        /* c3e6cb */
                    }
                }

                &.danger>a {
                    border-color: #d9534f !important;
                    color: #fff !important;
                    background: #d9534f !important;

                    &:after {
                        border-left: 30px solid #d9534f !important;
                    }
                }

                &.disabled>a {
                    color: #eee !important;

                    &:hover {
                        color: #eee !important;
                    }
                }
            }
        }
    }

    &::before {
        border: 10px solid #f3f3f3;
        border-top: 10px solid #7673e6;
    }
}

/* Responsive CSS */
@media screen and (max-width: 768px) {
    .sw-theme-arrows> {
        ul.step-anchor {
            border: 0;
            background: #fff !important;
        }

        .nav-tabs>li {
            float: none !important;
            margin-bottom: 0;
        }
    }
}

@media screen and (max-width: 480px) {
    .sw-theme-arrows> {
        ul.step-anchor {
            border: 0;
            background: #eaeaec !important;
        }

        .nav-tabs>li {
            float: none !important;
            margin-bottom: 0;
        }

        ul.step-anchor>li>a {
            padding-left: 15px;
            margin-right: 0;
            margin-bottom: 1px;

            &:hover {
                padding-left: 15px;
                margin-right: 0;
                margin-bottom: 1px;
            }

            &:after,
            &:before {
                display: none;
            }
        }
    }
}

/* Loader Custom Style */