/* Start importing fonts */
@font-face {
    font-family: iranyekan-regular;
    src: url("../fonts/iranyekan/iranyekanwebregular.woff");
}

@font-face {
    font-family: "iranSansWeb";
    src: url(../fonts/iransans/IRANSansWeb.woff)
}
/* End importing fonts */

.persianFontYekan {
    font-family: iranyekan-regular !important;
}

.persianFontSans {
    font-family: iranSansWeb !important;
}

.appBarPortalTitle {
    margin-right: -5px !important;
}

.appBarCommandsContainer {
    display: flex !important;
    justify-content: end;
    padding: 0;
    margin-left: -20px !important;
    width: auto;
}

.appBarLogoIconButton {
    margin-left: -15px;
}

.appBarLogoText {
    width: 120px;
}

.appBarLogo {
    width: 32px;
}

.header {
    font-size: small !important;
    font-weight: bold !important;
}

.cell{
    font-size: smaller !important;
}

.noContent{
    color: gray !important;
}

.fieldLabel {
    font-size: small !important;
    font-weight: bold;
}

.fieldData {
    font-size: small !important;
}

.error {
    color: #ff4081ff !important;
}

.dashboardBox1 {
    position: relative;
    color: white !important;
    background-color: #5FD068 !important;    
}

.dashboardBox1::before {
    content: "";
    background-image: url('../img/timer2.png') !important;
    background-repeat: no-repeat !important;
    position: absolute;
    top: 30%;
    right: 0px;
    bottom: 0px;
    left: 63%;
    opacity: 1 !important;
    background-size: 85%;
}

.dashboardBox2 {
    position: relative;
    color: white !important;
    background-color: #3AB4F2 !important;
}

.dashboardBox2::before {
    content: "";
    background-image: url('../img/schedule3.png') !important;
    background-repeat: no-repeat !important;
    position: absolute;
    top: 34%;
    right: 0px;
    bottom: 0px;
    left: 63%;
    opacity: 1 !important;
    background-size: 75%;
}

.dashboardBox3 {
    position: relative;
    color: white !important;
    background-color: #FEB139 !important;
}

.dashboardBox3::before {
    content: "";
    background-image: url('../img/schedule5.png') !important;
    background-repeat: no-repeat !important;
    position: absolute;
    top: 37%;
    right: 0px;
    bottom: 0px;
    left: 66%;
    opacity: 1 !important;
    background-size: 78%;
}

.mainContainer {
    min-height: 85vh !important;
    max-width: 100% !important;
    padding-top: 20px;
}

.footerItem {
    display: block !important;
    margin: auto !important;
}

.footer {
    color: #FFFFFF !important;
    text-decoration: none !important;
}

.btn-login {
    background-color: #C3223B !important;
}

@media (max-width: 480px) {

    .persianFontSans {
        font-family: iranSansWeb !important;
        font-size: smaller;
    }

    .appBarPortalTitle {
        display: none;
    }

    .appBarLogoText {
        width: 100px;
        margin-left: -2px !important;
    }

    .appBarLogo {
        width: 28px;
    }

    .appBarLogoIconButton{
        display:none !important;
    }
}

/* Start Override MudBlazor Styles */
.mud-typography-body1 {
    font-family: inherit !important;
}

.mud-switch .mud-typography-body1 {
    font-family: iranSansWeb !important;
}

.mud-menu .mud-button {
    color: white;
}

.mud-list-item-text .mud-typography-body1 {
    font-family: inherit;
    font-size: small;
}

.mud-button-label .mud-button-icon-start {
    margin-inline-end: 2px;
}

.mud-button-label .mud-button-icon-end {
    margin-inline-start: 2px;
}

.mud-menu .mud-button {
    font-family: inherit;
    font-size: small;
}

.mud-popover {
    left: 0px;
}

.mud-popover .mud-popover-top-center .mud-popover-anchor-bottom-center {
    left: inherit !important;
}

.leftToRightInput .mud-input-control-input-container .mud-input input {
    direction: ltr !important;
}

.column-header .sortable-column-header {
    font-weight: bolder !important;
}
/* End Override MudBlazor Styles */
/* Start Animation Keyframes for Button */
@keyframes btn-back-pulse {
    50% {
        background-color: rgba(32, 152, 209, 0.75);
    }
}

