body {
    font-family: KalamehWebFaNum, sans-serif;
}


.active>.page-link, .page-link.active {
    z-index: 3;
    color: var(--bs-pagination-active-color)!important;
    background-color: rgba(220, 53, 69, 0.5)!important;
    border-color: #fff!important;
}
.page-link {

    color: rgba(220, 53, 69, 0.5)!important; }
.night-mode {
    background-color: #121212; /* Dark Background */
    color: #ffffff; /* Light Text */
}

.night-mode .navbar, .night-mode .card, .night-mode .btn {
    background-color: #333333; /* Darker Background for Components */
    color: #ffffff; /* Light Text */
}

.loader-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000000bb;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.loader-wrapper img {
    animation: fadeEffect 2s infinite;
}

@keyframes fadeEffect {
    0% { opacity: 0.2; }
    50% { opacity: 1; }
    100% { opacity: 0.2; }
}





.btn-soft {
    background-color: #f0f0f0;
    color: #333;
    border: none;
    padding: 10px 20px;
    border-radius: 8px;
    font-size: 16px;
    transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

.btn-soft:hover {
    background-color: #e0e0e0;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* استایل دکمه‌های با مرز نرم */
.btn-outline-soft {
    background-color: transparent;
    color: #333;
    border: 2px solid #333;
    padding: 8px 18px;
    border-radius: 8px;
    font-size: 16px;
    transition: background-color 0.3s ease, color 0.3s ease, box-shadow 0.3s ease;
}

.btn-outline-soft:hover {
    background-color: #f0f0f0;
    color: #000;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* استایل مخصوص دکمه‌های تیره */
.btn-dark {
    background-color: #333;
    color: #fff;
    border: none;
    padding: 10px 20px;
    border-radius: 8px;
    font-size: 16px;
    transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

.btn-dark:hover {
    background-color: #444;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

/* استایل نوار منو در حالت ثابت */
.navbar-sticky {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000;
    transition: top 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    background-color: #fff;
}

/* فضای خالی در بالای صفحه برای جلوگیری از پنهان شدن محتوا زیر نوار منو */
.sticky-space {
    height: 72px; /* همان ارتفاع نوار منو */
}

/* استایل‌ها برای حالت تاریک */
.night-mode .btn-soft {
    background-color: #444;
    color: #ddd;
}

.night-mode .btn-soft:hover {
    background-color: #555;
    box-shadow: 0 4px 8px rgba(255, 255, 255, 0.1);
}

.night-mode .btn-outline-soft {
    background-color: transparent;
    color: #ddd;
    border: 2px solid #ddd;
}

.night-mode .btn-outline-soft:hover {
    background-color: #555;
    color: #fff;
    box-shadow: 0 4px 8px rgba(255, 255, 255, 0.1);
}

.night-mode .btn-dark {
    background-color: #fff;
    color: #333;
}

.night-mode .btn-dark:hover {
    background-color: #ddd;
    box-shadow: 0 4px 8px rgba(255, 255, 255, 0.2);
}

.night-mode .navbar-sticky {
    background-color: #333;
    box-shadow: 0 2px 5px rgba(255, 255, 255, 0.1);
}

/* حالت تاریک برای کلید نوار منو */
.night-mode .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba%288, 8, 8, 0.5%29' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

/* کاهش اندازه دکمه‌ها و متن در صفحه‌های با عرض 1200px یا کمتر */
@media (max-width: 1200px) {
    .btn-soft, .btn-outline-soft, .btn-dark {
        padding: 8px 16px;
        font-size: 14px;
    }

    .navbar-sticky {
        padding: 8px 0;
    }
}



.night-mode .table{
    color: #ffffff!important;
}

    /* Dark mode styles */
    body.night-mode {
        background-color: #121212;
        color: #ffffff;
    }
    
    body.night-mode .form-control,
    body.night-mode .form-select {
        background-color: #2b2b2b; /* Lighter dark color for inputs and selects */
        color: #ffffff;
        border: 1px solid #444444;
    }
    
    body.night-mode .form-control::placeholder,
    body.night-mode .form-select::placeholder {
        color: #aaaaaa;
    }
    
    body.night-mode .form-control:focus,
    body.night-mode .form-select:focus {
        background-color: #2b2b2b; /* Ensure focus state remains the same color */
        color: #ffffff; /* Ensure text color remains white */
        border-color: #555555;
        box-shadow: none;
    }
    
    body.night-mode .form-control[disabled],
    body.night-mode .form-select[disabled] {
        background-color: #3a3a3a; /* Slightly different color for disabled inputs */
        color: #cccccc; /* Lighter text color for disabled inputs */
    }
    
    /* Customizing the appearance of buttons in dark mode */
    body.night-mode .btn-primary {
        background-color: #007bff;
        border-color: #0056b3;
    }
    
    body.night-mode .btn-primary:hover {
        background-color: #0056b3;
        border-color: #004085;
    }
    