////
///
/// Opacity
/// ===========================================================================
///
/// Opacity appearance styles.
/// No layout logic.
///
/// @group Appearance
/// @author Scape Press
/// @link https://scape.style
/// @since 0.1.0 initial release
/// @access public
///
////

@layer ss.appearance {
    .ss-a-opacity-0 {
        opacity: 0;
    }
    .ss-a-opacity-5 {
        opacity: 0.05;
    }
    .ss-a-opacity-10 {
        opacity: 0.1;
    }
    .ss-a-opacity-20 {
        opacity: 0.2;
    }
    .ss-a-opacity-25 {
        opacity: 0.25;
    }
    .ss-a-opacity-30 {
        opacity: 0.3;
    }
    .ss-a-opacity-40 {
        opacity: 0.4;
    }
    .ss-a-opacity-50 {
        opacity: 0.5;
    }
    .ss-a-opacity-60 {
        opacity: 0.6;
    }
    .ss-a-opacity-70 {
        opacity: 0.7;
    }
    .ss-a-opacity-75 {
        opacity: 0.75;
    }
    .ss-a-opacity-80 {
        opacity: 0.8;
    }
    .ss-a-opacity-90 {
        opacity: 0.9;
    }
    .ss-a-opacity-95 {
        opacity: 0.95;
    }
    .ss-a-opacity-100 {
        opacity: 1;
    }

    // Hover opacity
    .ss-a-hover-opacity-100 {
        transition: opacity var(--ss-transition-default);

        &:hover {
            opacity: 1;
        }
    }
}