/*
 * assets/css/snappypay-checkout.css
 * Fallback logo sizing. Admin settings inject inline CSS that loads
 * after this and overrides it; these apply only if the inline is absent.
 */

/* Collapsed logo on the payment radio row */
.snappypay-rails-collapsed {
    display: block;         /* logo on its own line, not inline with text */
    height: auto;           /* height follows width to keep aspect ratio */
    max-height: 110px;      /* desktop cap — tallest the logo renders */
    width: auto;            /* width follows height automatically */
    max-width: 100%;        /* never wider than the checkout column */
    margin: 8px 0;          /* small gap above and below */
    object-fit: contain;    /* scale to fit without cropping or distorting */
}

@media (max-width: 480px) {
    .snappypay-rails-collapsed {
        width: 100%;        /* phones: fill full column width */
        height: auto;       /* height follows the width */
        max-height: none;   /* drop the desktop cap so it can grow */
    }
}

/* Full logo in the expanded description box — hidden until inline CSS (CheckoutWC only) sets a height */
.snappypay-rails-expanded {
    display: none;          /* off by default; CheckoutWC inline turns it on */
    width: auto;            /* width follows height */
    max-width: 100%;        /* never wider than the box */
    margin: 10px 0;         /* gap above and below */
    object-fit: contain;    /* scale to fit without cropping */
}