@import 'tailwindcss';

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

@theme {
    --font-heading: 'Fredoka', ui-rounded, 'Nunito', system-ui, sans-serif;
    --font-sans: 'Nunito', system-ui, sans-serif;
}

@layer utilities {
    .font-heading {
        font-family: var(--font-heading);
    }

    /* Chunky playful toy block shadows */
    .toy-shadow-sm {
        box-shadow: 2px 2px 0px 0px #0f172a;
    }
    .toy-shadow {
        box-shadow: 4px 4px 0px 0px #0f172a;
    }
    .toy-shadow-lg {
        box-shadow: 6px 6px 0px 0px #0f172a;
    }
    .toy-shadow-amber {
        box-shadow: 4px 4px 0px 0px #b45309;
    }
    .toy-shadow-rose {
        box-shadow: 4px 4px 0px 0px #be123c;
    }
    .toy-shadow-indigo {
        box-shadow: 4px 4px 0px 0px #3730a3;
    }

    /* Chunky pressable button effect */
    .toy-btn {
        transition: all 0.12s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .toy-btn:hover {
        transform: translate(-2px, -2px);
        box-shadow: 6px 6px 0px 0px #0f172a;
    }
    .toy-btn:active {
        transform: translate(2px, 2px);
        box-shadow: 2px 2px 0px 0px #0f172a;
    }
}