@import 'tailwindcss';

@source '../../vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php';
@source '../../storage/framework/views/*.php';
@source '../**/*.blade.php';
@source '../**/*.js';

@theme {
    --font-sans: 'Cairo', 'Instrument Sans', ui-sans-serif, system-ui, sans-serif;
    --color-primary: #6c3eb2;
    --color-primary-dark: #4a2580;
    --color-primary-light: #9b6fd4;
    --color-accent: #f59e0b;
    --color-dark: #0f0a1e;
    --color-surface: #1a1235;
}

@layer base {
    html {
        scroll-behavior: smooth;
    }

    body {
        font-family: 'Cairo', sans-serif;
        direction: rtl;
        text-align: right;
    }
}

@layer utilities {
    .gradient-primary {
        background: linear-gradient(135deg, #6c3eb2 0%, #4a2580 100%);
    }

    .gradient-hero {
        background: linear-gradient(160deg, #0f0a1e 0%, #1a1235 40%, #2d1b6b 100%);
    }

    .gradient-card {
        background: linear-gradient(145deg, rgba(108, 62, 178, 0.15) 0%, rgba(26, 18, 53, 0.8) 100%);
    }

    .text-gradient {
        background: linear-gradient(90deg, #f59e0b, #9b6fd4);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

    .card-hover {
        transition: transform 0.3s ease, box-shadow 0.3s ease;
    }

    .card-hover:hover {
        transform: translateY(-6px);
        box-shadow: 0 20px 40px rgba(108, 62, 178, 0.3);
    }

    .nav-link {
        position: relative;
    }

    .nav-link::after {
        content: '';
        position: absolute;
        bottom: -4px;
        right: 0;
        width: 0;
        height: 2px;
        background: #f59e0b;
        transition: width 0.3s ease;
    }

    .nav-link:hover::after {
        width: 100%;
    }

    .counter-animate {
        font-variant-numeric: tabular-nums;
    }
}