/*
 * ASUMA payment kartice.
 *
 * height="30" je i u HTML atributu, da rezervacija prostora radi prije CSS-a.
 */

.asuma-payment-cards {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-1);
    margin: 0;
    padding: 0;
    list-style: none;
}

.asuma-payment-cards__card {
    margin: 0;
    padding: 0;
    list-style: none;
}

.asuma-payment-cards__card::before,
.asuma-payment-cards__card::after {
    display: none;
}

.asuma-payment-cards__card a {
    display: block;
    line-height: 0;
    /* [TODO] 2px nije na --radius skali, čeka odluku o proširenju šeme. */
    border-radius: 2px;
}

.asuma-payment-cards__card a:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.asuma-payment-cards__card img {
    display: block;
    width: auto;
    height: 30px;
    object-fit: contain;
    border-radius: 2px;
    filter: grayscale(100%);
    transition: filter var(--dur-fast) var(--ease-out);
}

.asuma-payment-cards__card a:hover img,
.asuma-payment-cards__card a:focus-visible img {
    filter: grayscale(0%);
}

.asuma-payment-cards__card--wide img {
    max-width: 102px;
}

@media (prefers-reduced-motion: reduce) {
    .asuma-payment-cards__card img {
        transition: none;
    }
}