<div data-content-type="html" data-appearance="default" data-element="main">&lt;div id="fabric-modal-content" style="display:none;"&gt;
    &lt;div class="fabric-info-wrap"&gt;
        &lt;section class="fabric-section"&gt;
            &lt;h3 class="fabric-title"&gt;Knitted Polyester&lt;/h3&gt;
            &lt;table class="fabric-table"&gt;
                &lt;tr class="row-alt"&gt;
                    &lt;td class="col-head"&gt;Weight&lt;/td&gt;
                    &lt;td&gt;110g/m²&lt;/td&gt;
                &lt;/tr&gt;
                &lt;tr&gt;
                    &lt;td class="col-head"&gt;Flame Retardant&lt;/td&gt;
                    &lt;td&gt;B1 Rated is available on request&lt;/td&gt;
                &lt;/tr&gt;
                &lt;tr class="row-alt"&gt;
                    &lt;td class="col-head"&gt;Indoor / Outdoor Use&lt;/td&gt;
                    &lt;td&gt;Both&lt;/td&gt;
                &lt;/tr&gt;
                &lt;tr&gt;
                    &lt;td class="col-head"&gt;Print Method(s)&lt;/td&gt;
                    &lt;td&gt;Dye Sublimation / Latex / Screen&lt;/td&gt;
                &lt;/tr&gt;
                &lt;tr class="row-alt"&gt;
                    &lt;td class="col-head"&gt;Showthrough&lt;/td&gt;
                    &lt;td&gt;Very good&lt;/td&gt;
                &lt;/tr&gt;
                &lt;tr&gt;
                    &lt;td class="col-head"&gt;Suitable for Double Sided Print&lt;/td&gt;
                    &lt;td&gt;Yes, suitable&lt;/td&gt;
                &lt;/tr&gt;
            &lt;/table&gt;
        &lt;/section&gt;

        &lt;section class="fabric-section"&gt;
            &lt;h3 class="fabric-title"&gt;Polymesh&lt;/h3&gt;
            &lt;table class="fabric-table"&gt;
                &lt;tr class="row-alt"&gt;
                    &lt;td class="col-head"&gt;Weight&lt;/td&gt;
                    &lt;td&gt;115g/m²&lt;/td&gt;
                &lt;/tr&gt;
                &lt;tr&gt;
                    &lt;td class="col-head"&gt;Flame Retardant&lt;/td&gt;
                    &lt;td&gt;Yes — BS5867 Rated&lt;/td&gt;
                &lt;/tr&gt;
                &lt;tr class="row-alt"&gt;
                    &lt;td class="col-head"&gt;Indoor / Outdoor Use&lt;/td&gt;
                    &lt;td&gt;Both&lt;/td&gt;
                &lt;/tr&gt;
                &lt;tr&gt;
                    &lt;td class="col-head"&gt;Print Method(s)&lt;/td&gt;
                    &lt;td&gt;Dye Sublimation / Screen&lt;/td&gt;
                &lt;/tr&gt;
                &lt;tr class="row-alt"&gt;
                    &lt;td class="col-head"&gt;Showthrough&lt;/td&gt;
                    &lt;td&gt;Very good&lt;/td&gt;
                &lt;/tr&gt;
                &lt;tr&gt;
                    &lt;td class="col-head"&gt;Suitable for Double Sided Print&lt;/td&gt;
                    &lt;td&gt;No, not suitable&lt;/td&gt;
                &lt;/tr&gt;
            &lt;/table&gt;
        &lt;/section&gt;
    &lt;/div&gt;
&lt;/div&gt;

&lt;button type="button" class="info-trigger" id="fabric-info-btn" style="display:none;" aria-label="More information"&gt;?&lt;/button&gt;

&lt;style&gt;
/* Label Alignment */
label[for="select_1351"] {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    vertical-align: middle;
}

