/* Custom CSS for NasiyaCRM */

/* General Styles */
body {
    font-family: 'Source Sans Pro', sans-serif;
}

/* Small box customization */
.small-box {
    border-radius: 0.25rem;
    box-shadow: 0 0 1px rgba(0,0,0,.125), 0 1px 3px rgba(0,0,0,.2);
}

/* Card customization */
.card {
    box-shadow: 0 0 1px rgba(0,0,0,.125), 0 1px 3px rgba(0,0,0,.2);
}

/* Badge sizes */
.badge-lg {
    font-size: 1rem;
    padding: 0.5rem 0.75rem;
}

/* Table hover effect */
.table-hover tbody tr:hover {
    background-color: rgba(0,0,0,.025);
}

/* Button customization */
.btn {
    border-radius: 0.25rem;
}

/* Form control focus */
.form-control:focus {
    border-color: #007bff;
    box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
}

/* Progress bar customization */
.progress {
    height: 1.25rem;
}

/* Login page customization */
.login-box {
    width: 400px;
}

/* Status badges */
.badge-success { background-color: #28a745; }
.badge-warning { background-color: #ffc107; color: #212529; }
.badge-danger { background-color: #dc3545; }
.badge-info { background-color: #17a2b8; }
.badge-secondary { background-color: #6c757d; }

/* Custom colors for specific statuses */
.text-overdue { color: #dc3545; }
.text-pending { color: #ffc107; }
.text-paid { color: #28a745; }

/* Utility classes */
.cursor-pointer {
    cursor: pointer;
}

.border-right {
    border-right: 1px solid #dee2e6;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .login-box {
        width: 90%;
        margin: 0 auto;
    }
}

/* ============================================
   Notification Dropdown Styling
   ============================================ */
#notificationDropdown {
    max-height: 400px;
    overflow-y: auto;
    min-width: 350px;
}

.notification-item {
    padding: 10px 15px;
    border-bottom: 1px solid #f4f4f4;
    transition: background-color 0.2s;
    cursor: pointer;
}

.notification-item:hover {
    background-color: #f8f9fa;
    text-decoration: none;
}

.notification-item:last-child {
    border-bottom: none;
}

.notification-item .badge {
    font-size: 0.7rem;
    padding: 2px 6px;
}

/* Badge animation for new notifications */
@keyframes pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.15); }
}

.navbar-badge.pulse {
    animation: pulse 1s ease-in-out 3;
}

/* Notification icon colors */
.notification-item .fa-exclamation-circle {
    font-size: 1.2rem;
}

.notification-item .fa-clock {
    font-size: 1.2rem;
}

/* Scrollbar styling for notification dropdown */
#notificationDropdown::-webkit-scrollbar {
    width: 6px;
}

#notificationDropdown::-webkit-scrollbar-track {
    background: #f1f1f1;
}

#notificationDropdown::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 3px;
}

#notificationDropdown::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* Empty state */
#notificationList .text-muted {
    padding: 20px;
}

/* Notification badge visibility */
.navbar-badge {
    display: inline-block;
}

.navbar-badge:empty {
    display: none;
}