////
///
/// 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;
    }
}

}