//
// Copyright 2022 Google LLC
// SPDX-License-Identifier: Apache-2.0
//
// [Modified by Sandlada & Kai Orion]
//
// Copyright 2025 Sandlada & Kai Orion
// SPDX-License-Identifier: MIT
//

@use 'sass:map';
@use '../../../tokens';

@mixin styles() {
    $tokens: tokens.md-comp-ripple-values();

    & {
        @each $token, $value in $tokens {
            --_#{$token}: #{$value};
        }
    }

    &[disabled] {
        display: none;
    }

    @media (forced-colors: active) {
        & {
            display: none;
        }
    }

    & {
        border-radius: inherit;
        position: absolute;
        inset: 0;
        overflow: hidden;
        display: flex;
        margin: auto;
        pointer-events: none;
        -webkit-tap-highlight-color: transparent;

        &::before,
        &::after {
            content: '';
            opacity: 0;
            position: absolute;
        }

        &::before {
            background-color: map.get($tokens, 'hover-color');
            inset: 0;
            transition: opacity 15ms linear, background-color 15ms linear;
        }

        &::after {
            // press ripple fade-out
            background: radial-gradient(closest-side, map.get($tokens, 'pressed-color') max(calc(100% - 70px), 65%), transparent 100%);
            transform-origin: center center;
            transition: opacity 375ms linear;
        }

        &[hover]::before,
        &.hovered::before {
            background-color: map.get($tokens, 'hover-color');
            opacity: map.get($tokens, 'hover-opacity');
        }

        &[pressed]::after,
        &.pressed::after {
            // press ripple fade-in
            opacity: map.get($tokens, 'pressed-opacity');
            transition-duration: 105ms;
        }
    }
}