/*
|--------------------------------------------------------------------------
| Fuzzy ball skin for Tabler and/or Backpack for Laravel
|--------------------------------------------------------------------------
|
| 🎨 This adds a quirky blurred SVG background using hsl(...) color stops.
| 🛠️ To customize colors, just find & replace the HSL values below:
|    - hsl(37, 99%25, 67%25) → color #1 (orange-ish)
|    - hsl(316, 73%25, 52%25) → color #2 (pink/purple)
|    - hsl(185, 100%25, 57%25) → color #3 (cyan)
|
| 💡 Tip: Use a URL encoder like https://yoksel.github.io/url-encoder/ if
|         you want to regenerate or preview the SVG. The current one is
|         encoded as a data URI inside background-image.
*/

body {
    /* BlurBerry background */
    background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20xmlns%3Asvgjs%3D%22http%3A%2F%2Fsvgjs.dev%2Fsvgjs%22%20viewBox%3D%220%200%20800%20800%22%3E%3Cdefs%3E%3Cfilter%20id%3D%22bbblurry-filter%22%20x%3D%22-100%25%22%20y%3D%22-100%25%22%20width%3D%22400%25%22%20height%3D%22400%25%22%20filterUnits%3D%22objectBoundingBox%22%20primitiveUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeGaussianBlur%20stdDeviation%3D%2240%22%20x%3D%220%25%22%20y%3D%220%25%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20in%3D%22SourceGraphic%22%20edgeMode%3D%22none%22%20result%3D%22blur%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Cg%20filter%3D%22url(%23bbblurry-filter)%22%3E%3Cellipse%20rx%3D%22400%22%20ry%3D%22200%22%20cx%3D%22379.02369011526488%22%20cy%3D%2267.0291623615862%22%20fill%3D%22hsl(209%2094.4%25%2042.2%25)%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
    background-size: cover;
    background-position: center;
    background-repeat: repeat;
    /* background-attachment: fixed; */
    min-height: 100%;
}


html[data-bs-theme=light] {
    /* background: #f9f9f9; */
    background: var(--tblr-gray-100);
}

[data-bs-theme=light] .page {
    background: rgb(255 255 255 / 0.00);
}

[data-bs-theme=dark] .page {
    background: rgba(0, 0, 0, 0.75);
}