@keyframes btn-icon-buzz-out {
    10% {
        transform: translateX(3px) rotate(2deg);
    }

    20% {
        transform: translateX(-3px) rotate(-2deg);
    }

    30% {
        transform: translateX(3px) rotate(2deg);
    }

    40% {
        transform: translateX(-3px) rotate(-2deg);
    }

    50% {
        transform: translateX(2px) rotate(1deg);
    }

    60% {
        transform: translateX(-2px) rotate(-1deg);
    }

    70% {
        transform: translateX(2px) rotate(1deg);
    }

    80% {
        transform: translateX(-2px) rotate(-1deg);
    }

    90% {
        transform: translateX(1px) rotate(0);
    }

    100% {
        transform: translateX(-1px) rotate(0);
    }
}
/* End Animation Keyframes for Button */

/* Start Css Reset styles */
* {
    box-sizing: border-box;
    font-size: 14px;
}

textarea {
    resize: none;
}
/* End Css Reset styles */

/* Start Rtl styles */
input,
textarea,
select,
form .row {
    direction: rtl;
}
/* End Rtl styles */

/* Start Signup Section styles */
.custom-signup-page {
    background: url("../img/iranhealth-back.png") no-repeat center center;
    background-size: cover;
    font-family: iranSansWeb !important;
}

.custom-signup-page .signup-page-wrapper {
    border-radius: 15px;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
    max-width: 861px;
    transform: translateX(47px);
}

.custom-signup-page .signup-page-wrapper .signup-page-image img {
    border-radius: 15px;
    transform: translateX(-94px);
}

.custom-signup-page .signup-page-wrapper .signup-page-form {
    transform: translateX(-34px);
}
/* End Signup Section styles */

/* Start Custom Form and button styles */
.custom-signup-page .signup-page-wrapper .signup-page-form .form-control {
    height: 47px;
    display: block;
    border: 1px solid #e6e6e6;
    background: 0 0;
    border-radius: 5px;
    padding: 0 9px;
}

.custom-signup-page .signup-page-wrapper .signup-page-form .form-control:focus {
    border: 1px solid #f4d5cc;
    box-shadow: none;
}

.custom-signup-page .signup-page-wrapper .signup-page-form .form-control::-webkit-input-placeholder {
    color: #999;
}

.custom-signup-page .signup-page-wrapper .signup-page-form .form-control::-moz-placeholder {
    color: #999;
}

.custom-signup-page .signup-page-wrapper .signup-page-form .form-control:-ms-input-placeholder {
    color: #999;
}

.custom-signup-page .signup-page-wrapper .signup-page-form .form-control:-moz-placeholder {
    color: #999;
}

.custom-signup-page .signup-page-wrapper .signup-page-form select.form-control {
    cursor: pointer;
    color: #999;
}

.custom-signup-page .signup-page-wrapper .signup-page-form textarea.form-control {
    width: 100%;
    padding-top: 13px;
    padding-bottom: 13px;
    height: auto;
}

.custom-signup-page .signup-page-wrapper .signup-page-form button {
    height: 47px;
    width: 100%;
    color: #fff;
    cursor: pointer;
    background: #84cde1;
    border: none !important;
    border-radius: 5px !important;
    transition-duration: 0.5s;
    transition-property: color, background-color;
}

.custom-signup-page .signup-page-wrapper .signup-page-form button:hover {
    -webkit-animation-name: btn-back-pulse;
    animation-name: btn-back-pulse;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    background-color: #17c8f8;
    color: #fff;
}

.custom-signup-page .signup-page-wrapper .signup-page-form button:hover i svg {
    -webkit-animation-name: btn-icon-buzz-out;
    animation-name: btn-icon-buzz-out;
    -webkit-animation-duration: 0.75s;
    animation-duration: 0.75s;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
/* End Custom Form and button styles */

/* Start Media Queries changing styles */
@media (max-width: 991px) {
    .custom-signup-page .signup-page-wrapper {
        min-width: auto;
        max-width: 665px;
    }
}

@media (max-width: 767px) {
    .custom-signup-page .signup-page-wrapper {
        transform: translateX(0);
        border-radius: 0;
        box-shadow: none;
    }

        .custom-signup-page .signup-page-wrapper .signup-page-image img {
            transform: translateX(0);
            border-radius: 0;
        }

        .custom-signup-page .signup-page-wrapper .signup-page-form {
            transform: translateX(0);
        }

    .custom-signup-page {
        background: none;
    }
}
/* End Media Queries changing styles */

.signupTitle {
    font-size: smaller;
}