/* Product Detail page */
.palmer-accordion-finishes {
    margin-top: 2%;
    display: flex;
    width: 100%;
    gap: 11px;
    justify-content: space-evenly;
}

.palmer-accordion-content-finishes img {
    border: none !important;
}

.palmer-accordion-content-optionses img {
    border: 1px solid #827f7f;
    max-width: 100%;
    min-width: 100%;
}

.palmer-accordion-content-shelveses img {
    border: 1px solid #827f7f;
    max-width: 180px;
    min-width: 180px;
}

.palmer-accordion-content-shelveses img {
	width: 100%;
	height: auto;
}

.palmer-accordion-content-shelf-supportes img {
    border: 1px solid #827f7f;
    max-width: 120px;
    min-width: 100px;
}

.palmer-accordion-content-text {
    margin-top: 12px;
}

.palmer-accordion-shelveses {
    display: flex;
    gap: 6%;
    text-wrap-style: balance;
    justify-content: space-evenly;
}

.palmer-accordion-shelf-supportes {
    display: flex;
    gap: 5%;
    margin-top: 3%;
}

/* Product Detail page */

.palmer-accordion-content-finishes-text,
.palmer-accordion-content-shelveses-text,
.palmer-accordion-content-shelf-supportes-text,
.palmer-accordion-content-optionses-text,
.palmer-accordion-content-mountingses-text,
.palmer-accordion-content-hookses-text,
.palmer-accordion-content-finialses-text {
    font-size: 16px;
    line-height: 1.2;
    margin-top: .5em;
    margin-bottom: .2em;
	margin-right: 2em;
}

.palmer-accordion-optionses {
	display: flex;
	gap: 5%;
	padding-bottom: 30px;
}

.palmer-accordion-optionses:last-child {
	border-bottom: 1px solid #000;
}


.palmer-accordion {
    display: grid;
    gap: 10px;
}

.palmer-accordion.one-columns {
    grid-template-columns: 1fr;
}

.palmer-accordion.two-columns {
    grid-template-columns: 1fr 1fr;
}

.palmer-accordion.three-columns {
    grid-template-columns: 1fr 1fr 1fr;
}

.palmer-accordion.four-columns {
    grid-template-columns: 1fr 1fr 1fr 1fr;
}

.palmer-accordion.five-columns {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}

.palmer-accordion.six-columns {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
}


/* popup */
.popup-inner-content .acc-img-close-btn {
    display: flex;
    justify-content: center;
}

.popup-inner-content .acc-img-close-btn img {
    margin: 0;
}
.product-finishes-popup .aligncenter {
    max-height: 100%;
}

.popup-inner-content {
	width: 80%;
	max-width: 80vw;
	margin: 0 auto;
	text-align: left;
	position: relative;
}

.popup-flex-container {
	align-items: center;
	display: flex;
	padding: 20px 20px;
	gap: 20px;
	background: #fff;
	width: 80%;
}

.popup-para-header {
    font-family: 'Baskervville';
    font-weight: 600;
    font-size: 28px;
    padding-bottom: 30px;
}


.popup-para-content {
	overflow: auto;
	max-height: unset;
	background-color: white;
	padding: 15px 30px;
	text-align: left;

	/* margin: 0; */
	color: #19181899;
	font-family: "Jost";
	font-size: 18px;
	font-weight: 400;
	line-height: 25.2px;
}

.popup-flex-container .aligncenter {
	width: 60%;
	margin-bottom: 0;
	max-height: unset;
	border: 1px solid rgb(126 116 116);
}

.popup-para-content div {
	margin: 10px 0;
}

.popup-para-content .palmer-button.palmer-primary-btn a {
	color: #242424 !important;
	font-family: "jost";
	font-size: 18px;
	font-weight: 400;
	line-height: 25.2px;
	letter-spacing: 0;
}

.popup-para-content .palmer-button.palmer-primary-btn a::after {
	content: none;
}

.popup-para-content .palmer-button.palmer-primary-btn {
	border-radius: 0;
}

.popup-para-content ul {
	margin: 0 0 10px 0;
	padding: 0px;
}

.popup-para-content ul li {
	margin: 0px 10px 0px 0px;
	padding: 0px;
	display: inline-block;
	position: relative;
	font-family: "Jost";
	font-weight: 400;
	line-height: 25.2px;
}

