/**
 * Wysyłka — style frontu.
 *
 * Dopasowane do motywu kubiczduo i modułu „Bezpieczna przesyłka”: prawa
 * kolumna (#est-product-right) ma tło #f1f1f1, bloki to białe karty z paskiem
 * po lewej, bez zaokrągleń, font motywu (Roboto).
 * Zielony = kolor „success” motywu (#4cbb6c; ciemniejszy odcień #318047 do
 * tekstu, żeby był czytelny), niebieski = kolor przycisków motywu (#0969b3).
 */

.wb-badges {
    --wb-green: #4cbb6c;
    --wb-green-dark: #318047;
    --wb-green-bg: #f1faf4;
    --wb-blue: #0969b3;
    --wb-blue-bg: #e6eef6;
    --wb-text: #4a4a49;
    --wb-dark: #060707;
    --wb-muted: #898989;

    display: flex;
    clear: both;
    flex-direction: column;
    gap: 8px;
    margin: 16px 0;
}

.wb-badges [hidden] {
    display: none !important;
}

/* ------------------------------------------------------------------
 * Karta
 * ------------------------------------------------------------------ */

.wb-card {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 14px;
    border-left: 3px solid var(--wb-blue);
    background: #fff;
    color: var(--wb-text);
}

.wb-card__icon {
    display: flex;
    flex: 0 0 42px;
    color: var(--wb-blue);
}

.wb-card__icon svg {
    width: 42px;
    height: 42px;
}

.wb-card__body {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
}

.wb-card__title {
    color: var(--wb-dark);
    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
}

.wb-card__text {
    margin-top: 2px;
    font-size: 13px;
    line-height: 1.4;
}

.wb-card__text strong {
    color: var(--wb-dark);
    font-weight: 700;
}

.wb-card__note {
    margin-top: 6px;
    color: var(--wb-muted);
    font-size: 12px;
    line-height: 1.35;
}

/* ------------------------------------------------------------------
 * Darmowa wysyłka — zielony motywu
 * ------------------------------------------------------------------ */

.wb-card--free {
    border-left-color: var(--wb-green);
    background: var(--wb-green-bg);
}

.wb-card--free .wb-card__icon {
    color: var(--wb-green);
}

.wb-card--free .wb-card__title,
.wb-card--free .wb-card__text strong {
    color: var(--wb-green-dark);
}

/* Poniżej progu („Darmowa wysyłka od 500,00 zł”) — spokojniejsza, mniejsza. */
.wb-card--hint {
    padding-top: 10px;
    padding-bottom: 10px;
    border-left-color: var(--wb-green);
}

/* Mniejsza ikona w tej samej szerokości kolumny — tytuły kart pozostają w jednej linii. */
.wb-card--hint .wb-card__icon {
    justify-content: center;
    color: var(--wb-green);
}

.wb-card--hint .wb-card__icon svg {
    width: 32px;
    height: 32px;
}

.wb-card--hint .wb-card__title {
    font-size: 14px;
    font-weight: 600;
}

/* ------------------------------------------------------------------
 * Wysyłka w 24h — licznik
 * ------------------------------------------------------------------ */

.wb-timer {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    padding: 4px 10px;
    background: var(--wb-blue-bg);
    color: var(--wb-blue);
    font-size: 13px;
    line-height: 1.4;
}

.wb-timer__label {
    font-weight: 500;
}

.wb-timer__value {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.03em;
}

.wb-timer__dot {
    flex: 0 0 8px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: currentColor;
    animation: wb-pulse 1.6s ease-out infinite;
}

@keyframes wb-pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(9, 105, 179, 0.45);
    }

    70%,
    100% {
        box-shadow: 0 0 0 6px rgba(9, 105, 179, 0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .wb-timer__dot {
        animation: none;
    }
}
