body {
        padding-top: 60px;
        background: url('/theme/image/background.svg') no-repeat center center fixed;
        background-size: cover;
        background-color: #f0f3fb;
        font-family: 'Poppins', sans-serif;
        transition: background-color 0.3s ease;
    }

    .dark body {
        background-color: #0F172A !important;
        color: #E2E8F0;
    }

 
    .accordion-toggle .fa-chevron-down {
        transition: transform 0.3s ease;
    }

    .accordion-toggle.active .fa-chevron-down {
        transform: rotate(180deg);
    }

    /* Tab transitions */
    .tab-content {
        opacity: 0;
        transform: translateY(10px);
        transition: opacity 0.3s ease, transform 0.3s ease;
    }

    .tab-content.active {
        opacity: 1;
        transform: translateY(0);
    }

    /* Arabic Text */
    .arabic {
        font-family: 'Amiri', serif;
        font-size: 1.8rem;
        line-height: 2.8rem;
        direction: rtl;
    }

    /* Switch toggle */
    .switch {
        position: relative;
        display: inline-block;
        width: 60px;
        height: 34px;
    }
    
    .switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }
    
    .slider {
        position: absolute;
        cursor: pointer;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: #ccc;
        transition: .4s;
        border-radius: 34px;
    }
    
    .slider:before {
        position: absolute;
        content: "";
        height: 26px;
        width: 26px;
        left: 4px;
        bottom: 4px;
        background-color: white;
        transition: .4s;
        border-radius: 50%;
    }
    
    input:checked + .slider {
        background-color: #274c77;
    }
    
    input:checked + .slider:before {
        transform: translateX(26px);
    }
    
    /* Dark mode switch */
    .dark input:checked + .slider {
        background-color: #8B5CF6;
    }
    
    /* Progress ring animation */
    .progress-ring {
        transition: stroke-dashoffset 0.35s;
        transform: rotate(-90deg);
        transform-origin: 50% 50%;
    }
    
    /* Custom scrollbar */
    .custom-scroll::-webkit-scrollbar {
        width: 6px;
        height: 6px;
    }
    
    .custom-scroll::-webkit-scrollbar-track {
        background: #f1f1f1;
        border-radius: 10px;
    }
    
    .custom-scroll::-webkit-scrollbar-thumb {
        background: #c1c1c1;
        border-radius: 10px;
    }
    
    .dark .custom-scroll::-webkit-scrollbar-track {
        background: #334155;
    }
    
    .dark .custom-scroll::-webkit-scrollbar-thumb {
        background: #475569;
    }
    
    /* Animation classes */
    .animate-fade {
        animation: fadeIn 0.3s ease-out;
    }

        .accordion-content {
            transition: max-height 0.3s ease-out, opacity 0.2s ease;
            overflow: hidden;
        }

        .accordion-content.show {
            display: block;
            animation: fadeIn 0.3s ease-out;
        }

        .accordion-toggle .fa-chevron-down {
            transition: transform 0.3s ease;
        }

        .accordion-toggle.active .fa-chevron-down {
            transform: rotate(180deg);
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
                transform: translateY(-10px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .prose {
            line-height: 1.6;
        }

        .prose h3 {
            margin-top: 1.5em;
            margin-bottom: 0.75em;
        }

        .prose ul, .prose ol {
            padding-left: 1.5em;
            margin-top: 0.75em;
            margin-bottom: 1em;
        }

        .prose li {
            margin-bottom: 0.5em;
        }

        .prose blockquote {
            margin: 1.5em 0;
            padding-left: 1em;
        }

        .dark .prose a {
            color: #8B5CF6;
        }