.clickable {
    cursor: pointer;
    transition: 0.2s;
    border-radius: 16px;
}





.radzen-body,
.radzen-content,
.rz-textbox,
.rz-button {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
}


:root {
    --bs-body-font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}


body, html {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
}





.clickable:hover {
    transform: scale(1.02);
    box-shadow: 0 0 10px rgba(0,0,0,0.2);
}

.dark-mode .card {
    background-color: #2c2c3b !important;
    color: #eaeaea;
    border: none;
}

.dark-mode .card-body {
    color: #ddd;
}

.dark-mode .text-muted {
    color: #aaa !important;
}


/* الوضع الفاتح (تلقائي) */
body, .main-wrapper {
    background-color: #f8f9fa;
    color: #212529;
}

/* الوضع الداكن */
.dark-mode {
    background-color: #1e1e2f;
    color: #eaeaea;
}

/* البطاقة */
.card {
    border-radius: 0.75rem;
    background-color: #ffffff;
    color: #212529;
    border: 1px solid #dee2e6;
}

.dark-mode .card {
    background-color: #2c2c3b !important;
    color: #eaeaea;
    border: 1px solid #444;
}

/* رأس البطاقة */
.card-header {
    font-weight: bold;
    background-color: #0d6efd;
    color: #ffffff;
}

.dark-mode .card-header {
    background-color: #0d6efd !important;
    color: white !important;
}

/* الجدول */
.table {
    border-radius: 0.5rem;
    overflow: hidden;
}

.table-hover tbody tr:hover {
    background-color: #f0f0f0;
}

.dark-mode .table {
    background-color: transparent;
    color: #eaeaea;
}

    .dark-mode .table thead {
        background-color: #3c3c3c;
        color: #ffffff;
    }

.dark-mode .table-hover tbody tr:hover {
    background-color: #2a2a3a;
}

/* الأزرار */
.btn-outline-success {
    color: #198754;
    border-color: #198754;
}

.btn-outline-danger {
    color: #dc3545;
    border-color: #dc3545;
}

.dark-mode .btn-outline-success {
    color: #28d07a;
    border-color: #28d07a;
}

.dark-mode .btn-outline-danger {
    color: #ff6b6b;
    border-color: #ff6b6b;
}

    .dark-mode .btn-outline-success:hover,
    .dark-mode .btn-outline-danger:hover {
        background-color: transparent;
        opacity: 0.85;
    }

/* زر إضافة منتج */
.radzen-button {
    font-weight: bold;
    border-radius: 8px;
    transition: 0.3s;
}

    .radzen-button:hover {
        opacity: 0.9;
    }

/* تحسين تنسيق الكميات */
td > div span {
    display: inline-block;
    min-width: 70px;
    font-weight: 500;
}







/* بطاقات متدرجة */
.gradient-blue {
    background: linear-gradient(135deg, #42a5f5, #1e88e5);
}

.gradient-pink {
    background: linear-gradient(135deg, #f06292, #e91e63);
}

.gradient-green {
    background: linear-gradient(135deg, #66bb6a, #43a047);
}

.gradient-gray {
    background: linear-gradient(135deg, #90a4ae, #607d8b);
}

.dashboard-card {
    text-align: center;
    padding: 1.5rem;
    border-radius: 1rem;
    transition: all 0.3s ease-in-out;
}

    .dashboard-card:hover {
        transform: translateY(-5px) scale(1.03);
        box-shadow: 0 8px 20px rgba(0,0,0,0.25);
    }

.pulse {
    animation: pulse 2s infinite;
}

.bounce {
    animation: bounce 2s infinite;
}

@keyframes pulse {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.1);
    }

    100% {
        transform: scale(1);
    }
}

@keyframes bounce {
    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-6px);
    }
}

.btn-animated {
    background: linear-gradient(135deg, #42a5f5, #1e88e5);
    color: white !important;
    border: none;
    border-radius: 8px;
    transition: 0.3s;
}

    .btn-animated:hover {
        background: linear-gradient(135deg, #1e88e5, #1565c0);
        transform: scale(1.05);
    }

.chart-box {
    border-radius: 1rem;
    background: rgba(255,255,255,0.9);
    padding: 1rem;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}