/*Type here to edit*/

.title.text {
    text-shadow: 2px 2px 9px rgba(0, 0, 0, 1.9); /* Adjust the values for the desired effect */
}

.subtitle.text {
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5); /* Adjust the values for the desired effect */
}

.home .categories-wrapper {
    margin: 0 auto;
    width: 100%;
    content-visibility: hidden!important;
}

.cookies-ribbon {
    position: fixed;
    bottom: 0;
    background-color: #fff;
    color: var(--text-color-ultra-dark);
    box-shadow: 0 0 20px rgba(0, 0, 0, .12);
    width: 100%;
    z-index: 2;
    content-visibility: hidden;
}
.select-wrap {
    display: flex
;
    align-items: center;
    color: 000!important;
}

.budget-props {
    margin-left: 15px;
    color: 000!important;
}

@media (min-width: 1199px) and (max-width: 1919px) {
    .home .categories-wrapper {
        padding: 0px 0 0px !important;
    }
}

@media (min-width: 1199px) and (max-width: 1919px) {
    .home .featured-products-wrapper {
        padding: 10px 0;
    }
}

.ProductPreviewContainer {
    width: 100%;
    float: none;
    margin-top: 20px;
}
.ProductCustomizationContainer {
    width: 100%;
}

/* Make the tab container stack vertically without pushing content down */
.tab-content {
display: flex !important;
flex-direction: column !important;
align-items: stretch !important; /* children follow container width */
justify-content: flex-start !important; /* keep content at the top */
}

/* Customization on top */
#customization {
order: 1;
width: 100%;
margin-bottom: 20px;
}

/* Preview at the bottom and in normal document flow */
#preview {
order: 2;
width: 100%;
/* keep it part of its natural container (e.g., table cells) */
/* optional centering for inline content inside preview */
text-align: center;
}

/* Center only the known fixed-width preview wrappers.
This avoids touching tables so they remain tables. */
#preview #ctl00_cphMainContent_ucDialCustomization_pnlProdSlideShow,
#preview #ctl00_cphMainContent_ucDialCustomization_SlideShow_divWrapper,
#preview #SlideShow {
display: block !important;
margin-left: auto !important;
margin-right: auto !important;
}

/* Remove this block that was breaking tables in earlier attempts
#preview [style*="width"] {
margin-left: auto !important;
margin-right: auto !important;
display: block !important;
}
*/

/* Optional: if you had limited preview width before, remove it to keep it part of the table */
/* #preview { max-width: none; } */

/* Keep preview media responsive without affecting layout */
#preview img.customizationPreview,
#preview canvas {
max-width: 100%;
height: auto;
}