@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@200..1000&family=Jost:wght@400;700&display=swap');


.user-profile-image{width: 100px;height: 100px;object-fit: cover;}
.profile-img-file-input{display: none;}
.profile-photo-edit {cursor: pointer;position: relative;}
.profile-photo-edit .camera {    position: absolute;z-index: 99;
    bottom: 0;
    right: 10px;
    font-size: 24px;}

    .navbar-menu{    
                   background-image: linear-gradient(45deg, #354B25, rgb(63 136 103), #354B25) !important;

    }
    .navbar-menu .navbar-nav .nav-link,
    .menu-title span,
    .navbar-menu .navbar-nav .nav-link:hover,
    .navbar-menu .navbar-nav .nav-link[data-bs-toggle=collapse][aria-expanded=true]:after
    {color: #fff !important;}

    body{
        background-color: #110808;
        font-family: "Cairo", system-ui;
        text-transform: capitalize;
    }
    
    span.logo-lg img {
        width: 85px;
        height: auto;
    }
    
    input.color {
        width: 50px;
    height: 50px;
    padding: 5px;
    }
    .navbar-menu .navbar-nav .nav-sm .nav-link:before{
        background-color: #fff !important;
    }

    .color-circle{

    }

    .product-image-box{
        border: 4px dashed #d9d9d9;
    text-align: center;
    padding: 10px;
    cursor: pointer;
    position: relative;
    }
    .remove-image{
        position: absolute !important;
        top: 0;
        right: 0;
    }
    .remove-image i {
    font-size: 20px !important;
    color: #000 !important;
    }
    .product-image-box:hover{
        background: #f1f1f1;
    }
    .product-image-box i {
        font-size: 47px;
    color: #919191;
    }
    .product-image-box p {
        font-size: 25px;
    }
    .product-image-box img {
        border-radius: 10px;
        max-width:100%;
        width: 200px;
        
    }

    .standard-type{text-align: center;vertical-align: middle;}

    
    .navbar-menu .navbar-nav .nav-link i {
            font-size: 21px !important;
    }

    .navbar-menu .navbar-nav .nav-link {
    padding: 0.8rem 1rem !important;
    font-family: unset !important;
    margin: 1px 1rem;
    }
    :is(.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6) {
    font-family: unset !important;
}

    .navbar-menu .navbar-nav .nav-sm {
        padding: 0 1rem !important;
    }

    .navbar-menu .navbar-nav .nav-sm .nav-link.active , .navbar-menu .navbar-nav .nav-link.active{
        background: #7CAD58;
        border-radius: 10px;
    }

    .navbar-menu .navbar-nav .nav-link svg{
        color:  #fff !important;
    }

    body[lang="ar"], html[lang="ar"] {
    font-family: "Cairo", system-ui !important;
}
body[lang="en"], html[lang="en"] {
    font-family: "Jost", system-ui !important;
}
.spinner-grow-sm{width: 20px;height: 20px;}

.dot{
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: block;
}

.login-bg{
    background: rgba(255, 255, 255, 0.8) !important;
}

.auth-page-wrapper{
    position: relative;
    height: 100vh;
    min-height: 100vh;
}

.auth-page-wrapper .cover-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.avatar-lg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}