@tailwind base;
@tailwind components;
@tailwind utilities;


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

@theme {
    --font-sans: 'Instrument Sans', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
        'Segoe UI Symbol', 'Noto Color Emoji';
}

@layer utilities {
    .js .reveal {
        opacity: 0;
        transform: translateY(18px);
        transition: opacity 700ms cubic-bezier(0.16, 1, 0.3, 1), transform 700ms cubic-bezier(0.16, 1, 0.3, 1);
        transition-delay: var(--reveal-delay, 0ms);
    }

    .js .reveal.is-visible {
        opacity: 1;
        transform: translateY(0);
    }

    .js .reveal-fade {
        opacity: 0;
        transition: opacity 700ms cubic-bezier(0.16, 1, 0.3, 1);
        transition-delay: var(--reveal-delay, 0ms);
    }

    .js .reveal-fade.is-visible {
        opacity: 1;
    }

    .btn-press {
        transition: transform 200ms ease, box-shadow 200ms ease;
        will-change: transform;
    }

    .btn-press:hover {
        transform: translateY(-2px);
        box-shadow: 0 10px 20px rgba(15, 23, 42, 0.12);
    }

    .btn-press:active {
        transform: translateY(0) scale(0.98);
        box-shadow: 0 4px 10px rgba(15, 23, 42, 0.14);
    }

    .js .dropdown-panel,
    .js .nav-panel {
        opacity: 0;
        transform: translateY(-8px) scale(0.98);
        transition: opacity 220ms ease, transform 220ms ease;
        pointer-events: none;
    }

    .js .dropdown-panel.is-open,
    .js .nav-panel.is-open {
        opacity: 1;
        transform: translateY(0) scale(1);
        pointer-events: auto;
    }

    .js details .accordion-body {
        max-height: 0;
        opacity: 0;
        transform: translateY(-6px);
        overflow: hidden;
        transition: max-height 260ms ease, opacity 220ms ease, transform 220ms ease;
    }

    .js details[open] .accordion-body {
        max-height: 320px;
        opacity: 1;
        transform: translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .js .reveal,
    .js .reveal-fade {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .btn-press {
        transition: none;
    }

    .js .dropdown-panel,
    .js .nav-panel {
        opacity: 1;
        transform: none;
        transition: none;
        pointer-events: auto;
    }

    .js details .accordion-body {
        max-height: none;
        opacity: 1;
        transform: none;
        transition: none;
    }
}