.popup-para-content ul li a {
	color: #19181899;
}

.popup-para-content ul li:before {
	content: "•";
	display: inline-block;
	font-size: 30px;
	margin-right: 5px;
	vertical-align: -9px;
}

.popup-para-content {
	color: #676767;
}

.popup-inner-content a.popup-para-pdf {
	display: flex;
}

.popup-inner-content a img.alignnone {
	width: 20px;
	height: 20px;
}

.aligncenter {
	width: 50%;
	margin-bottom: 0;
	max-height: 480px;
	border: 1px solid rgb(126 116 116);
}

@media (max-width: 769px) {
    .palmer-accordion {
		display: flex !important;
		flex-wrap: wrap;
		justify-content: space-evenly;
	}
    
    /* section - 1  accodian - Finishes */
    .palmer-accordion-content-finishes,
    .palmer-accordion-content-mountingses,
    .palmer-accordion-content-finialses,
    .palmer-accordion-content-hookses,
    .palmer-accordion-content-configurationses {
        width: 47%;
    }

    .palmer-accordion-finishes {
        flex-wrap: wrap;
    }

    /* section - 1  accodian - Shelving and Shelf Supports, Options */
    .palmer-accordion-shelveses,
    .palmer-accordion-shelf-supportes,
    .palmer-accordion-optionses {
        flex-wrap: wrap;
    }

    .palmer-accordion-content-shelveses,
    .palmer-accordion-content-shelf-supportes,
    .palmer-accordion-content-optionses {
        width: 47%;
    }

    .palmer-accordion-content-shelveses img,
    .palmer-accordion-content-shelf-supportes img,
    .palmer-accordion-content-optionses img {
        max-width: 100%;
        min-width: 100%;
    }

    .palmer-product-content-container .elementor-button-wrapper {
        text-align: left;
    }

    .palmer-product-content-container .palmer-product-button-container .e-con-full {
        justify-content: flex-start;
    }

    .palmer-product-button-container {
        gap: 20px;
    }

    /* popups */
    .popup-flex-container {
        flex-direction: column;
		width:100%;
    }

    .popup-flex-container .aligncenter {
        width: 100%;
    }

    .aligncenter {
        width: 90%;
    }

    .mfp-content .mfp-close {
        top: -40px !important;
    }
}

@media (min-width: 768px) and (max-width: 1300px) {

    .palmer-accordion {
		display: flex !important;
		flex-wrap: wrap;
		justify-content: space-evenly;
	}

    /* section - 1  accodian - Finishes, Shelving and Shelf Supports, Options */
    .palmer-accordion-finishes,
    .palmer-accordion-shelveses,
    .palmer-accordion-shelf-supportes,
    .palmer-accordion-optionses {
        flex-wrap: wrap;
        display: flex;
    }

    .palmer-accordion-content-finishes,
    .palmer-accordion-content-shelveses,
    .palmer-accordion-content-shelf-supportes,
    .palmer-accordion-content-optionses {
        /* width: 20%; */
        width: 20%;
    }

    .palmer-accordion-content-mountingses,
    .palmer-accordion-content-finialses,
    .palmer-accordion-content-hookses,
    .palmer-accordion-content-configurationses {
        width: 47%;
    }

    .palmer-accordion-content-shelveses img,
    .palmer-accordion-content-shelf-supportes img,
    .palmer-accordion-content-optionses img {
        max-width: 100%;
        min-width: 100%;
    }
}
/* Hover scrim container */
.palmer-grid-item {
    position: relative;
    display: block; /* works for <a> and <div> */
    line-height: 0; /* avoids tiny gaps under images */
}

.palmer-grid-item img {
    display: block;
    width: 100%;
    height: auto;
}

/* Scrim overlay */
.palmer-hover-scrim {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;

    opacity: 0;
    transition: opacity 200ms ease;
    background: rgba(0, 0, 0, 0.7);

    pointer-events: none; /* keeps the link clickable */
}

.palmer-hover-scrim__title {
    padding: 10px 14px;
   /* background: rgba(0, 0, 0, 0.55); */
    color: #fff;
    font-size: 16px;
    line-height: 1.2;
    text-align: center;
}

