:root {
    --color-gray-50: oklch(0.984 0.003 248.234);
    --color-gray-100: oklch(0.968 0.007 248.084);
    --color-gray-200: oklch(0.929 0.013 255.561);
    --color-gray-300: oklch(0.869 0.02 252.937);
    --color-gray-400: oklch(0.711 0.035 256.803);
    --color-gray-500: oklch(0.554 0.041 257.428);
    --color-gray-600: oklch(0.446 0.037 257.291);
    --color-gray-700: oklch(0.372 0.039 257.296);
    --color-gray-800: oklch(0.279 0.037 260.038);
    --color-gray-900: oklch(0.208 0.04 265.759);
    --color-gray-950: oklch(0.129 0.041 264.7);

    --color-primary-50: oklch(0.896 0.0215 262.887);
    --color-primary-100: oklch(0.866 0.03225 262.887);
    --color-primary-200: oklch(0.816 0.05375 262.887);
    --color-primary-300: oklch(0.746 0.09675 262.887);
    --color-primary-400: oklch(0.626 0.16125 262.887);
    --color-primary-500: oklch(0.546 0.215 262.887);
    --color-primary-600: oklch(0.476 0.2365 262.887);
    --color-primary-700: oklch(0.416 0.215 262.887);
    --color-primary-800: oklch(0.356 0.1763 262.887);
    --color-primary-900: oklch(0.296 0.1419 262.887);
    --color-primary-950: oklch(0.166 0.086 262.887);

    /* Light mode theme color (default) */
    --theme-color: oklch(0.546 0.215 262.887);
    --primary-color: #2563eb;
}

:root.dark {
    --color-gray-50: oklch(0.984 0.003 248.234);
    --color-gray-100: oklch(0.968 0.007 248.084);
    --color-gray-200: oklch(0.929 0.013 255.561);
    --color-gray-300: oklch(0.869 0.02 252.937);
    --color-gray-400: oklch(0.711 0.035 256.803);
    --color-gray-500: oklch(0.554 0.041 257.428);
    --color-gray-600: oklch(0.446 0.037 257.291);
    --color-gray-700: oklch(0.372 0.039 257.296);
    --color-gray-800: oklch(0.279 0.037 260.038);
    --color-gray-900: oklch(0.208 0.04 265.759);
    --color-gray-950: oklch(0.129 0.041 264.7);

    --color-primary-50: oklch(0.98 0.0132 232.828);
    --color-primary-100: oklch(0.95 0.02 232.828);
    --color-primary-200: oklch(0.9 0.04 232.828);
    --color-primary-300: oklch(0.83 0.08 232.828);
    --color-primary-400: oklch(0.71 0.15 232.828);
    --color-primary-500: oklch(0.693 0.132 232.828);
    --color-primary-600: oklch(0.623 0.1452 232.828);
    --color-primary-700: oklch(0.563 0.132 232.828);
    --color-primary-800: oklch(0.503 0.10824 232.828);
    --color-primary-900: oklch(0.443 0.08712 232.828);
    --color-primary-950: oklch(0.313 0.0528 232.828);

    /* Dark mode theme color */
    --theme-color: oklch(0.693 0.132 232.828);
    --primary-color: #2aa9e0;
}

[wire\:loading][wire\:loading], [wire\:loading\.delay][wire\:loading\.delay], [wire\:loading\.list-item][wire\:loading\.list-item], [wire\:loading\.inline-block][wire\:loading\.inline-block], [wire\:loading\.inline][wire\:loading\.inline], [wire\:loading\.block][wire\:loading\.block], [wire\:loading\.flex][wire\:loading\.flex], [wire\:loading\.table][wire\:loading\.table], [wire\:loading\.grid][wire\:loading\.grid], [wire\:loading\.inline-flex][wire\:loading\.inline-flex] {display: none;}[wire\:loading\.delay\.none][wire\:loading\.delay\.none], [wire\:loading\.delay\.shortest][wire\:loading\.delay\.shortest], [wire\:loading\.delay\.shorter][wire\:loading\.delay\.shorter], [wire\:loading\.delay\.short][wire\:loading\.delay\.short], [wire\:loading\.delay\.default][wire\:loading\.delay\.default], [wire\:loading\.delay\.long][wire\:loading\.delay\.long], [wire\:loading\.delay\.longer][wire\:loading\.delay\.longer], [wire\:loading\.delay\.longest][wire\:loading\.delay\.longest] {display: none;}[wire\:offline][wire\:offline] {display: none;}[wire\:dirty]:not(textarea):not(input):not(select) {display: none;}:root {--livewire-progress-bar-color: #2299dd;}[x-cloak] {display: none !important;}[wire\:cloak] {display: none !important;}dialog#livewire-error::backdrop {background-color: rgba(0, 0, 0, .6);}

/* Gradient animation for theme toggle */
        @keyframes gradientShift {
            0%, 100% {
                background-position: 0% 50%;
            }
            50% {
                background-position: 100% 50%;
            }
        }

/* Shadow lift + active press. clip-path gives pixel-perfect
               rounded clipping (overflow:hidden alone leaks sub-pixel
               seams at rounded corners). */
            .ui-post-frame {
                clip-path: inset(0 round 0.375rem);
                transition: box-shadow 300ms ease-out, filter 120ms ease-out;
            }
            .group:hover .ui-post-frame,
            .group:focus-within .ui-post-frame {
                box-shadow: 0 8px 24px -8px rgba(0, 0, 0, 0.22), 0 2px 6px rgba(0, 0, 0, 0.08);
            }
            .dark .group:hover .ui-post-frame,
            .dark .group:focus-within .ui-post-frame {
                box-shadow: 0 10px 28px -8px rgba(0, 0, 0, 0.6), 0 2px 8px rgba(0, 0, 0, 0.35);
            }
            .group:active .ui-post-frame { filter: brightness(0.94); }

            /* Touch / no-hover devices: reveal is always on. */
            @media (hover: none) {
                .ui-post-reveal {
                    opacity: 1 !important;
                    transform: none !important;
                }
            }