// Name:            Content loader
// Description:     Component to style content loader
//
// Component:       `uk-content-loader`
//
// ========================================================================

@use 'sass:map';
@use 'sass:meta';

@use '@broxus/react-uikit/styles/variables' as *;


// Variables
// ========================================================================

@use '../mixins' as *;


@mixin content-loader-styles {
    /* ========================================================================
       Component: Content loader
     ========================================================================== */

    .#{$prefix}-content-loader {
        margin: 0 !important;
        padding: 0 !important;
        position: relative;
        width: 100%;
    }

    .#{$prefix}-content-loader .#{$prefix}-disabled {
        opacity: 0.65;
    }

    .#{$prefix}-content-loader .#{$prefix}-spinner-wrapper {
        align-items: center;
        display: flex;
        inset: 0;
        justify-content: center;
        pointer-events: none;
        position: absolute;
        z-index: 2;
    }

    @content;
}

@mixin content-loader-tokens {
    @content;
}