/* Layout, header, close control and backdrop come from the shared UI modal. */
/* Keep the root scroll lock used by base.css; do not create a body scroll container. */
html:has(body.child-product-dialog-open) { overflow: hidden; overscroll-behavior: none; }
body.child-product-dialog-open { overflow: clip; }
.child-product-dialog .child-ui-modal__body {
    overscroll-behavior: contain;
    overflow-wrap: anywhere;
}
.child-product-dialog-trigger--link { text-decoration: underline; text-underline-offset: .15em; }
a.child-product-dialog-trigger--button {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: .75rem 1rem;
    border: 1px solid var(--child-color-primary, #228be6);
    border-radius: var(--child-radius-control, 5px);
    background: var(--child-color-primary, #228be6);
    color: var(--child-color-primary-text, #fff);
    font-weight: 600;
    line-height: 1.4;
    text-align: center;
    text-decoration: none;
    white-space: normal;
}
a.child-product-dialog-trigger--button:is(:hover, :focus) { background: var(--child-color-primary-hover, #1c7ed6); border-color: var(--child-color-primary-hover, #1c7ed6); color: var(--child-color-primary-text, #fff); }
.child-product-dialog-trigger:focus-visible { outline: 2px solid var(--child-color-field-focus, #228be6); outline-offset: 3px; }