﻿@font-face {
    font-family: 'arabic';
    src: url('/fonts/arabic/arabic.ttf') format('truetype');
    unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF; 
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url('/fonts/English/Roboto.ttf') format('truetype');
    unicode-range: U+0000-00FF; 
    font-weight: normal;
    font-style: normal;
}

body, html, h1, h2, h3, h4, h5, h6, p, span, div, a, li, ul, button, input, textarea {
    font-family: 'arabic', 'Roboto', sans-serif !important;
}

/* header */
 .header-text {
    font-size: medium; /* Change it to the desired font size */
}

/* Applying large font size on md screens and above */
@media (min-width: 1400px) {
    .header-text {
        font-size: large;
    }
}

.articles .container .box i {
    right: unset;
    left: 20px;
    padding-right: unset;
    padding-left: 20px;
    transform: rotateY(180deg);
}
.articles .container .box:hover i {
    animation: icon-move-left 0.6s linear infinite;
}
#aboutImage {
    transform: unset !important;
}
@keyframes icon-move-left {
    0%, 100% {
        left: 20px;
    }

    85% {
        left: 10px;
    }
}
/* TimeLine */
.timeline-item-outer {
    border-left: 0 !important;
    border-right: 5px solid #782121;
}
.timeline-time {
    left: unset !important;
    right: -65px;
}
.timeline-item {
    padding: 20px 75px 20px 0 !important;
}
@media (max-width: 767px) {
    .timeline-time {
        right: 0;
        margin-top: -75px;
    }
}
#clearDateRangeFrom,
#clearDateRangeTo {
    right: unset !important;
    left: 5px !important;
}
.daterangepicker {
    direction: rtl;
}
.drp-calendar.left{
    float: right
}
.drp-calendar.right {
    float: left
}
/* from */
.form-floating label
{
    right: 0 !important;
}
.form-check .form-check-input {
    float: right;
}
.form-check .form-check-label {
    margin: 0 !important;
    margin-right: 30px !important;
}
.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label {
    color: rgb(33 37 41 / 33%);
    transform: scale(.98) translateY(-14px) translateX(-20px) !important;
    width: fit-content;
}
#DNTCaptchaInputText {
    direction: rtl;
}
.form-control.is-invalid,
.form-control.is-valid {
    background-position: unset;
    background-position: left calc(.375em + .1875rem) center;
}
.add-book{
    text-align: left !important;
}
.bootbox-close-button {
   right: unset;
   left: 0 
}
#DataTable_wrapper > .row:first-child {
    flex-direction: row-reverse;
}

    #DataTable_wrapper > .row:first-child > div:first-child {
        text-align: end;
    }

    .fonts{
        text-align: right !important;
    }

.navHeader {
    margin-left: 4px !important;
    margin-right: 4px !important;
    font-size: 19px !important;
}
.navHeader .dropdown-item {
        text-align: right;
}
.Mmenue {
    text-align: right;
}

.navbar .nav-item .nav-link {
    padding-left: 6px !important;
    padding-right: 6px !important;
}

#navbar_top {
    max-height: none !important;
    overflow: visible !important;
}

.nav-item img{
    margin-left: -6px;
    margin-right: unset;
}
.nav-item {
    padding-left: 7px !important;
    padding-right: 7px !important;
}
/* =========================================
   RTL HEADER MOBILE FIX
   Put this at the END of site.rtl.css
   ========================================= */

/* إلغاء قص الهيدر */
#navbar_top {
    max-height: none !important;
    overflow: visible !important;
}

/* ديسكتوب: الهيدر يفضل أفقي */
@media (min-width: 992px) {
    #navbar_top .navbar-nav,
    #navbar_top .navHeader,
    #navbar_top .navbar-collapse {
        flex-wrap: nowrap !important;
        white-space: nowrap !important;
    }
}

/* موبايل: رجوع سلوك Bootstrap الطبيعي */
@media (max-width: 991.98px) {

    #navbar_top,
    #navbar_top .navbar,
    #navbar_top .container,
    #navbar_top .container-fluid,
    #navbar_top .row {
        overflow: visible !important;
        max-height: none !important;
        height: auto !important;
    }

        /* collapse مقفولة */
        #navbar_top .navbar-collapse:not(.show) {
            display: none !important;
        }

        /* collapse مفتوحة */
        #navbar_top .navbar-collapse.show {
            display: block !important;
            width: 100%;
            max-height: calc(100vh - 90px) !important;
            overflow-y: auto !important;
            overflow-x: hidden !important;
            -webkit-overflow-scrolling: touch;
            background: #fff;
            padding-bottom: 12px;
        }

        /* أثناء الفتح */
        #navbar_top .navbar-collapse.collapsing {
            max-height: calc(100vh - 90px) !important;
            overflow-y: auto !important;
            overflow-x: hidden !important;
        }

        /* القائمة عمودية في الموبايل */
        #navbar_top .navbar-nav,
        #navbar_top .navHeader {
            display: flex !important;
            flex-direction: column !important;
            align-items: stretch !important;
            flex-wrap: nowrap !important;
            width: 100%;
            white-space: normal !important;
            gap: 0 !important;
        }

        #navbar_top .nav-item {
            width: 100%;
            padding-left: 0 !important;
            padding-right: 0 !important;
        }

        #navbar_top .nav-link,
        #navbar_top .dropdown-toggle,
        #navbar_top .dropdown-item {
            display: block !important;
            width: 100%;
            text-align: right !important;
            white-space: normal !important;
            font-size: 15px !important;
            padding: 10px 12px !important;
        }

        /* القوائم الفرعية */
        #navbar_top .dropdown-menu {
            position: static !important;
            float: none !important;
            width: 100%;
            min-width: 100% !important;
            white-space: normal !important;
            box-shadow: none !important;
        }

        /* حجم اللوجو في الموبايل */
        #navbar_top .navbar-brand img {
            max-height: 52px;
            width: auto;
        }

        /* زرار التوجل */
        #navbar_top .navbar-toggler {
            flex: 0 0 auto;
        }
}
