/* Nadpisanie styli PayU - ładuje się z motywu, po stylach wtyczki */

.checkmark
{
    top: auto !important;
}
.wc_payment_method
{
    margin-bottom: 15px !important;
}

.woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] {
    position: relative;
}

.woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] .payment_box {
    padding-left: 46px !important;
}

/* Ensure paragraphs inside PayU payment box (payustandard) have no bottom margin */
.woocommerce-checkout .wc_payment_methods .payment_box.payment_method_payustandard > p {
    margin-bottom: 0 !important;
}

.woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] > label {
    padding-right: 96px !important;
}

.woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] > label img {
    position: absolute !important;
    right: 18px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    height: 28px !important;
    width: auto !important;
    margin: 0 !important;
}

.woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] img {
    position: absolute !important;
    right: 18px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    height: 28px !important;
    width: auto !important;
}

.woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] .radio-button,
.woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] label.radio-button {
    padding-left: 40px !important;
}
/* Two-column label layout to avoid overlap (text left, logos right) */
.woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] > label {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important; /* allow content to wrap and increase height */
    justify-content: space-between !important;
    gap: 12px !important;
    padding-right: 12px !important;
    padding-left: 12px !important;
}

/* Force pm-right (icons) to the far right and pm-left to the left */
.woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] > label {
    flex-direction: row !important;
}
.woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] > label .pm-left {
    order: 1 !important;
}
.woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] > label .pm-right {
    order: 2 !important;
    margin-left: auto !important; /* push icons to the right */
}

/* Ensure any images are not floated or absolutely positioned */
.woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] img {
    float: none !important;
    position: static !important;
}

/* Left block: title + optional description - allow wrapping */
.woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] > label .pm-left {
    align-self: center !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    flex: 1 1 auto !important;
    min-width: 0 !important; /* allow text to shrink and wrap inside flex */
}

/* Ensure left block text aligns nicely with title: add small left offset so
   content lines up with radio/checkmark and keep a right padding to avoid
   overlapping with icons */
.woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] > label .pm-left {
    padding-left: 6px !important;
    padding-right: 8px !important;
}

.woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] > label .pm-left .text-sm,
.woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] > label .pm-left .pm-desc {
    white-space: normal !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
}

/* Right block: icons */
.woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] > label .pm-right {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    /* Reserve a stable area on the right so left text never flows under icons */
    flex: 0 0 72px !important;
    min-width: 56px !important;
    justify-content: center !important;
    margin-left: 8px !important;
}

/* Keep icons vertically centered by default */
.woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] > label .pm-right {
    align-self: center !important;
}

/* Ensure pm-left can grow vertically and its content wraps cleanly */
.woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] > label .pm-left {
    flex: 1 1 0 !important;
}

.woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] > label .pm-right img,
.woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] img {
    /* Responsive scaling: min 16px, preferred 3.5vw, max 32px */
    height: clamp(16px, 3.5vw, 32px) !important;
    width: auto !important;
    display: block !important;
    object-fit: contain !important;
    max-height: 32px !important;
}

/* Override radio-button fixed height coming from other stylesheets.
   Use min-height so the container can grow when label wraps. */
.woocommerce-checkout .wc_payment_methods .radio-button,
.woocommerce-checkout .wc_payment_methods label.radio-button {
    height: auto !important;
    min-height: 32px !important;
}

/* Mobile tweak: shrink icons if needed */
@media (max-width: 768px) {
    .woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] > label .pm-right img,
    .woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] img {
        /* slightly smaller on very narrow screens */
        height: clamp(14px, 6vw, 24px) !important;
        max-width: 100% !important;
    }

    .woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] > label {
        padding-right: 12px !important;
        padding-left: 8px !important;
    }

    /* On narrow screens align items to top so title and description start
       at the same baseline (prevents vertical centering causing misalignment) */
    .woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] > label {
        align-items: flex-start !important;
    }

    /* Ensure icons stay visually centered relative to the label height */
    .woocommerce-checkout .wc_payment_methods li[class*="payment_method_payu"] > label .pm-right {
        /* keep icons vertically centered on mobile as well */
        align-self: center !important;
    }
}