/* =========================
   NEON FRAME PRICE – clean fintech
   ========================= */

.rf-neon{
    --radius: 0.14em;

    display: inline-flex;
    align-items: baseline;
    gap: 0.5em;

    padding: 0.26em 0.6em;
    border-radius: var(--radius);
    line-height: 1;
    white-space: nowrap;

    background: #0019AC;
    color: #f5f8fd;
    position: relative;
    overflow: hidden; /* wymagane dla połysku */

    /* KLUCZ: czysta neonowa ramka */
    border: 1px solid #6BF498;

     transition: border-color .15s ease, background-color .15s ease;
}

/* Ustawiamy KOLORY jawnie, żeby nic nie nadpisywało w nagłówkach/Avadzie */
.rf-neon .rf-neon__amount{
    color: #f5f8fd;
    font-weight: 900;
    letter-spacing: -0.015em;
    font-variant-numeric: tabular-nums;
}

/* Waluta – techniczna, spokojna */
.rf-neon__cur{
    font-size: 0.7em;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #6BF498;
}

/* Hover – nowoczesny, bez świecenia */
.rf-neon:hover{
    background: #0014a0;
    border-color: #2dc35e;
}

/* Wersja na jasnym tle */
.rf-neon--light{
    background: #f5f8fd;
    color: #0019AC;
    border-color: #2dc35e;
}
.rf-neon.rf-neon--light .rf-neon__amount{
    color: #0019AC;
}

.rf-neon.rf-neon--light:hover .rf-neon__amount{
    color: #f5f8fd;
}

.rf-neon--light .rf-neon__cur{
    color: #2dc35e;
}

/* Zachowanie w nagłówkach */
h1 .rf-neon,
h2 .rf-neon,
h3 .rf-neon{
    vertical-align: middle;
}

/* Dostępność */
@media (prefers-reduced-motion: reduce){
    .rf-neon{ transition:none; }
    .rf-neon::after{ animation:none; }
}

/* =========================
   Ciągły połysk z przerwami
   ========================= */

.rf-neon{
    position: relative;
    overflow: hidden;
}

/* Smuga światła */
.rf-neon::after{
    content: "";
    position: absolute;
    inset: 0;

    background:
            linear-gradient(
                    100deg,
                    transparent 0%,
                    rgba(255,255,255,.14) 18%,
                    rgba(255,255,255,.32) 22%,
                    rgba(255,255,255,.14) 26%,
                    transparent 35%
            );

    transform: translateX(-130%);
    pointer-events: none;

    animation: rf-sheen-loop 5s ease-in-out infinite;
}

/* Keyframes z pauzą */
@keyframes rf-sheen-loop{
    0%{   transform: translateX(-130%); opacity: 0; }
    55%{  transform: translateX(-130%); opacity: 0; }
    60%{  opacity: 1; }
    75%{  transform: translateX(130%);  opacity: 1; }
    80%{  opacity: 0; }
    100%{ transform: translateX(130%);  opacity: 0; }
}

/* =========================
   NEON FRAME – jasna wersja
   na granatowym tle
   ========================= */

.rf-neon--on-dark{
    background: #f5f8fd;           /* jasne wnętrze */
    color: #0019AC;
    border-color: #6BF498;         /* neonowa ramka */
}

.rf-neon.rf-neon--on-dark .rf-neon__amount{
    color: #0019AC;
}

/* Waluta */
.rf-neon--on-dark .rf-neon__cur{
    color: #2dc35e;
}

/* Połysk – jaśniejszy, bardziej „szklany” */
.rf-neon--on-dark::after{
    background:
            linear-gradient(
                    120deg,
                    transparent 0%,
                    rgba(255,255,255,.22) 18%,
                    rgba(255,255,255,.45) 22%,
                    rgba(255,255,255,.22) 26%,
                    transparent 35%
            );
}

/* Hover – minimalny */
.rf-neon--on-dark:hover{
    background: #ffffff;
    border-color: #2dc35e;
}
/* =========================
   RF NEON – CTA inside badge (Odbierz) + a11y
   Dopisz na końcu rf-neon.css
   ========================= */

/* CTA jako 3-ci segment w badge */
.rf-neon--has-cta{
    align-items: center; /* baseline psuje wyrównanie CTA */
}

.rf-neon__cta{
    font-weight: 900;
    font-size: 0.78em;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    line-height: 1;

    margin-left: 0.55em;
    padding-left: 0.55em;
    border-left: 1px solid rgba(107,244,152,.65);

    /* kolor jak kwota (default) */
    color: #f5f8fd;

    transition: transform .15s ease, border-color .15s ease, opacity .15s ease;
    opacity: .98;
}

/* LIGHT / ON-DARK: CTA jak amount */
.rf-neon--light .rf-neon__cta,
.rf-neon--on-dark .rf-neon__cta{
    color:#0019AC;
    border-left-color: rgba(45,195,94,.65);
}

.rf-neon-link{
    display:inline-flex;
    text-decoration:none !important;
}

.rf-neon-link:hover .rf-neon__cta{
    transform: translateX(1px);
    border-left-color: rgba(45,195,94,.95);
}

.rf-neon-link:focus,
.rf-neon-link:focus-visible{
    outline: 3px solid rgba(0,91,255,.18);
    outline-offset: 2px;
    border-radius: 0.18em;
}