@use "sass:string";
@use "../../shared/track/track";

$_downcount: jkl-downcount-#{string.unique-id()};

@layer jokul.components {
    .jkl-countdown {
        @include track.track;

        &__tracker {
            animation: $_downcount var(--duration) linear forwards;
            animation-play-state: var(--play-state, running);
        }
    }

    @keyframes #{$_downcount} {
        from {
            width: 100%;
        }

        to {
            width: 0%;
        }
    }
}