/* Shared product-description spacing. No product content or page grid changes.
 * Text gets one inset; existing Bootstrap snippet gutters supply most/all of it.
 * Media-only blocks and standalone calls to action retain their original position.
 */
#wrap:has(#product_detail) {
    --lg-description-target: 20px;
    --lg-description-inset: var(--lg-description-target);
    --lg-short-description-inset: 20px;
}

/* Odoo 19, Kramp source descriptions, and the legacy product templates. */
#product_details :is(
    .o_wsale_product_details_content_section_title > .oe_structure,
    .lg_kramp_short_description,
    p.text-muted[placeholder]
) {
    box-sizing: border-box;
    padding-inline: var(--lg-short-description-inset, 20px);
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
}

/* Keep the full description below the product and at its existing full width. */
#wrap:has(#product_detail) #product_full_description {
    min-width: 0;
    overflow-wrap: anywhere;
}

/* Text-only content blocks: apply once at the outermost text block.
 * Excluding snippet/grid/media wrappers avoids nested padding and moving images.
 */
#product_full_description > :is(p, h1, h2, h3, h4, h5, h6, blockquote, pre, dl, div):not(:has(
    .container, .container-fluid, .row, section, [data-snippet],
    img, picture, figure, video, iframe, .media_iframe_video, .btn
)):not(.row, .container, .container-fluid, .media_iframe_video),
#product_full_description :is(.container, .container-fluid, .row > [class*="col"])
    > :is(p, h1, h2, h3, h4, h5, h6, blockquote, pre, dl, div):not(:has(
        .container, .container-fluid, .row, section, [data-snippet],
        img, picture, figure, video, iframe, .media_iframe_video, .btn
    )):not(.row, .container, .container-fluid, .media_iframe_video) {
    box-sizing: border-box;
    padding-inline: var(--lg-description-inset, 20px) !important;
    min-width: 0;
    max-width: 100%;
}

/* A snippet already has half a Bootstrap gutter on each side. Add only the
 * difference; keep its container, columns, backgrounds, buttons and images. */
#product_full_description :is(.container, .container-fluid, .row > [class*="col"]) {
    --lg-description-inset: max(0px, calc(var(--lg-description-target, 20px) - var(--bs-gutter-x, 30px) / 2));
}

/* Plain-text descriptions without rich-text block markup. */
#product_full_description:not(:has(> :is(p, div, section, table, ul, ol, h1, h2, h3, h4, h5, h6, img, figure, iframe, .btn))) {
    box-sizing: border-box;
    padding-inline: var(--lg-description-target, 20px);
}

/* Lists retain their markers and nesting; tables keep the same modest inset. */
#product_full_description > :is(ul, ol) {
    padding-inline: calc(var(--lg-description-target, 20px) + 1.25em) var(--lg-description-target, 20px);
}
#product_full_description > table {
    margin-inline: var(--lg-description-target, 20px);
    max-width: calc(100% - 2 * var(--lg-description-target, 20px)) !important;
}
#product_full_description :is(.container, .container-fluid, .row > [class*="col"]) > table {
    margin-inline: var(--lg-description-inset);
    max-width: calc(100% - 2 * var(--lg-description-inset)) !important;
}

/* Kramp sections are already containers: replace their gutter, never add one. */
#wrap:has(#product_detail) :is(.lg_kramp_long_description, .lg_kramp_specifications) {
    box-sizing: border-box;
    padding-inline: var(--lg-description-target, 20px);
    min-width: 0;
    overflow-wrap: anywhere;
}

@media (max-width: 767.98px) {
    #wrap:has(#product_detail) {
        --lg-description-target: 14px;
        /* The product details column already has 15px gutters on mobile. */
        --lg-short-description-inset: 0px;
    }
    #product_full_description :is(table),
    #product_details :is(.o_wsale_product_details_content_section_title > .oe_structure, .lg_kramp_short_description) table,
    #wrap:has(#product_detail) .lg_kramp_specifications table {
        display: block;
        box-sizing: border-box;
        min-width: 0 !important;
        max-width: 100%;
        overflow-x: auto;
        overscroll-behavior-inline: contain;
    }
    /* Imported fixed-width media must fit the existing description column. */
    #product_full_description :is(img, video),
    #product_details .o_wsale_product_details_content_section_title > .oe_structure img {
        max-width: 100% !important;
        height: auto !important;
    }
    #product_full_description iframe {
        max-width: 100% !important;
    }
    /* An orphaned row has no container to absorb Bootstrap's negative margins. */
    #product_full_description > .row,
    #product_full_description > :not(.container, .container-fluid, [class*="col"]) > .row {
        margin-inline: 0 !important;
    }
}