﻿* {
    font-family: "Vazirmatn FD";
    font-size: 13px;
}

/* Load Screen */
.ssd-spinner-screen1,
.ssd-spinner-screen2 {
    border: 12px solid #f3f3f3;
    border-top: 12px solid #0061a6;
    border-radius: 50%;
    animation: spin 2s linear infinite;
    width: 130px;
    height: 130px;
    position: absolute;
}

.ssd-spinner-screen1 {
    top: 35px;
    left: calc((100vw / 2) - 65px);
}

.ssd-spinner-screen2 {
    top: calc(40% - 65px);
    left: calc(50% - 65px);
}

.ssd-logo-screen {
    position: absolute;
    top: 50px;
    width: 100px;
    height: 100px;
    left: calc((100vw / 2) - 50px);
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* Layout */
.ssd-container {
    width: 100%;
    height: 100vh;
}

    .ssd-container.ssd-theme-light {
        background: rgb(0,151,217);
        background: radial-gradient(circle, rgba(0,151,217,1) 0%, rgba(118, 157, 203,1) 100%);
    }

    .ssd-container.ssd-theme-dark {
        background: rgba(65,78,94);
        background: linear-gradient(circle, rgba(65,78,94,1) 0%, rgb(105, 118, 134) 100%);
    }

/* Input */
.ssd-input {
    border-radius: 3px;
    margin-left: 0 !important;
}

    .ssd-input:focus {
        outline: none !important;
        box-shadow: none !important;
    }

    .ssd-input.ssd-theme-light {
        color: black;
        background-color: white;
    }

        .ssd-input.ssd-theme-light.ssd-input-normal {
            border: 1px #d9d9d9 solid;
        }

            .ssd-input.ssd-theme-light.ssd-input-normal:hover {
                border-color: #bfbfbf !important;
            }

            .ssd-input.ssd-theme-light.ssd-input-normal:focus {
                border-color: #258cfb !important;
            }

        .ssd-input.ssd-theme-light.ssd-input-error {
            border: 1px #e60000 solid;
        }

            .ssd-input.ssd-theme-light.ssd-input-error:hover {
                border-color: #ff3333 !important;
            }

            .ssd-input.ssd-theme-light.ssd-input-error:focus {
                border-color: #ff00bf !important;
            }

    .ssd-input.ssd-theme-dark {
        color: white;
        background-color: #798696;
    }

        .ssd-input.ssd-theme-dark::placeholder {
            color: lightgray;
        }

        .ssd-input.ssd-theme-dark.ssd-input-normal {
            border: 1px cornflowerblue solid;
        }

            .ssd-input.ssd-theme-dark.ssd-input-normal:hover {
                border-color: #d2d2d2;
            }

            .ssd-input.ssd-theme-dark.ssd-input-normal:focus {
                border-color: white !important;
            }

        .ssd-input.ssd-theme-dark.ssd-input-error {
            border: 1px #ffaa00 solid;
        }

            .ssd-input.ssd-theme-dark.ssd-input-error:hover {
                border-color: #ffcc00 !important;
            }

            .ssd-input.ssd-theme-dark.ssd-input-error:focus {
                border-color: #ffff00 !important;
            }

.ssd-input-disabled {
    color: gray;
    background-color: #f2f2f2;
}

.ssd-input-bold {
    font-weight: bolder;
}

.ssd-input::placeholder {
    opacity: 0.6;
    font-size: 95%;
}

/* Div */
div .ssd-theme-dark {
    scrollbar-color: #798696 #495666;
}
