/**
 * Big Pixel Studio - Donation notice.
 *
 * Structure and spacing only. Background, text and border colours are applied
 * inline from Stores > Configuration so the client can restyle the notice
 * without a deployment.
 */

.bigpixel-donation-notice {
    border: 1px solid transparent;
    border-radius: 2px;
    padding: 12px 15px;
    margin: 15px 0;
    line-height: 1.4;
    font-size: 1rem;
}

.bigpixel-donation-notice__text a {
    color: inherit;
    text-decoration: underline;
}

/* Inline: sits directly under the donation form inside the summary block. */
.bigpixel-donation-notice-slot--inline .bigpixel-donation-notice {
    margin: 15px 0 20px;
}

/* Page bottom: full width band above the site footer. */
.bigpixel-donation-notice-slot--page_bottom {
    clear: both;
}

.bigpixel-donation-notice-slot--page_bottom .bigpixel-donation-notice {
    margin: 30px 0 10px;
    padding: 15px 20px;
}

/* Tighten spacing on small screens. Font size intentionally inherits the
   base rule so the notice does not grow on mobile. */
/* Product detail page: sits at the end of the product info column. */
.bigpixel-donation-notice-slot--product {
    clear: both;
}

.bigpixel-donation-notice-slot--product .bigpixel-donation-notice {
    margin: 20px 0 10px;
}

@media (max-width: 767px) {
    .bigpixel-donation-notice {
        padding: 10px 12px;
    }
}