/* Show on hover + keyboard focus */
.palmer-grid-item.has-hover-scrim:hover .palmer-hover-scrim,
.palmer-popup-link.has-hover-scrim:focus .palmer-hover-scrim,
.palmer-popup-link.has-hover-scrim:focus-visible .palmer-hover-scrim {
    opacity: 1;
}

/* Finish tile: fixed border container */
.palmer-accordion-content-finishes a.palmer-popup-link.palmer-grid-item{
  display: block;
  border: 1px solid #827f7f;   /* border stays static */
  overflow: hidden;            /* clips zoom inside */
}

/* Image zooms inside border */
.palmer-accordion-content-finishes a.palmer-popup-link.palmer-grid-item img{
  display: block;
  width: 100%;
  height: auto;

  transform: scale(1);
  transition: transform 180ms ease;
  transform-origin: center;
}

/* Subtle hover indicator */
.palmer-accordion-content-finishes a.palmer-popup-link.palmer-grid-item:hover img,
.palmer-accordion-content-finishes a.palmer-popup-link.palmer-grid-item:focus-visible img{
  transform: scale(1.03);
}

/* Hide the default minus icon */
.e-n-accordion-item-title .e-opened {
    display: none;
}

/* Always show plus */
.e-n-accordion-item-title .e-closed {
    display: flex;
    transition: transform 300ms ease;
}

/* Rotate to × when open */
.e-n-accordion-item[open] .e-n-accordion-item-title .e-closed {
    transform: rotate(45deg);
}

.e-n-accordion-item-title .e-opened {
    display: none !important;
}

.e-n-accordion-item-title .e-closed {
    display: flex !important;
    transition: transform 300ms ease;
}

.e-n-accordion-item[open] .e-n-accordion-item-title .e-closed {
    transform: rotate(45deg);
}

#product-resources .accordion-icon {
    font-family: inherit;
}

html {
    scroll-behavior: auto !important;
}


/* Gray overlay */
.mfp-bg {
    background: rgba(0, 0, 0, 0.65) !important;
    opacity: 1 !important;
}

/* White modal box */
.mfp-content {
    background: #fff !important;
    max-width: 560px !important;
    width: 90% !important;
    margin: 0 auto !important;
    border-radius: 2px !important;
    padding: 48px 44px 40px !important;
    position: relative !important;
    text-align: left !important;
    box-shadow: 0 8px 40px rgba(0,0,0,0.18) !important;
    overflow: hidden !important;
}

.mfp-content * {
    text-align: left !important;
}

.mfp-content .popup-para-header,
.mfp-content .hide-content .popup-para-header,
.mfp-content .popup-inner-content .popup-para-header,
.mfp-content .popup-flex-container .popup-para-header,
.mfp-content .popup-para-content .popup-para-header {
    text-align: left !important;
}

/* Reset all inner wrappers */
.mfp-content .popup-inner-content,
.mfp-content .popup-inner-content > .popup-para-content,
.mfp-content .popup-flex-container {
    all: unset !important;
    display: block !important;
    width: 100% !important;
}

/* Image — full width, capped height */
.mfp-content .popup-flex-container > img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 420px !important;
    object-fit: contain !important;
    object-position: center !important;
    background: #f7f7f5 !important;
    margin: -48px -44px 32px -44px !important;
    width: calc(100% + 88px) !important;
    border: none !important;
    float: none !important;
}

/* Title */
.mfp-content .popup-para-header {
    font-family: 'Baskervville', serif !important;
    font-size: 24px !important;
    font-weight: 400 !important;
    color: #1a1a1a !important;
    margin: 0 0 16px 0 !important;
    padding: 0 0 16px 0 !important;
    line-height: 1.2 !important;
    letter-spacing: 0.01em !important;
    border-bottom: 1px solid #e8e8e6 !important;
    display: block !important;
    text-align: left !important;
}

/* Inner text content */
.mfp-content .popup-flex-container > .popup-para-content {
    all: unset !important;
    display: block !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 15px !important;
    line-height: 1.7 !important;
    color: #555 !important;
}

.mfp-content .popup-flex-container > .popup-para-content > div {
    margin: 10px 0 !important;
    font-size: 15px !important;
    line-height: 1.7 !important;
    color: #555 !important;
}