/* Question Mark Circle */
.info-trigger {
    width: 20px;
    height: 20px;
    background-color: #4d1965 !important;
    color: #ffffff !important;
    border: none;
    border-radius: 50% !important;
    font-size: 12px;
    font-weight: bold;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    transition: background 0.2s;
    flex-shrink: 0;
}
.info-trigger:hover { background-color: #002147; }

/* Modal Content Styling (Replacing Tailwind) */
.fabric-info-wrap { display: flex; flex-direction: column; gap: 32px; padding: 10px 0; }
.fabric-title { 
    text-align: center; 
    font-weight: bold; 
    color: #002147; 
    font-size: 1.25rem; 
    margin-bottom: 1rem; 
}
.fabric-table { 
    width: 100%; 
    border-collapse: collapse; 
    font-size: 13px; 
    border: 1px solid #e5e7eb; 
}
.fabric-table td { border: 1px solid #e5e7eb; padding: 8px; vertical-align: middle; }
.col-head { font-weight: bold; color: #002147; width: 50%; }
.row-alt { background-color: #f9fafb; }

/* Custom Modal Width for Table display */
.modal-popup.fabric-modal .modal-inner-wrap {
    max-width: 600px !important;
}
&lt;/style&gt;

&lt;script type="text/javascript"&gt;
    require([
        'jquery',
        'Magento_Ui/js/modal/modal',
        'domReady!'
    ], function($, modal) {
        'use strict';

        // Teleport Button to Label
        function moveInfoButton() {
            var targetLabel = $('label[for="select_1351"] span');
            if (targetLabel.length &amp;&amp; $('#fabric-info-btn').parent().prop("tagName") !== 'LABEL') {
                $('#fabric-info-btn').detach().insertAfter(targetLabel).show();
            }
        }
        moveInfoButton();
        setTimeout(moveInfoButton, 2500);

        // Initialize Modal
        var options = {
            type: 'popup',
            responsive: true,
            innerScroll: true,
            modalClass: 'fabric-modal',
            title: 'Fabric Specifications',
            buttons: [{
                text: 'Close',
                class: 'action-primary',
                click: function () { this.closeModal(); }
            }]
        };

        var fabricModal = modal(options, $('#fabric-modal-content'));

        $('body').on('click', '#fabric-info-btn', function(e) {
            e.preventDefault();
            e.stopPropagation();
            $('#fabric-modal-content').modal('openModal');
        });
    });
&lt;/script&gt;</div><div data-content-type="html" data-appearance="default" data-element="main">&lt;div id="fabric-modal-content" style="display:none;"&gt;
    &lt;div class="fabric-info-wrap"&gt;
        &lt;section class="fabric-section"&gt;
            &lt;h3 class="fabric-title"&gt;Knitted Polyester&lt;/h3&gt;
            &lt;table class="fabric-table"&gt;
                &lt;tr class="row-alt"&gt;&lt;td class="col-head"&gt;Weight&lt;/td&gt;&lt;td&gt;110g/m²&lt;/td&gt;&lt;/tr&gt;
                &lt;tr&gt;&lt;td class="col-head"&gt;Flame Retardant&lt;/td&gt;&lt;td&gt;B1 Rated is available on request&lt;/td&gt;&lt;/tr&gt;
                &lt;tr class="row-alt"&gt;&lt;td class="col-head"&gt;Indoor / Outdoor Use&lt;/td&gt;&lt;td&gt;Both&lt;/td&gt;&lt;/tr&gt;
                &lt;tr&gt;&lt;td class="col-head"&gt;Print Method(s)&lt;/td&gt;&lt;td&gt;Dye Sublimation / Latex / Screen&lt;/td&gt;&lt;/tr&gt;
                &lt;tr class="row-alt"&gt;&lt;td class="col-head"&gt;Showthrough&lt;/td&gt;&lt;td&gt;Very good&lt;/td&gt;&lt;/tr&gt;
                &lt;tr&gt;&lt;td class="col-head"&gt;Suitable for Double Sided Print&lt;/td&gt;&lt;td&gt;Yes, suitable&lt;/td&gt;&lt;/tr&gt;
            &lt;/table&gt;
        &lt;/section&gt;
        &lt;section class="fabric-section"&gt;
            &lt;h3 class="fabric-title"&gt;Polymesh&lt;/h3&gt;
            &lt;table class="fabric-table"&gt;
                &lt;tr class="row-alt"&gt;&lt;td class="col-head"&gt;Weight&lt;/td&gt;&lt;td&gt;115g/m²&lt;/td&gt;&lt;/tr&gt;
                &lt;tr&gt;&lt;td class="col-head"&gt;Flame Retardant&lt;/td&gt;&lt;td&gt;Yes — BS5867 Rated&lt;/td&gt;&lt;/tr&gt;
                &lt;tr class="row-alt"&gt;&lt;td class="col-head"&gt;Indoor / Outdoor Use&lt;/td&gt;&lt;td&gt;Both&lt;/td&gt;&lt;/tr&gt;
                &lt;tr&gt;&lt;td class="col-head"&gt;Print Method(s)&lt;/td&gt;&lt;td&gt;Dye Sublimation / Screen&lt;/td&gt;&lt;/tr&gt;
                &lt;tr class="row-alt"&gt;&lt;td class="col-head"&gt;Showthrough&lt;/td&gt;&lt;td&gt;Very good&lt;/td&gt;&lt;/tr&gt;
                &lt;tr&gt;&lt;td class="col-head"&gt;Suitable for Double Sided Print&lt;/td&gt;&lt;td&gt;No, not suitable&lt;/td&gt;&lt;/tr&gt;
            &lt;/table&gt;
        &lt;/section&gt;
    &lt;/div&gt;
&lt;/div&gt;

&lt;button type="button" class="info-trigger" id="fabric-info-btn" style="display:none;"&gt;?&lt;/button&gt;
&lt;button type="button" class="info-trigger" id="sleeve-info-btn" style="display:none;"&gt;?&lt;/button&gt;

&lt;style&gt;
/* Targets both Fabric (1351) and Sleeve (1352) labels */
label[for="select_1351"], label[for="select_1352"] {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    vertical-align: middle;
}

.info-trigger {
    width: 20px;
    height: 20px;
    background-color: #4d1965 !important;
    color: #ffffff !important;
    border: none;
    border-radius: 50% !important;
    font-size: 12px;
    font-weight: bold;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    transition: background 0.2s;
    flex-shrink: 0;
}
.info-trigger:hover { background-color: #002147; }

/* Table Styling */
.fabric-info-wrap { display: flex; flex-direction: column; gap: 32px; padding: 10px 0; }
.fabric-title { text-align: center; font-weight: bold; color: #002147; font-size: 1.25rem; margin-bottom: 1rem; }
.fabric-table { width: 100%; border-collapse: collapse; font-size: 13px; border: 1px solid #e5e7eb; }
.fabric-table td { border: 1px solid #e5e7eb; padding: 8px; vertical-align: middle; }
.col-head { font-weight: bold; color: #002147; width: 50%; }
.row-alt { background-color: #f9fafb; }

.modal-popup.fabric-modal .modal-inner-wrap { max-width: 600px !important; }
&lt;/style&gt;

&lt;script type="text/javascript"&gt;
    require([
        'jquery',
        'Magento_Ui/js/modal/modal',
        'domReady!'
    ], function($, modal) {
        'use strict';

        // 1. Move Buttons to their respective labels
        function moveButtons() {
            var fabricLabel = $('label[for="select_1351"] span');
            if (fabricLabel.length &amp;&amp; $('#fabric-info-btn').parent().prop("tagName") !== 'LABEL') {
                $('#fabric-info-btn').detach().insertAfter(fabricLabel).show();
            }

            var sleeveLabel = $('label[for="select_1352"] span');
            if (sleeveLabel.length &amp;&amp; $('#sleeve-info-btn').parent().prop("tagName") !== 'LABEL') {
                $('#sleeve-info-btn').detach().insertAfter(sleeveLabel).show();
            }
        }
        
        moveButtons();
        setTimeout(moveButtons, 2500); // Catch MageWorx dynamic load

        // 2. Initialize Modal for Fabric only
        var options = {
            type: 'popup',
            responsive: true,
            innerScroll: true,
            modalClass: 'fabric-modal',
            title: 'Fabric Specifications',
            buttons: [{
                text: 'Close',
                class: 'action-primary',
                click: function () { this.closeModal(); }
            }]
        };
        var fabricModal = modal(options, $('#fabric-modal-content'));

        // 3. Click Handlers
        $('body').on('click', '#fabric-info-btn', function(e) {
            e.preventDefault();
            e.stopPropagation();
            $('#fabric-modal-content').modal('openModal');
        });

        $('body').on('click', '#sleeve-info-btn', function(e) {
            e.preventDefault();
            e.stopPropagation();
            // Opens the guide in a new tab
            window.open('https://flags.co.uk/feather-flag-sleeve-guide', '_blank');
        });
    });
&lt;/script&gt;</div><div data-content-type="html" data-appearance="default" data-element="main">&lt;style&gt;
.theme-pearl.product-page-v3 .column.main .product-info-main,
.theme-pearl.product-page-v4 .column.main .product-info-main,
.theme-pearl.product-page-v3 .product_v3 .product.media {
    padding-top: 0px !important;
}
&lt;/style&gt;

&lt;style&gt;
@media screen and (min-width: 768px) {
  .theme-pearl .no-border .product.data.items {
    text-align: left;
  }
}
&lt;/style&gt;

&lt;style&gt;
#size_chart,
#size_chart:visited {
    color: blue !important;
    text-decoration: none;
}
#size_chart:hover {
    text-decoration: underline;
}
&lt;/style&gt;

&lt;style&gt;
.fotorama__stage {
    max-height: 600px !important;
    max-width: 95% !important;
    overflow: hidden;
    margin-left: auto; /* Adds equal margin to the left */
    margin-right: auto; /* Adds equal margin to the right */
    display: block; /* Ensures the element behaves like a block and responds to margins */
}

.options-list.nested {
display: flex;
gap: 20px;
}

/* Target the swatch container */
.mageworx-swatch-option.image {
    width: 150px !important;
    height: 150px !important;
    background-size: cover !important; /* Ensures the image fills the new 60px area */
    border-radius: 4px; /* Optional: adds a slight curve to the corners */
}

@media only screen and (max-width: 767px) {
    .mageworx-swatch-option.image {
        width: 100px !important;
        height: 100px !important;
        background-size: cover !important; /* Ensures image fills the 150px area */
        border-radius: 4px;
    }
}
&lt;/style&gt;</div><div data-content-type="html" data-appearance="default" data-element="main">&lt;style&gt;
/* 1. Global Container Fix */
.product-info-main {
    position: relative !important;
}

/* 2. Desktop Styles (Wide Screens - The Red Circle Area) */
@media (min-width: 768px) {
    .mw-deliverydate-info__term {
        position: absolute !important;
        /* Move up/down and left/right to hit your red circle exactly */
        top: 55px; 
        right: 0;
        
        margin: 0 !important;
        z-index: 100;
        white-space: nowrap;
    }

    /* Reset mobile gaps so desktop looks tight */
    .product-trust-icons-container {
        margin-top: 0 !important;
    }
    .product-info-price {
        margin-bottom: 20px !important;
    }
}

/* 3. Mobile Styles (Small Screens - Under Price, Above Icons) */
@media (max-width: 767px) {
    .mw-deliverydate-info__term {
        position: absolute !important;
        /* Adjust this to move it vertically into the gap */
        top: 135px; 
        left: 0;
        
        margin: 0 !important;
        display: flex !important;
        width: fit-content;
        z-index: 100;
    }

    /* Create the 'hole' for the badge to sit in */
    .product-trust-icons-container {
        margin-top: 65px !important; 
        clear: both;
        display: block !important;
    }

    /* Ensure price area doesn't overlap the badge */
    .product-info-price {
        margin-bottom: 60px !important; 
    }
}

/* 4. Global Styling (Appearance) */
.mw-deliverydate-info__term {
    padding: 8px 12px;
    background-color: #FBFFED !important;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.mw-deliverydate-info__term, 
.mw-deliverydate-info__term span,
.mw-deliverydate-info__term__icon {
    color: #363636 !important;
    font-size: 13px;
    font-weight: bold;
    text-decoration: none !important;
}
&lt;/style&gt;</div><div data-content-type="block" data-appearance="default" data-element="main">{{widget type="Magento\Cms\Block\Widget\Block" template="widget/static_block/default.phtml" block_id="741" type_name="CMS Static Block"}}</div>