@layer reset, base, components, utilities, overrides;

@layer components {
    .uk-btn-primary {
        --uk-btn-bg: hsl(212 100% 16%);
        --uk-btn-color: hsl(0 0% 98%);
    }
    .uk-btn-primary:hover {
        --uk-btn-bg: hsl(208, 100%, 34%);
        --uk-btn-color: hsl(0 0% 98%);
    }
    .uk-badge-primary {
        --uk-badge-border: 1px solid #0d9488;);
        --uk-badge-bg: #4ade80;
        --uk-badge-color: white;
    }

    .btn-current-plan {
        --uk-btn-bg: transparent;
        background: linear-gradient(90deg, #1CDF73 0%, #15c9a7 65%, #00aebb 100%);
        background-size: 150%;
        background-position: left;
        color: #ffffff;
        transition: background-position 0.5s ease;
    }
    .btn-current-plan:hover {
        background-position: right;
        color: #ffffff;
    }
    .btn-current-plan[disabled],
    .btn-current-plan:disabled {
        opacity: 1;
        color: #ffffff;
        cursor: default;
    }
}

@layer overrides {

}
