@import url('bootstrap.rtl.min.css');
@import url('bootstrap-grid.rtl.min.css');
@import url('bootstrap-reboot.rtl.min.css');
@import url('bootstrap-utilities.rtl.min.css');
@import url('jquery-confirm.min.css');
@import url('persiandatepicker-default.css');


@font-face {
    font-family: 'yekanExtraBold';
    src: url('../fonts/iranyekanwebextrabold.ttf') format('truetype');
}

@font-face {
    font-family: 'yekanBold';
    src: url('../fonts/iranyekanwebbold.ttf') format('truetype');
}

@font-face {
    font-family: 'yekanMedium';
    src: url('../fonts/iranyekanwebmedium.ttf') format('truetype');
}

@font-face {
    font-family: 'yekanLight';
    src: url('../fonts/iranyekanweblight.ttf') format('truetype');
}

:root {
    --color-1: #F8F9FA;
    --color-2: #E9ECEF;
    --color-3: #DEE2E6;
    --color-4: #CED4DA;
    --color-5: #ADB5BD;
    --color-6: #6C757D;
    --color-7: #495057;
    --color-8: #343A40;
    --color-9: #212529;
}

body {
    background-color: var(--color-1);
    direction: rtl;
    text-align: right;
    color: var(--color-8) !important;
    font-family: yekanLight
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 .text-Titr {
    font-family: yekanBold !important
}

button, input, .text-light {
    font-family: yekanLight
}

.navbar-my {
    background-color: white;
    position: fixed;
    top: 0;
    width: 100vw;
    display: flex;
    align-items: center;
    justify-content: center;
    justify-items: stretch;
    flex-wrap: nowrap;
    border-bottom: 1px solid #eee;
    z-index: 9999;
    height:70px;
}

    .navbar-my p {
        line-height: 1;
    }

    .navbar-my span {
        white-space: nowrap
    }

    .navbar-my div:not(.banner) {
        padding: 15px 35px;
    }

    .navbar-my .banner {
        width: 60%
    }

        .navbar-my .banner img {
            height: 65px;
            float: right
        }

    .navbar-my .navbar-item {
        font-size: 13px;
        font-weight: 400;
        text-decoration: none;
        text-align: center
    }

        .navbar-my .navbar-item img {
            width: 30px;
            clear: both;
            display: block;
            margin: 2px auto
        }

.main-body {
    margin-top: 70px
}

.text-yellow {
    color: var(--bs-yellow) !important
}

.grayscale-hoverable, .grayscale-100 {
    filter: grayscale(1);
    transition: all .3s ease-in-out;
}

.grayscale-85 {
    filter: grayscale(.85);
}

.grayscale-hoverable:hover {
    filter: grayscale(0)
}

.validation-summary-errors {
    list-style: none;
    color: red
}

.lineheight40 {
    line-height: 40px !important
}

.machine-card {
    font-weight: 700;
    font-size: 16px;
    text-align: center;
    color: #050505;
    margin: 6px;
}

    .machine-card .cell {
        padding: 8px;
        display: inline-block;
        border-top: 3px solid black;
        border-bottom: 3px solid black;
        margin: -4px !important;
        background-color: white;
    }

        .machine-card .cell:first-child {
            border-right: 3px solid black;
            border-radius: 0 5px 5px 0;
            border-left: 3px solid black
        }

        .machine-card .cell:last-child {
            border-left: 3px solid black;
            border-radius: 5px 0 0 5px;
        }

.btn-call {
    position: absolute;
    top: 1px
}

.show-in-mobile {
    display: none;
}

.hide-in-moble {
    display: inline-block
}

.user-menu {
    display: none;
    position: absolute;
    background-color: white;
    width: 200px;
    padding: 0 !important;
    margin: 0;
    margin-top: 9px;
    border: 1px solid #e9e9e9;
    border-radius: 3px;
    overflow: hidden;
    box-shadow: #edeeef 3px 3px 3px;
}

    .user-menu.show {
        display: grid !important
    }

    .user-menu .user-menu-link {
        padding: 6px 12px;
        text-align: right;
        text-decoration: none;
        transition: all ease-in .3s
    }

        .user-menu .user-menu-link:hover {
            background-color: #e9e9e9;
        }

        .user-menu .user-menu-link:last-child:hover {
            background-color: var(--bs-danger);
            color: white !important
        }
.search-userimage{
    display:inline-block;
    border-radius:50%;
    border: 2px solid var(--bs-success);
    padding:2px;
    width:50px;
    height:50px;
    float:right
}

a {
    text-underline-offset: 7px;
}

.desktop-icon {
    display: block;
    z-index: 1;
    position: fixed;
    width: 100%;
    bottom: 0;
}
    .desktop-icon .dk-container {
        display: block;
        width:100%;
        max-width:700px;
        background-color:white;
        border:1px solid var(--color-4);
        border-radius:8px;
        padding:3px;
        margin:0 auto;
    }
.tr-row.hoverable {
    -moz-transition: .1s all ease-in;
    -o-transition: .1s all ease-in;
    -webkit-transition: .1s all ease-in;
    transition: .1s all ease-in;
}
.tr-row.hoverable:hover{
    background-color:#f5f5f5;
}

@media (max-width:575px) { /*xs*/
    .navbar-my div:not(.banner) {
        padding: 15px 20px
    }

    .navbar-my p {
        white-space: nowrap;
    }

    .navbar-my span {
        font-size: 10px
    }

    .navbar-my div:is(.banner) span {
        display: none
    }

    .grayscale-hoverable {
        filter: grayscale(0);
    }

    .w-xs-50 {
        width: 50% !important
    }

    .show-in-mobile {
        display: inline-block
    }

    .hide-in-moble {
        display: none
    }
    .user-menu{
        left:10px;
    }
}

@media (min-width:576px) { /*sm*/

}

@media (min-width:768px) { /*md*/

}

@media (min-width:992px) { /*lg*/

}

@media (min-width:1200px) { /*xl*/

}

@media (min-width:1400px) { /*xxl*/

}