/* CTA button — understated, inline text link style */
.mfp-content .palmer-button.palmer-primary-btn {
    margin-top: 24px !important;
    display: block !important;
}

.mfp-content .palmer-primary-btn a {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 0 !important;
    background: none !important;
    color: #1a1a1a !important;
    border: none !important;
    border-bottom: 1px solid #1a1a1a !important;
    border-radius: 0 !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    padding-bottom: 3px !important;
    transition: opacity 200ms ease !important;
}

.mfp-content .palmer-primary-btn a:hover {
    opacity: 0.5 !important;
    color: #1a1a1a !important;
    background: none !important;
}

/* Close button */
.mfp-close {
    position: absolute !important;
    top: 14px !important;
    right: 18px !important;
    font-size: 24px !important;
    line-height: 1 !important;
    color: #aaa !important;
    background: none !important;
    border: none !important;
    cursor: pointer !important;
    opacity: 1 !important;
    padding: 0 !important;
    width: auto !important;
    height: auto !important;
    z-index: 9999 !important;
}

.mfp-close:hover {
    color: #1a1a1a !important;
}

/* Mobile */
@media (max-width: 600px) {
    .mfp-content {
        padding: 36px 24px 28px !important;
    }
    .mfp-content .popup-flex-container > img {
        max-height: 200px !important;
    }
}

.mfp-content .palmer-primary-btn a i {
    display: none !important;
}

/* Popup image */
.mfp-content .popup-main-img {
    display: block !important;
    margin: 0 auto 20px auto !important;
    max-height: 320px !important;
    max-width: 100% !important;
    width: auto !important;
    height: auto !important;
    border: none !important;
}

/* Title */
.mfp-content .popup-para-header {
    font-family: 'Baskervville', serif !important;
    font-size: 42px !important;
    font-weight: 600 !important;
    color: #000 !important;
    margin: 0 0 12px 0 !important;
    padding: 0 !important;
    text-align: center !important;
}

.mfp-content .popup-flex-container > .popup-para-content > div.popup-para-header,
.mfp-content .popup-para-content div.popup-para-header {
    font-size: 32px !important;
    font-family: 'Baskervville', serif !important;
    font-weight: 400 !important;
    margin: 0 0 16px 0 !important;
    line-height: 1.2 !important;
    color: #1a1a1a !important;
    text-align: left !important;
}

.mfp-content .popup-inner-content,
.mfp-content .hide-content,
.mfp-content .popup-para-content,
.mfp-content .popup-flex-container {
    pointer-events: auto !important;
    cursor: default !important;
}

.mfp-wrap {
    cursor: default !important;
}


/* Description text */
.mfp-content .popup-para-content {
    font-family: 'Jost', sans-serif !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
    color: #444 !important;
    text-align: center !important;
    padding: 0 !important;
    background: none !important;
    max-height: none !important;
    overflow: visible !important;
}

/* X close button */
.mfp-close {
    position: absolute !important;
    top: 10px !important;
    right: 14px !important;
    font-size: 28px !important;
    line-height: 1 !important;
    color: #333 !important;
    background: none !important;
    border: none !important;
    cursor: pointer !important;
    opacity: 1 !important;
    padding: 0 !important;
    width: auto !important;
    height: auto !important;
    z-index: 9999 !important;
}

.mfp-close:hover {
    color: #000 !important;
}

/* Let the popup content receive clicks normally;
   the JS handler above prevents bubbling to the backdrop. */
.mfp-wrap .mfp-container .mfp-content .hide-content,
.mfp-wrap .mfp-container .mfp-content .hide-content * {
    pointer-events: auto !important;
}

.mfp-close {
    pointer-events: auto !important;
}

/* Hide duplicate mobile close button */
.mfp-content button.mfp-close-mobile {
    display: none !important;
}


/* Force MFP overlay to render correctly */
.mfp-bg {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 99999 !important;
    background: rgba(0,0,0,0.65) !important;
    opacity: 1 !important;
}

.mfp-wrap {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 100000 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: auto !important;
}

.mfp-container {
    position: relative !important;
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.mfp-content .popup-para-content img {
    display: block !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
    border: none !important;
}

.mfp-content .popup-para-content {
    padding: 0 !important;
    background: none !important;
    text-align: center !important;
}