/* Fluent Review Slider — FC Ecom Suite 6.0.249. Cloned from the Shop Scent Profile contract: transparent Bricks root, single visible inner card, same white face, border, radius, and centered viewport-width shell. 6.0.185: customer-photo media frame reduced by 3/4 inch on desktop and changed to a phone-photo 3:4 frame so uploaded mobile photos do not look oversized or lose the lower subject area. */ .fcc-fluent-review-slider-element, .fcc-review-slider, .fcc-review-slider *{box-sizing:border-box} .fcc-fluent-review-slider-element{width:100%;max-width:100%;min-width:0;background:transparent!important;border:0!important;box-shadow:none!important;overflow:visible!important} .fcc-review-slider{position:relative;left:50%;transform:translateX(-50%);width:min(var(--fcc-rs-max-width,1538px),calc(100vw - 48px));max-width:none;min-width:0;margin:0;padding:0;color:var(--fcc-rs-text,#00594f);font-family:Helvetica,Arial,sans-serif;background:transparent!important;border:0!important;box-shadow:none!important;overflow:visible!important} .fcc-review-slider__inner{position:relative;width:100%;background:var(--fcc-rs-bg,#fff);border:1px solid var(--fcc-rs-border,#dddedf);border-radius:var(--fcc-rs-radius,7px);min-height:var(--fcc-rs-section-height,520px);padding:56px clamp(20px,5vw,64px);overflow:hidden;display:flex;flex-direction:column;color:var(--fcc-rs-text,#00594f);background-clip:padding-box} .fcc-review-slider__topline{display:flex;align-items:center;justify-content:center;text-align:center;margin:0 0 28px;flex:0 0 auto}.fcc-review-slider__heading{margin:0;color:var(--fcc-rs-heading,#004f49);font-family:Georgia,"Times New Roman",serif;font-size:52px;line-height:1.05;font-weight:400;letter-spacing:0;text-align:center}.fcc-review-slider:has(.fcc-review-slider__filters) .fcc-review-slider__heading{padding-left:calc((var(--fcc-rs-filter-button-size,34px) * 2) + 24px);padding-right:calc((var(--fcc-rs-filter-button-size,34px) * 2) + 24px)} .fcc-review-slider>.fcc-review-slider__inner>.fcc-review-slider__filters{position:absolute!important;top:7px!important;right:7px!important;bottom:auto!important;left:auto!important;inset-block-start:7px!important;inset-inline-end:7px!important;inset-block-end:auto!important;inset-inline-start:auto!important;z-index:50;display:flex!important;flex-flow:row nowrap!important;align-items:center;justify-content:flex-end;gap:7px;width:calc((var(--fcc-rs-filter-button-size,34px) * 2) + 7px)!important;inline-size:calc((var(--fcc-rs-filter-button-size,34px) * 2) + 7px)!important;min-width:calc((var(--fcc-rs-filter-button-size,34px) * 2) + 7px);min-inline-size:calc((var(--fcc-rs-filter-button-size,34px) * 2) + 7px);max-width:calc(100% - 14px);max-inline-size:calc(100% - 14px);margin:0!important;padding:0!important;overflow:visible!important;transform:none!important;translate:none!important}.fcc-review-slider__filter{appearance:none;display:inline-flex!important;flex:0 0 var(--fcc-rs-filter-button-size,34px);align-items:center;justify-content:center;width:var(--fcc-rs-filter-button-size,34px);height:var(--fcc-rs-filter-button-size,34px);min-width:var(--fcc-rs-filter-button-size,34px);min-height:var(--fcc-rs-filter-button-size,34px);padding:0;border:var(--fcc-rs-filter-border-width,1px) solid var(--fcc-rs-filter-color,#000);background:transparent;color:var(--fcc-rs-filter-color,#000);border-radius:var(--fcc-rs-filter-radius,5px);cursor:pointer;transition:border-color 160ms ease,box-shadow 160ms ease,background-color 160ms ease}.fcc-review-slider__filter:hover,.fcc-review-slider__filter:focus-visible{outline:none;box-shadow:0 0 0 2px rgba(0,0,0,.08)}.fcc-review-slider__filter.is-active{background:transparent;box-shadow:none}.fcc-review-slider__filter:focus-visible{outline:1px solid var(--fcc-rs-filter-color,#000);outline-offset:3px} .fcc-review-slider__filter-icon{position:relative;display:block;width:var(--fcc-rs-filter-icon-size,22px);height:var(--fcc-rs-filter-icon-size,22px);flex:0 0 var(--fcc-rs-filter-icon-size,22px);color:currentColor}.fcc-review-slider__filter-custom-icon{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;object-position:center;pointer-events:none}.fcc-review-slider__filter-icon--product span{position:absolute;width:9px;height:9px;border:1px solid currentColor;border-radius:2px}.fcc-review-slider__filter-icon--product span:nth-child(1){left:0;top:0}.fcc-review-slider__filter-icon--product span:nth-child(2){right:0;top:0}.fcc-review-slider__filter-icon--product span:nth-child(3){left:0;bottom:0}.fcc-review-slider__filter-icon--product span:nth-child(4){right:0;bottom:0}.fcc-review-slider__filter-icon--google span{position:absolute;top:3px;bottom:3px;border:1px solid currentColor;border-radius:3px}.fcc-review-slider__filter-icon--google span:nth-child(1){left:0;width:4px}.fcc-review-slider__filter-icon--google span:nth-child(2){left:7px;width:8px}.fcc-review-slider__filter-icon--google span:nth-child(3){right:0;width:4px}.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-wrap:normal!important} .fcc-review-slider__viewport{width:100%;min-width:0;min-height:0;overflow:hidden;outline:none;flex:1 1 auto}.fcc-review-slider__viewport:focus-visible{outline:1px solid #00594f;outline-offset:4px}.fcc-review-slider__track{display:flex;flex-wrap:nowrap;gap:var(--fcc-rs-gap,22px);width:100%;min-width:100%;min-height:calc(var(--fcc-rs-card-height,360px) + 26px);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scroll-behavior:auto;-webkit-overflow-scrolling:touch;padding:2px 2px 24px;margin:0 -2px;scrollbar-width:none;scrollbar-color:transparent transparent}.fcc-review-slider__track::-webkit-scrollbar{width:0;height:0;display:none}.fcc-review-slider__track::-webkit-scrollbar-track{background:transparent}.fcc-review-slider__track::-webkit-scrollbar-thumb{background:transparent;border-radius:999px} .fcc-review-card{flex:0 0 max(var(--fcc-rs-card-width,300px),300px);width:max(var(--fcc-rs-card-width,300px),300px);height:var(--fcc-rs-card-height,360px);min-height:var(--fcc-rs-card-height,360px);scroll-snap-align:start;background:#fff;border:1px solid rgba(0,89,79,.12);border-radius:8px;overflow:hidden;display:flex;flex-direction:column;box-shadow:none;color:var(--fcc-rs-text,#00594f)}.fcc-review-card__image-wrap{position:relative;flex:0 0 162px;width:100%;background:#f5f8f5;overflow:hidden}.fcc-review-card__image{display:block;width:100%;height:100%;object-fit:cover}.fcc-review-card__image--placeholder{position:relative;width:100%;height:100%;background:linear-gradient(135deg,#e9f3ea,#f7faf7);overflow:hidden}.fcc-review-card__image--placeholder span{position:absolute;display:block;border-radius:999px;background:rgba(0,89,79,.10)}.fcc-review-card__image--placeholder span:first-child{width:74px;height:74px;left:28px;top:32px}.fcc-review-card__image--placeholder span:last-child{width:104px;height:104px;right:-20px;bottom:-30px}.fcc-review-card__placeholder--jar{background:linear-gradient(135deg,#f2efe7,#fbfaf4)}.fcc-review-card__placeholder--bottle{background:linear-gradient(135deg,#eaf2f5,#f8fbfc)}.fcc-review-card__placeholder--round{background:linear-gradient(135deg,#f2ecf2,#fbf8fb)}.fcc-review-card__placeholder--box{background:linear-gradient(135deg,#eef4ec,#fafcf8)}.fcc-review-card__placeholder--dropper{background:linear-gradient(135deg,#edf1f4,#fbfcfd)}.fcc-review-card__product-thumb{position:absolute;right:10px;bottom:10px;width:48px;height:48px;border-radius:999px;border:2px solid #fff;object-fit:cover;background:#fff;box-shadow:0 4px 12px rgba(0,0,0,.13)}.fcc-review-card__body{display:flex;flex-direction:column;gap:6px;min-height:0;padding:14px 14px 12px;flex:1 1 auto}.fcc-review-card__reviewer{font-size:12px;line-height:1.2;font-weight:700;color:#004f49}.fcc-review-card__title{margin:0;font-size:15px;line-height:1.16;font-weight:700;color:#002e25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.fcc-review-card__statement{margin:0;font-size:13px;line-height:1.32;color:var(--fcc-rs-text,#00594f);display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}.fcc-review-card__stars{margin-top:auto;font-size:14px;line-height:1;color:#00594f;letter-spacing:.04em}.fcc-review-card__stars-empty{opacity:.32}.fcc-review-card__meta{display:flex;align-items:center;gap:5px;min-width:0;font-size:11px;line-height:1.2;font-weight:600;opacity:.84}.fcc-review-card__meta span:last-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fcc-review-card__dot{flex:0 0 auto}.fcc-review-slider[data-fcc-review-active-filter="product"] .fcc-review-card[data-fcc-review-source="google"],.fcc-review-slider[data-fcc-review-active-filter="google"] .fcc-review-card:not([data-fcc-review-source="google"]){display:none}.fcc-review-slider__empty{width:100%;padding:24px;border:1px dashed rgba(31,46,60,.18);border-radius:8px;color:#1f2e3c;background:rgba(255,255,255,.6);font-size:15px;line-height:1.5} @media(max-width:1199px){.fcc-review-slider{width:min(var(--fcc-rs-max-width,1538px),calc(100vw - 32px));max-width:none}.fcc-review-slider__inner{padding:clamp(34px,5vw,54px)!important}.fcc-review-slider__heading{font-size:clamp(40px,4.4vw,52px)}.fcc-review-card{flex-basis:clamp(286px,38vw,max(var(--fcc-rs-card-width,300px),300px));width:clamp(286px,38vw,max(var(--fcc-rs-card-width,300px),300px));scroll-snap-align:center}} @media(max-width:767px){.fcc-review-slider{left:auto;transform:none;width:100%;max-width:100%;padding:0 12px;margin:0 auto}.fcc-review-slider__inner{min-height:auto;padding:24px 20px 28px!important}.fcc-review-slider__topline{margin-bottom:18px}.fcc-review-slider__heading{font-size:36px;line-height:1.05}.fcc-review-slider:has(.fcc-review-slider__filters) .fcc-review-slider__heading{padding-left:calc((var(--fcc-rs-filter-button-size,34px) * 2) + 20px);padding-right:calc((var(--fcc-rs-filter-button-size,34px) * 2) + 20px)}.fcc-review-slider__track{--fcc-rs-mobile-gap:clamp(16px,3vw,var(--fcc-rs-gap,20px));gap:var(--fcc-rs-mobile-gap);padding:2px 0 14px;margin:0;scroll-padding-inline:0}.fcc-review-card{flex:0 0 calc((100% - var(--fcc-rs-mobile-gap)) / 2);width:calc((100% - var(--fcc-rs-mobile-gap)) / 2);max-width:none;height:var(--fcc-rs-card-height,360px);min-height:var(--fcc-rs-card-height,360px);scroll-snap-align:start}.fcc-review-card__image-wrap{flex-basis:136px}.fcc-review-card__body{padding:12px 12px 10px}.fcc-review-card__reviewer{font-size:11px}.fcc-review-card__title{font-size:13px}.fcc-review-card__statement{font-size:12px;-webkit-line-clamp:4}.fcc-review-card__meta{font-size:10px}.fcc-review-card__product-thumb{width:40px;height:40px;right:8px;bottom:8px}} @media(max-width:390px){.fcc-review-slider{padding:0}.fcc-review-slider__inner{padding-left:16px!important;padding-right:16px!important}.fcc-review-card{flex:0 0 78vw;width:78vw}.fcc-review-slider__track{gap:14px}.fcc-review-slider__heading{font-size:32px}} /* 6.0.182 — Gallery-style two-tone review rail + controlled drag. The rail can flash as a visual hint even when a source has only a few cards. Drag is enabled only when the active row truly overflows. */ @keyframes fccReviewRailTrackHint{ 0%{opacity:0} 18%{opacity:1} 58%{opacity:1} 100%{opacity:0} } @keyframes fccReviewRailThumbHint{ 0%{opacity:0;transform:translateX(var(--fcc-rs-rail-thumb-x,0px)) scaleY(1)} 18%{opacity:1;transform:translateX(var(--fcc-rs-rail-thumb-x,0px)) scaleY(1.18)} 58%{opacity:1;transform:translateX(var(--fcc-rs-rail-thumb-x,0px)) scaleY(1.18)} 100%{opacity:0;transform:translateX(var(--fcc-rs-rail-thumb-x,0px)) scaleY(1)} } .fcc-review-slider{ --fcc-rs-rail-track:rgba(172,229,161,.38); --fcc-rs-rail-thumb:#006B5D; --fcc-rs-rail-thumb-edge:rgba(0,89,79,.35); --fcc-rs-rail-thumb-w:144px; --fcc-rs-rail-h:6px; --fcc-rs-rail-thumb-x:0px; --fcc-rs-drag-ratio:.72; } .fcc-review-slider__viewport{ position:relative!important; overflow:hidden!important; padding-bottom:0; } .fcc-review-slider__track{ cursor:default; user-select:none; -webkit-user-select:none; -webkit-user-drag:none; touch-action:pan-x pan-y; overscroll-behavior-x:contain; scrollbar-width:none!important; -ms-overflow-style:none; padding-bottom:24px!important; } .fcc-review-slider__track::-webkit-scrollbar{ display:none!important; width:0!important; height:0!important; background:transparent!important; } .fcc-review-slider[data-fcc-rs-scrollable] .fcc-review-slider__track{ cursor:grab; padding-bottom:calc(24px + var(--fcc-rs-rail-h,6px))!important; } .fcc-review-slider:not([data-fcc-rs-scrollable]) .fcc-review-slider__track{ cursor:default; } .fcc-review-slider__viewport::before, .fcc-review-slider__viewport::after{ content:""; position:absolute; left:0; bottom:0; height:var(--fcc-rs-rail-h,6px); border-radius:999px; pointer-events:none; opacity:0; z-index:30; } .fcc-review-slider__viewport::before{ right:0; background:var(--fcc-rs-rail-track,rgba(172,229,161,.38)); transition:opacity 180ms ease; } .fcc-review-slider__viewport::after{ width:min(var(--fcc-rs-rail-thumb-current-w,var(--fcc-rs-rail-thumb-w,144px)),100%); background:var(--fcc-rs-rail-thumb,#006B5D); transform:translateX(var(--fcc-rs-rail-thumb-x,0px)); transition:opacity 180ms ease,transform 120ms ease; box-shadow:inset 0 0 0 1px var(--fcc-rs-rail-thumb-edge,rgba(0,89,79,.35)),0 1px 5px rgba(0,0,0,.10); } .fcc-review-slider[data-fcc-rs-rail="show"] .fcc-review-slider__viewport::before, .fcc-review-slider[data-fcc-rs-rail="show"] .fcc-review-slider__viewport::after{ opacity:1; } .fcc-review-slider[data-fcc-rs-rail="hint"] .fcc-review-slider__viewport::before{ animation:fccReviewRailTrackHint 1800ms ease-in-out 3 both; } .fcc-review-slider[data-fcc-rs-rail="hint"] .fcc-review-slider__viewport::after{ animation:fccReviewRailThumbHint 1800ms ease-in-out 3 both; } .fcc-review-slider[data-fcc-review-dragging="1"] .fcc-review-slider__track{ cursor:grabbing; scroll-behavior:auto; scroll-snap-type:none; } .fcc-review-slider[data-fcc-review-dragging="1"] .fcc-review-card, .fcc-review-slider[data-fcc-review-dragging="1"] .fcc-review-card *{ user-select:none; -webkit-user-select:none; } @media(max-width:767px){ .fcc-review-slider__track{padding-bottom:16px!important} .fcc-review-slider[data-fcc-rs-scrollable] .fcc-review-slider__track{padding-bottom:calc(16px + var(--fcc-rs-rail-h,6px))!important} } @media(max-width:390px){ .fcc-review-slider__track{padding-bottom:16px!important} .fcc-review-slider[data-fcc-rs-scrollable] .fcc-review-slider__track{padding-bottom:calc(16px + var(--fcc-rs-rail-h,6px))!important} } /* v6.0.185: customer review photos are no longer full-card-width banners. The media frame is reduced by 3/4 inch (72 CSS px) on desktop and uses a 3:4 phone-photo ratio. This keeps customer-uploaded mobile photos smaller, less cropped, and balanced without changing the slider shell width. */ .fcc-review-slider{ --fcc-rs-card-body-h:178px; --fcc-rs-card-body-h-tablet:174px; --fcc-rs-card-body-h-mobile:168px; --fcc-rs-photo-inset:72px; --fcc-rs-photo-radius:8px; } .fcc-review-slider__inner{ min-height:max(var(--fcc-rs-section-height,520px),690px); } .fcc-review-slider__track{ align-items:stretch; min-height:0!important; } .fcc-review-card{ height:auto!important; min-height:0!important; max-height:none!important; } .fcc-review-card__image-wrap{ position:relative; flex:0 0 auto!important; width:min(calc(100% - var(--fcc-rs-photo-inset,72px)), 228px)!important; aspect-ratio:3/4!important; height:auto!important; min-height:0!important; margin:14px auto 0!important; border-radius:var(--fcc-rs-photo-radius,8px)!important; overflow:hidden!important; background:#f5f8f5; } .fcc-review-card__image{ display:block!important; width:100%!important; height:100%!important; object-fit:cover!important; object-position:center center!important; } .fcc-review-card__image--placeholder{ height:100%!important; } .fcc-review-card__body{ flex:0 0 var(--fcc-rs-card-body-h,178px)!important; min-height:var(--fcc-rs-card-body-h,178px)!important; max-height:var(--fcc-rs-card-body-h,178px)!important; overflow:hidden; } .fcc-review-card__statement{ -webkit-line-clamp:3; } .fcc-review-card__stars{ margin-top:auto; } @media(max-width:1199px){ .fcc-review-slider{ --fcc-rs-photo-inset:clamp(42px,6vw,64px); } .fcc-review-slider__inner{ min-height:max(var(--fcc-rs-section-height,520px),650px); } .fcc-review-card__body{ flex-basis:var(--fcc-rs-card-body-h-tablet,174px)!important; min-height:var(--fcc-rs-card-body-h-tablet,174px)!important; max-height:var(--fcc-rs-card-body-h-tablet,174px)!important; } } @media(max-width:767px){ .fcc-review-slider{ --fcc-rs-photo-inset:clamp(18px,8vw,32px); } .fcc-review-slider__inner{ min-height:auto; } .fcc-review-card__image-wrap{ aspect-ratio:3/4!important; margin-top:10px!important; } .fcc-review-card__body{ flex-basis:var(--fcc-rs-card-body-h-mobile,168px)!important; min-height:var(--fcc-rs-card-body-h-mobile,168px)!important; max-height:var(--fcc-rs-card-body-h-mobile,168px)!important; } .fcc-review-card__statement{ -webkit-line-clamp:3; } } @media(max-width:390px){ .fcc-review-slider{ --fcc-rs-photo-inset:20px; } .fcc-review-card__body{ flex-basis:176px!important; min-height:176px!important; max-height:176px!important; } } /* v6.0.196: final review-card media contract. The card border now touches the image (full-bleed media), and the entire card is capped at the reduced width instead of shrinking only the image. */ .fcc-review-slider{ --fcc-rs-card-width:228px; --fcc-rs-card-body-h:176px; --fcc-rs-card-body-h-tablet:172px; --fcc-rs-card-body-h-mobile:164px; --fcc-rs-photo-inset:0px; } .fcc-review-slider__inner{ min-height:max(var(--fcc-rs-section-height,620px),620px); } .fcc-review-card{ flex:0 0 min(var(--fcc-rs-card-width,228px),228px)!important; width:min(var(--fcc-rs-card-width,228px),228px)!important; max-width:228px!important; border-radius:8px!important; overflow:hidden!important; } .fcc-review-card__image-wrap{ width:100%!important; max-width:100%!important; aspect-ratio:1/1!important; margin:0!important; border-radius:8px 8px 0 0!important; overflow:hidden!important; } .fcc-review-card__image{ width:100%!important; height:100%!important; object-fit:cover!important; object-position:center center!important; } .fcc-review-card__body{ padding:14px 14px 12px!important; } @media(max-width:1199px){ .fcc-review-card{ flex-basis:min(var(--fcc-rs-card-width,228px),228px)!important; width:min(var(--fcc-rs-card-width,228px),228px)!important; max-width:228px!important; scroll-snap-align:start!important; } .fcc-review-slider__inner{ min-height:max(var(--fcc-rs-section-height,620px),600px); } } @media(max-width:767px){ .fcc-review-card{ flex:0 0 calc((100% - var(--fcc-rs-mobile-gap,16px)) / 2)!important; width:calc((100% - var(--fcc-rs-mobile-gap,16px)) / 2)!important; max-width:none!important; } .fcc-review-card__image-wrap{ aspect-ratio:1/1!important; margin:0!important; } } @media(max-width:390px){ .fcc-review-card{ flex:0 0 78vw!important; width:78vw!important; max-width:none!important; } } /* v6.0.196: lengthened full-bleed review media without cutting the card text. Keep the card border touching the image, keep the 228px reduced card width, and make the image taller with a 4:5 media ratio. Body height and section height are recalculated so reviewer/title/statement/stars/meta remain visible. */ .fcc-review-slider{ --fcc-rs-card-width:228px; --fcc-rs-card-body-h:202px; --fcc-rs-card-body-h-tablet:196px; --fcc-rs-card-body-h-mobile:178px; } .fcc-review-slider__inner{ min-height:max(var(--fcc-rs-section-height,720px),720px); } .fcc-review-card__image-wrap{ width:100%!important; max-width:100%!important; aspect-ratio:4/5!important; margin:0!important; border-radius:8px 8px 0 0!important; overflow:hidden!important; } .fcc-review-card__image{ width:100%!important; height:100%!important; object-fit:cover!important; object-position:center center!important; } .fcc-review-card__body{ flex:0 0 var(--fcc-rs-card-body-h,202px)!important; min-height:var(--fcc-rs-card-body-h,202px)!important; max-height:var(--fcc-rs-card-body-h,202px)!important; overflow:hidden; } .fcc-review-card__statement{ -webkit-line-clamp:3; } @media(max-width:1199px){ .fcc-review-slider__inner{ min-height:max(var(--fcc-rs-section-height,690px),690px); } .fcc-review-card__body{ flex-basis:var(--fcc-rs-card-body-h-tablet,196px)!important; min-height:var(--fcc-rs-card-body-h-tablet,196px)!important; max-height:var(--fcc-rs-card-body-h-tablet,196px)!important; } } @media(max-width:767px){ .fcc-review-slider__inner{ min-height:auto; } .fcc-review-card__image-wrap{ aspect-ratio:4/5!important; } .fcc-review-card__body{ flex-basis:var(--fcc-rs-card-body-h-mobile,178px)!important; min-height:var(--fcc-rs-card-body-h-mobile,178px)!important; max-height:var(--fcc-rs-card-body-h-mobile,178px)!important; } } @media(max-width:390px){ .fcc-review-card__body{ flex-basis:186px!important; min-height:186px!important; max-height:186px!important; } } /* v6.0.196: honest empty-source state. If the active source has zero cards, show one clear empty message and suppress the fake slider rail/drag affordance. */ .fcc-review-slider__empty[data-fcc-review-empty]{ display:none!important; flex:1 0 100%; width:100%; max-width:680px; margin:12px auto 0; padding:18px 22px; border:1px dashed rgba(0,89,79,.22); border-radius:8px; background:rgba(255,255,255,.72); color:var(--fcc-rs-text,#00594f); font-size:15px; line-height:1.45; text-align:center; align-self:flex-start; } .fcc-review-slider[data-fcc-rs-active-empty="1"][data-fcc-review-active-filter="product"] .fcc-review-slider__empty[data-fcc-review-empty-source="product"], .fcc-review-slider[data-fcc-rs-active-empty="1"][data-fcc-review-active-filter="google"] .fcc-review-slider__empty[data-fcc-review-empty-source="google"]{ display:block!important; } .fcc-review-slider[data-fcc-rs-active-empty="1"] .fcc-review-slider__track{ cursor:default!important; overflow-x:hidden!important; padding-bottom:24px!important; } .fcc-review-slider[data-fcc-rs-active-empty="1"] .fcc-review-slider__viewport::before, .fcc-review-slider[data-fcc-rs-active-empty="1"] .fcc-review-slider__viewport::after{ display:none!important; opacity:0!important; animation:none!important; } .fcc-review-slider[data-fcc-rs-active-empty="1"] .fcc-review-slider__inner{ min-height:min(var(--fcc-rs-section-height,620px),620px); } /* v6.0.196: mobile-only review slider refinement. Reduce phone review cards by 25% from the previous ~78vw card, and keep the heading on one line. Desktop/tablet contracts remain unchanged. */ @media(max-width:767px){ .fcc-review-slider__topline{ margin-bottom:18px!important; } .fcc-review-slider__heading{ display:block!important; width:100%!important; max-width:100%!important; padding-left:0!important; padding-right:0!important; white-space:nowrap!important; font-size:clamp(24px,6.75vw,34px)!important; line-height:1.08!important; letter-spacing:-.01em; } .fcc-review-slider:has(.fcc-review-slider__filters) .fcc-review-slider__heading{ padding-left:0!important; padding-right:0!important; } .fcc-review-slider__track{ gap:clamp(14px,4vw,18px)!important; scroll-padding-inline:0!important; } .fcc-review-card{ flex:0 0 clamp(210px,58.5vw,260px)!important; width:clamp(210px,58.5vw,260px)!important; max-width:260px!important; scroll-snap-align:start!important; } .fcc-review-card__image-wrap{ aspect-ratio:4/5!important; } .fcc-review-card__body{ flex-basis:178px!important; min-height:178px!important; max-height:178px!important; padding:12px 12px 10px!important; } .fcc-review-card__title{ font-size:14px!important; line-height:1.18!important; } .fcc-review-card__statement{ font-size:12px!important; line-height:1.32!important; -webkit-line-clamp:3!important; } } @media(max-width:390px){ .fcc-review-card{ flex-basis:clamp(202px,58.5vw,238px)!important; width:clamp(202px,58.5vw,238px)!important; max-width:238px!important; } .fcc-review-card__body{ flex-basis:182px!important; min-height:182px!important; max-height:182px!important; } .fcc-review-slider__heading{ font-size:clamp(23px,6.6vw,28px)!important; } } /* v6.0.196: strict mobile/edge-tablet review slider correction. Restore Scent Profile parity on narrow viewports: no outer wrapper inset, buttons pinned to the inner border, and the heading starts 15px below the button row instead of sharing it. */ @media(max-width:767px){ .fcc-review-slider{ width:100%!important; max-width:100%!important; padding-left:0!important; padding-right:0!important; margin-left:auto!important; margin-right:auto!important; overflow:visible!important; } .fcc-review-slider__inner{ width:100%!important; max-width:100%!important; padding-top:calc(7px + var(--fcc-rs-filter-button-size,34px) + 15px)!important; padding-right:20px!important; padding-bottom:28px!important; padding-left:20px!important; overflow:hidden!important; } .fcc-review-slider>.fcc-review-slider__inner>.fcc-review-slider__filters{ top:7px!important; right:7px!important; bottom:auto!important; left:auto!important; inset-block-start:7px!important; inset-inline-end:7px!important; inset-block-end:auto!important; inset-inline-start:auto!important; transform:none!important; translate:none!important; width:calc((var(--fcc-rs-filter-button-size,34px) * 2) + 7px)!important; min-width:calc((var(--fcc-rs-filter-button-size,34px) * 2) + 7px)!important; max-width:calc(100% - 14px)!important; z-index:80!important; } .fcc-review-slider__topline{ width:100%!important; max-width:100%!important; margin-top:0!important; margin-bottom:18px!important; justify-content:center!important; align-items:center!important; text-align:center!important; } .fcc-review-slider__heading{ display:block!important; width:100%!important; max-width:100%!important; margin:0!important; padding-left:0!important; padding-right:0!important; white-space:nowrap!important; overflow:visible!important; text-align:center!important; font-size:clamp(23px,6.25vw,32px)!important; line-height:1.08!important; letter-spacing:-.01em!important; } .fcc-review-slider:has(.fcc-review-slider__filters) .fcc-review-slider__heading{ padding-left:0!important; padding-right:0!important; } } @media(max-width:390px){ .fcc-review-slider{ padding-left:0!important; padding-right:0!important; } .fcc-review-slider__inner{ padding-top:calc(7px + var(--fcc-rs-filter-button-size,34px) + 15px)!important; padding-left:16px!important; padding-right:16px!important; } .fcc-review-slider__heading{ font-size:clamp(22px,6.1vw,27px)!important; } } /* v6.0.196: filter-safe mobile shell width. The review shell must not shrink when switching from Product to Google when a source has fewer cards. Match the Scent Profile-style viewport shell on mobile/edge tablet: shell width is viewport-based, not active-card-count/content-based. */ @media(max-width:767px){ .fcc-fluent-review-slider-element{ width:100%!important; max-width:100%!important; min-width:0!important; overflow:visible!important; } .fcc-review-slider{ position:relative!important; left:50%!important; transform:translateX(-50%)!important; width:calc(100vw - 32px)!important; inline-size:calc(100vw - 32px)!important; min-width:calc(100vw - 32px)!important; min-inline-size:calc(100vw - 32px)!important; max-width:calc(100vw - 32px)!important; max-inline-size:calc(100vw - 32px)!important; margin-left:0!important; margin-right:0!important; padding-left:0!important; padding-right:0!important; flex:0 0 calc(100vw - 32px)!important; align-self:center!important; overflow:visible!important; } .fcc-review-slider__inner{ width:100%!important; inline-size:100%!important; min-width:100%!important; min-inline-size:100%!important; max-width:100%!important; max-inline-size:100%!important; flex:0 0 auto!important; } .fcc-review-slider__viewport, .fcc-review-slider__track, .fcc-review-slider__topline{ width:100%!important; max-width:100%!important; min-width:0!important; } .fcc-review-slider__heading{ position:relative!important; z-index:1!important; box-sizing:border-box!important; padding-left:0!important; padding-right:0!important; } .fcc-review-slider>.fcc-review-slider__inner>.fcc-review-slider__filters{ position:absolute!important; top:7px!important; right:7px!important; bottom:auto!important; left:auto!important; z-index:90!important; } } @media(max-width:390px){ .fcc-review-slider{ width:calc(100vw - 24px)!important; inline-size:calc(100vw - 24px)!important; min-width:calc(100vw - 24px)!important; min-inline-size:calc(100vw - 24px)!important; max-width:calc(100vw - 24px)!important; max-inline-size:calc(100vw - 24px)!important; flex-basis:calc(100vw - 24px)!important; } } /* v6.0.197: immutable review-source button anchor. The filter group is always positioned from the white bordered shell, never from the viewport, heading, content width, or stale left/bottom values. Tablet/edge-tablet also reserves the same 7px + 34px + 15px clearance used on mobile so the heading cannot collide with icons. */ .fcc-review-slider > .fcc-review-slider__inner{ position:relative!important; box-sizing:border-box!important; } .fcc-review-slider > .fcc-review-slider__inner > .fcc-review-slider__filters{ position:absolute!important; inset-block-start:7px!important; inset-inline-end:7px!important; inset-block-end:auto!important; inset-inline-start:auto!important; top:7px!important; right:7px!important; bottom:auto!important; left:auto!important; display:flex!important; flex-flow:row nowrap!important; align-items:center!important; justify-content:flex-end!important; gap:7px!important; width:calc((var(--fcc-rs-filter-button-size,34px) * 2) + 7px)!important; inline-size:calc((var(--fcc-rs-filter-button-size,34px) * 2) + 7px)!important; min-width:calc((var(--fcc-rs-filter-button-size,34px) * 2) + 7px)!important; min-inline-size:calc((var(--fcc-rs-filter-button-size,34px) * 2) + 7px)!important; max-width:calc(100% - 14px)!important; max-inline-size:calc(100% - 14px)!important; margin:0!important; padding:0!important; transform:none!important; translate:none!important; z-index:100!important; overflow:visible!important; } .fcc-review-slider > .fcc-review-slider__inner > .fcc-review-slider__filters > .fcc-review-slider__filter{ flex:0 0 var(--fcc-rs-filter-button-size,34px)!important; width:var(--fcc-rs-filter-button-size,34px)!important; inline-size:var(--fcc-rs-filter-button-size,34px)!important; min-width:var(--fcc-rs-filter-button-size,34px)!important; min-inline-size:var(--fcc-rs-filter-button-size,34px)!important; height:var(--fcc-rs-filter-button-size,34px)!important; block-size:var(--fcc-rs-filter-button-size,34px)!important; min-height:var(--fcc-rs-filter-button-size,34px)!important; min-block-size:var(--fcc-rs-filter-button-size,34px)!important; margin:0!important; } @media(max-width:1199px){ .fcc-review-slider__inner{ padding-top:calc(7px + var(--fcc-rs-filter-button-size,34px) + 15px)!important; } .fcc-review-slider:has(.fcc-review-slider__filters) .fcc-review-slider__heading{ padding-left:0!important; padding-right:0!important; } } @media(max-width:767px){ .fcc-review-slider__inner{ padding-top:calc(7px + var(--fcc-rs-filter-button-size,34px) + 15px)!important; } .fcc-review-slider__topline{ margin-top:0!important; } } /* v6.0.198: visible-viewport-safe review shell. Audit proved the buttons were 7px from the review shell, but the shell itself could be wider than the visible Bricks/viewport lane because older desktop/tablet rules used 100vw. That makes the right border and buttons look clipped even when the button anchor is correct. Use the containing Bricks lane for desktop/tablet, then keep the existing mobile viewport width contract. */ @media (min-width:768px){ .fcc-fluent-review-slider-element{ width:100%!important; max-width:100%!important; min-width:0!important; overflow:visible!important; } .fcc-review-slider{ position:relative!important; left:auto!important; right:auto!important; transform:none!important; translate:none!important; width:100%!important; inline-size:100%!important; min-width:0!important; min-inline-size:0!important; max-width:var(--fcc-rs-max-width,1538px)!important; max-inline-size:var(--fcc-rs-max-width,1538px)!important; margin-left:auto!important; margin-right:auto!important; padding-left:0!important; padding-right:0!important; overflow:visible!important; box-sizing:border-box!important; } .fcc-review-slider > .fcc-review-slider__inner{ width:100%!important; inline-size:100%!important; max-width:100%!important; max-inline-size:100%!important; position:relative!important; box-sizing:border-box!important; overflow:hidden!important; } .fcc-review-slider > .fcc-review-slider__inner > .fcc-review-slider__filters{ position:absolute!important; top:7px!important; right:7px!important; bottom:auto!important; left:auto!important; inset-block-start:7px!important; inset-inline-end:7px!important; inset-block-end:auto!important; inset-inline-start:auto!important; transform:none!important; translate:none!important; margin:0!important; z-index:100!important; overflow:visible!important; } } /* v6.0.204: tablet title/top-border parity and strict shell controls. Keep the review title rhythm aligned with Scent Profile on tablet while maintaining the 7px button anchor and 15px heading clearance. */ @media (min-width:768px) and (max-width:1199px){ .fcc-review-slider > .fcc-review-slider__inner{ padding-top:calc(7px + var(--fcc-rs-filter-button-size,34px) + 15px)!important; } .fcc-review-slider__topline{ margin-top:0!important; margin-bottom:28px!important; } } /* v6.0.204: Review heading top-border parity with Scent Profile on tablet/edge-mobile. The previous clearance rule intentionally moved the heading below the icon row everywhere, but on wider mobile/tablet there is enough horizontal room for the icons, so the review heading should use the same top padding rhythm as Scent Profile. Narrow phones keep the protected under-icon layout to prevent title/icon overlap. */ @media (min-width:768px) and (max-width:1199px){ .fcc-review-slider > .fcc-review-slider__inner{ padding-top:clamp(34px,5vw,54px)!important; } .fcc-review-slider__topline{ margin-top:0!important; } } @media (min-width:600px) and (max-width:767px){ .fcc-review-slider > .fcc-review-slider__inner{ padding-top:24px!important; } .fcc-review-slider__topline{ margin-top:0!important; margin-bottom:20px!important; } } @media (max-width:599px){ .fcc-review-slider > .fcc-review-slider__inner{ padding-top:calc(7px + var(--fcc-rs-filter-button-size,34px) + 15px)!important; } } /* v6.0.204 — mobile-only Review Slider title-to-border rhythm. Match Scent Profile at 767 / 478 / 320: 39.05px from top border by default. Desktop/tablet above 767 is untouched, and source buttons stay 7px from the shell border. */ @media (max-width:767px){ .fcc-review-slider > .fcc-review-slider__inner{ padding-top:var(--fcc-rs-mobile-heading-top,39.05px)!important; } } @media (min-width:600px) and (max-width:767px){ .fcc-review-slider > .fcc-review-slider__inner{ padding-top:var(--fcc-rs-mobile-landscape-heading-top,39.05px)!important; } } @media (max-width:478px){ .fcc-review-slider > .fcc-review-slider__inner{ padding-top:var(--fcc-rs-mobile-heading-top,39.05px)!important; } } @media (max-width:340px){ .fcc-review-slider > .fcc-review-slider__inner{ padding-top:var(--fcc-rs-mobile-320-heading-top,39.05px)!important; } } /* FC Ecom Suite 6.0.221 — Customer Review first-card inset and rail parity. Scope: Customer Review slider only. This intentionally excludes .fcc-best-sellers-slider, the native FluentCart Best Sellers element, product queries, image resolvers, cart buttons, and all Best Sellers card geometry. Audit notes: - The Review track could start flush against the clipped overflow viewport, so the first card border looked hidden until the user dragged the row back. - FC Best Sellers already uses a 10px track inset; this applies the same inset only to Customer Reviews so the first review card border is visible at rest. - The custom rail remains on the viewport, preserving the same rail-to-outer border spacing and keeping the existing background, title, buttons, card width, and scrollbar behavior. */ .fcc-review-slider:not(.fcc-best-sellers-slider) .fcc-review-slider__track{ padding-left:10px!important; padding-right:10px!important; margin-left:0!important; margin-right:0!important; scroll-padding-left:10px!important; scroll-padding-right:10px!important; } @media(max-width:767px){ .fcc-review-slider:not(.fcc-best-sellers-slider) .fcc-review-slider__track{ padding-left:10px!important; padding-right:10px!important; margin-left:0!important; margin-right:0!important; scroll-padding-left:10px!important; scroll-padding-right:10px!important; } } /* FC Ecom Suite 6.0.224 — Customer Review rail/card spacing parity. Scope: Customer Review slider only. Excludes FC Best Sellers Slider and native FluentCart Best Sellers. Exact target from the live Best Sellers DOM audit: - card-to-card gap: 14px - card bottom border to custom scrollbar rail: 30px - 10px left/right track inset so the first card border is visible at rest. */ .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-slider__track, .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) [data-fcc-review-slider-track]{ gap:14px!important; row-gap:14px!important; column-gap:14px!important; padding-top:2px!important; padding-right:10px!important; padding-bottom:30px!important; padding-left:10px!important; margin-left:0!important; margin-right:0!important; scroll-padding-left:10px!important; scroll-padding-right:10px!important; } /* FC Ecom Suite 6.0.225 — Customer Review/Scent-style slider vertical rail parity. Scope: Customer Review slider only. Excludes FC Best Sellers Slider and native FluentCart Best Sellers. Audit finding: - The product Best Sellers row was already fixed by locking its viewport to the real card-row height. - The Customer Review/Scent-style row still inherited the shared review-shell rule: viewport flex: 1 1 auto. - That made the viewport absorb unused 720px shell height and pushed the custom rail down, creating a larger white gap than the card row actually needs. Contract: - card-to-card gap: 14px; - first/last card inset: 10px; - card bottom border to custom rail: 30px; - no Best Sellers files, product query, image resolver, cart button, title, background, or native FluentCart widget changes. */ .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-slider__viewport{ flex:0 0 auto!important; height:auto!important; min-height:0!important; max-height:none!important; overflow:hidden!important; position:relative!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-slider__track, .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) [data-fcc-review-slider-track]{ gap:14px!important; row-gap:14px!important; column-gap:14px!important; height:auto!important; min-height:0!important; max-height:none!important; padding-top:2px!important; padding-right:10px!important; padding-bottom:30px!important; padding-left:10px!important; margin:0!important; scroll-padding-left:10px!important; scroll-padding-right:10px!important; } /* FC Ecom Suite 6.0.230 — Customer Review container-width parity with FC Best Sellers. Scope: Customer Review slider only. This excludes .fcc-best-sellers-slider and [data-fcc-best-sellers-slider="1"], so FC Best Sellers, native FluentCart Best Sellers, product/cart/image/price logic, and Scent Profile are not changed. Audit finding: - The review card row/track had the correct 14px gap, 10px track inset, and 30px rail spacing, but the parent review container still used older width rules at some breakpoints. That made the card-row container sit differently from FC Best Sellers while resizing. - This clones the FC Best Sellers structural width contract onto the Customer Review root/shell/viewport/track only, level-by-level, across every viewport. */ @media (min-width:768px){ .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]){ position:relative!important; left:50%!important; right:auto!important; transform:translateX(-50%)!important; translate:none!important; width:min(var(--fcc-rs-max-width,1538px),calc(100vw - 48px))!important; inline-size:min(var(--fcc-rs-max-width,1538px),calc(100vw - 48px))!important; min-width:min(var(--fcc-rs-max-width,1538px),calc(100vw - 48px))!important; min-inline-size:min(var(--fcc-rs-max-width,1538px),calc(100vw - 48px))!important; max-width:none!important; max-inline-size:none!important; margin-left:0!important; margin-right:0!important; padding-left:0!important; padding-right:0!important; overflow:visible!important; box-sizing:border-box!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__inner{ width:100%!important; inline-size:100%!important; min-width:0!important; min-inline-size:0!important; max-width:100%!important; max-inline-size:100%!important; box-sizing:border-box!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-slider__topline, .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-slider__viewport, .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-slider__track, .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) [data-fcc-review-slider-track]{ width:100%!important; inline-size:100%!important; min-width:0!important; min-inline-size:0!important; max-width:100%!important; max-inline-size:100%!important; box-sizing:border-box!important; } } @media (max-width:767px){ .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]){ position:relative!important; left:auto!important; right:auto!important; transform:none!important; translate:none!important; width:100%!important; inline-size:100%!important; min-width:0!important; min-inline-size:0!important; max-width:100%!important; max-inline-size:100%!important; margin-left:auto!important; margin-right:auto!important; padding-left:0!important; padding-right:0!important; overflow:visible!important; box-sizing:border-box!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__inner, .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-slider__topline, .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-slider__viewport, .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-slider__track, .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) [data-fcc-review-slider-track]{ width:100%!important; inline-size:100%!important; min-width:0!important; min-inline-size:0!important; max-width:100%!important; max-inline-size:100%!important; box-sizing:border-box!important; } } /* FC Ecom Suite 6.0.232 — Customer Review card-width parity with FC Best Sellers. Scope: Customer Review cards only. This corrects the older mobile rules that let review cards expand to 260px/78vw while FC Best Sellers stayed 228px. The card-row container may still be wider because it holds multiple cards; the individual review card is now locked to the same 228px card contract. */ .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-card{ flex:0 0 228px!important; flex-basis:228px!important; width:228px!important; inline-size:228px!important; min-width:228px!important; min-inline-size:228px!important; max-width:228px!important; max-inline-size:228px!important; scroll-snap-align:start!important; } @media(max-width:767px){ .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-card{ flex:0 0 228px!important; flex-basis:228px!important; width:228px!important; inline-size:228px!important; min-width:228px!important; min-inline-size:228px!important; max-width:228px!important; max-inline-size:228px!important; } } @media(max-width:390px){ .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-card{ flex:0 0 228px!important; flex-basis:228px!important; width:228px!important; inline-size:228px!important; min-width:228px!important; min-inline-size:228px!important; max-width:228px!important; max-inline-size:228px!important; } } /* FC Ecom Suite 6.0.238 — Customer Review desktop/tablet shell-height parity with FC Best Sellers. Scope: Customer Review slider only. FC Best Sellers, Scent Profile, native FluentCart Best Sellers, cart logic, image logic, price logic, and product query logic are not touched. Audit reason: - Customer Review still inherited historical fixed/min-height shell rules (720px desktop / 690px tablet). - FC Best Sellers now uses a natural auto-height shell, so its bottom spacing is calculated from content: card bottom -> track bottom = 30px; track bottom -> white shell inner border = shell padding-bottom + border; no extra leftover fixed-height slack. - This applies the same outer shell height model to Customer Review at desktop/tablet viewports. */ @media (min-width:768px){ .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]), .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__inner{ height:auto!important; min-height:0!important; max-height:none!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-slider__viewport, .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-slider__track, .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) [data-fcc-review-slider-track]{ height:auto!important; min-height:0!important; max-height:none!important; } } @media (min-width:1200px){ .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__inner{ padding-bottom:56px!important; } } @media (min-width:768px) and (max-width:1199px){ .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__inner{ padding-bottom:clamp(34px,5vw,54px)!important; } } /* FC Ecom Suite 6.0.243 — Review filter buttons hard anchor. Scope: Customer Review slider only. Excludes FC Best Sellers and native FluentCart. Bug audit: - The filter group is supposed to be anchored 7px from the review white shell border. - During viewport shrink, older width/position rules and stale inline left/bottom values could make the group appear clipped or pushed under the border. Fix: - Re-anchor the group from the review shell itself at top/right 7px. - Preserve the 75px two-button width and 34px buttons. - Keep overflow visible only for the button group while the card viewport remains clipped. */ .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__inner{ position:relative!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__inner > .fcc-review-slider__filters{ position:absolute!important; top:7px!important; right:7px!important; bottom:auto!important; left:auto!important; inset-block-start:7px!important; inset-inline-end:7px!important; inset-block-end:auto!important; inset-inline-start:auto!important; display:flex!important; flex-flow:row nowrap!important; align-items:center!important; justify-content:flex-end!important; gap:7px!important; width:75px!important; inline-size:75px!important; min-width:75px!important; min-inline-size:75px!important; max-width:calc(100% - 14px)!important; max-inline-size:calc(100% - 14px)!important; height:34px!important; min-height:34px!important; margin:0!important; padding:0!important; transform:none!important; translate:none!important; z-index:250!important; overflow:visible!important; pointer-events:auto!important; box-sizing:border-box!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__inner > .fcc-review-slider__filters > .fcc-review-slider__filter{ flex:0 0 34px!important; width:34px!important; inline-size:34px!important; min-width:34px!important; min-inline-size:34px!important; max-width:34px!important; max-inline-size:34px!important; height:34px!important; block-size:34px!important; min-height:34px!important; min-block-size:34px!important; max-height:34px!important; max-block-size:34px!important; margin:0!important; padding:0!important; box-sizing:border-box!important; } @media(max-width:1199px){ .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__inner > .fcc-review-slider__filters{ top:7px!important; right:7px!important; } } /* FC Ecom Suite 6.0.245 — Customer Review mobile rail-spacing parity with FC Best Sellers. Scope: Customer Review slider only; excludes FC Best Sellers and native FluentCart. Audit source: - FC Best Sellers mobile landscape uses the 228px card contract with the rail sitting at the bottom of the track slot: card bottom -> rail top = 16px, rail bottom -> outer shell bottom = 28px. - Older Customer Review rules later in this file re-forced track padding-bottom:30px, which made review card bottom -> rail top larger than FC Best Sellers on mobile landscape/mobile. Fix: - On <=767px only, force Customer Review track bottom padding to 22px, matching Best Sellers mobile track math: 16px visual card-to-rail gap + 6px rail height. - Keep 14px card gap, 10px track insets, 228px cards, and the 7px button anchor. */ @media (max-width:767px){ .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-slider__viewport{ flex:0 0 auto!important; height:auto!important; min-height:0!important; max-height:none!important; overflow:hidden!important; position:relative!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-slider__track, .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) [data-fcc-review-slider-track]{ gap:14px!important; row-gap:14px!important; column-gap:14px!important; padding-top:2px!important; padding-right:10px!important; padding-bottom:22px!important; padding-left:10px!important; margin:0!important; scroll-padding-left:10px!important; scroll-padding-right:10px!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__inner{ padding-bottom:28px!important; } } /* FC Ecom Suite 6.0.246 — Customer Review filter button viewport-lock. Scope: Customer Review widget only. Excludes FC Best Sellers. Audit: - The individual buttons are 34px and correct. - The moving/clipping bug happens at the button-group wrapper level. - Older responsive rules and browser subpixel shrink could allow the wrapper to behave like a one-button width or inherit a stale inline/right calculation while the white shell clips overflow. Fix: - The filter group is a fixed 75px rail: 34px + 7px + 34px. - It is positioned from the white shell only: top/right = 7px. - The group never flexes, never shrinks, never uses viewport/heading/track width. */ .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__inner{ position:relative!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__inner > .fcc-review-slider__filters{ position:absolute!important; top:7px!important; right:7px!important; bottom:auto!important; left:auto!important; inset-block-start:7px!important; inset-inline-end:7px!important; inset-block-end:auto!important; inset-inline-start:auto!important; display:grid!important; grid-template-columns:34px 34px!important; grid-auto-flow:column!important; column-gap:7px!important; row-gap:0!important; align-items:center!important; justify-content:start!important; justify-items:center!important; width:75px!important; inline-size:75px!important; min-width:75px!important; min-inline-size:75px!important; max-width:75px!important; max-inline-size:75px!important; height:34px!important; block-size:34px!important; min-height:34px!important; min-block-size:34px!important; max-height:34px!important; max-block-size:34px!important; margin:0!important; padding:0!important; overflow:visible!important; transform:none!important; translate:none!important; box-sizing:border-box!important; flex:0 0 75px!important; flex-shrink:0!important; z-index:999!important; contain:none!important; clip-path:none!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__inner > .fcc-review-slider__filters > .fcc-review-slider__filter{ grid-column:auto!important; flex:0 0 34px!important; width:34px!important; inline-size:34px!important; min-width:34px!important; min-inline-size:34px!important; max-width:34px!important; max-inline-size:34px!important; height:34px!important; block-size:34px!important; min-height:34px!important; min-block-size:34px!important; max-height:34px!important; max-block-size:34px!important; margin:0!important; padding:0!important; box-sizing:border-box!important; } @media(max-width:767px){ .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__inner > .fcc-review-slider__filters{ top:7px!important; right:7px!important; width:75px!important; inline-size:75px!important; min-width:75px!important; min-inline-size:75px!important; max-width:75px!important; max-inline-size:75px!important; } } /* FC Ecom Suite 6.0.247 — Customer Review filter buttons anchored by individual button geometry. Scope: Customer Review widget only; excludes FC Best Sellers. Audit: - The clipping was not the 34px button size. - The wrapper could still be clipped/shrunk by the white shell while resizing. - The correct geometry is the CONTAINER border: left button right edge at 48px, right button right edge at 7px from the review white shell border. Fix: - The wrapper becomes a zero-size anchor at the top-right of the shell. - Each button is positioned individually, so no wrapper width calculation can hide the second button. - The buttons are always inside the shell: button 1 right:48px, button 2 right:7px, top:7px. */ .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__inner{ position:relative!important; overflow:hidden!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__inner > .fcc-review-slider__filters{ position:absolute!important; top:0!important; right:0!important; bottom:auto!important; left:auto!important; inset-block-start:0!important; inset-inline-end:0!important; inset-block-end:auto!important; inset-inline-start:auto!important; width:0!important; inline-size:0!important; min-width:0!important; min-inline-size:0!important; max-width:0!important; max-inline-size:0!important; height:0!important; block-size:0!important; min-height:0!important; min-block-size:0!important; max-height:0!important; max-block-size:0!important; display:block!important; overflow:visible!important; margin:0!important; padding:0!important; transform:none!important; translate:none!important; box-sizing:border-box!important; flex:0 0 0!important; flex-shrink:0!important; z-index:9999!important; contain:none!important; clip-path:none!important; pointer-events:none!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__inner > .fcc-review-slider__filters > .fcc-review-slider__filter{ position:absolute!important; top:7px!important; bottom:auto!important; left:auto!important; width:34px!important; inline-size:34px!important; min-width:34px!important; min-inline-size:34px!important; max-width:34px!important; max-inline-size:34px!important; height:34px!important; block-size:34px!important; min-height:34px!important; min-block-size:34px!important; max-height:34px!important; max-block-size:34px!important; margin:0!important; padding:0!important; box-sizing:border-box!important; flex:0 0 34px!important; z-index:10000!important; pointer-events:auto!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__inner > .fcc-review-slider__filters > .fcc-review-slider__filter:nth-of-type(1){ right:48px!important; inset-inline-end:48px!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__inner > .fcc-review-slider__filters > .fcc-review-slider__filter:nth-of-type(2){ right:7px!important; inset-inline-end:7px!important; } /* FC Ecom Suite 6.0.248 — Review source controls outside clipped shell. Audit: - .fcc-review-slider__inner must keep overflow:hidden so slider cards clip correctly. - The source controls were inside that clipped shell, so any responsive mis-positioning clipped the second button. - Controls now render as a sibling of .fcc-review-slider__inner and are anchored to the root/shell geometry. - Cards remain clipped by .fcc-review-slider__inner; buttons are outside that clipping layer. */ .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]){ position:relative!important; overflow:visible!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__inner{ position:relative!important; overflow:hidden!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__filters, .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__filters--shell-overlay{ position:absolute!important; top:7px!important; right:7px!important; bottom:auto!important; left:auto!important; inset-block-start:7px!important; inset-inline-end:7px!important; inset-block-end:auto!important; inset-inline-start:auto!important; width:75px!important; inline-size:75px!important; min-width:75px!important; min-inline-size:75px!important; max-width:75px!important; max-inline-size:75px!important; height:34px!important; block-size:34px!important; min-height:34px!important; min-block-size:34px!important; max-height:34px!important; max-block-size:34px!important; display:flex!important; flex-direction:row!important; flex-wrap:nowrap!important; align-items:center!important; justify-content:flex-start!important; gap:7px!important; row-gap:7px!important; column-gap:7px!important; overflow:visible!important; margin:0!important; padding:0!important; transform:none!important; translate:none!important; box-sizing:border-box!important; z-index:10000!important; pointer-events:auto!important; contain:none!important; clip-path:none!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__filters > .fcc-review-slider__filter, .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__filters--shell-overlay > .fcc-review-slider__filter{ position:relative!important; top:auto!important; right:auto!important; bottom:auto!important; left:auto!important; inset:auto!important; width:34px!important; inline-size:34px!important; min-width:34px!important; min-inline-size:34px!important; max-width:34px!important; max-inline-size:34px!important; height:34px!important; block-size:34px!important; min-height:34px!important; min-block-size:34px!important; max-height:34px!important; max-block-size:34px!important; flex:0 0 34px!important; margin:0!important; padding:0!important; box-sizing:border-box!important; z-index:10001!important; pointer-events:auto!important; } /* FC Ecom Suite 6.0.249 — Customer Review source controls split from the card clipper. Scope: Customer Review widget only; excludes FC Best Sellers. Audit result: - The card row needs overflow clipping, but the white bordered shell was also used as a clipping layer in older releases. - When the source buttons lived in, or were re-positioned against, that clipped layer, the right button could be cut during viewport shrink. Fix contract: - The visible bordered shell is only the positioning shell and may overflow visibly. - The review viewport/track remain the only clipping layer for cards. - Source controls are a fixed 75px rail, anchored 7px from the shell border. - Customer Review only; Best Sellers, product cards, gallery, cart, and shop logic are untouched. */ .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]){ position:relative!important; overflow:visible!important; box-sizing:border-box!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__inner{ position:relative!important; overflow:visible!important; clip-path:none!important; contain:none!important; box-sizing:border-box!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-slider__viewport{ position:relative!important; overflow:hidden!important; clip-path:none!important; contain:none!important; box-sizing:border-box!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-slider__track, .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) [data-fcc-review-slider-track]{ overflow-x:auto!important; overflow-y:hidden!important; box-sizing:border-box!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__inner > .fcc-review-slider__filters, .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__filters, .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__filters--shell-overlay{ position:absolute!important; top:7px!important; right:7px!important; bottom:auto!important; left:auto!important; inset-block-start:7px!important; inset-inline-end:7px!important; inset-block-end:auto!important; inset-inline-start:auto!important; display:flex!important; flex-direction:row!important; flex-wrap:nowrap!important; align-items:center!important; justify-content:flex-start!important; gap:7px!important; row-gap:7px!important; column-gap:7px!important; width:75px!important; inline-size:75px!important; min-width:75px!important; min-inline-size:75px!important; max-width:75px!important; max-inline-size:75px!important; height:34px!important; block-size:34px!important; min-height:34px!important; min-block-size:34px!important; max-height:34px!important; max-block-size:34px!important; margin:0!important; padding:0!important; overflow:visible!important; transform:none!important; translate:none!important; box-sizing:border-box!important; flex:0 0 75px!important; flex-shrink:0!important; z-index:10000!important; pointer-events:auto!important; contain:none!important; clip-path:none!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__inner > .fcc-review-slider__filters > .fcc-review-slider__filter, .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__filters > .fcc-review-slider__filter, .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) > .fcc-review-slider__filters--shell-overlay > .fcc-review-slider__filter{ position:relative!important; top:auto!important; right:auto!important; bottom:auto!important; left:auto!important; inset:auto!important; display:inline-flex!important; align-items:center!important; justify-content:center!important; width:34px!important; inline-size:34px!important; min-width:34px!important; min-inline-size:34px!important; max-width:34px!important; max-inline-size:34px!important; height:34px!important; block-size:34px!important; min-height:34px!important; min-block-size:34px!important; max-height:34px!important; max-block-size:34px!important; flex:0 0 34px!important; margin:0!important; padding:0!important; box-sizing:border-box!important; z-index:10001!important; pointer-events:auto!important; } @media (min-width:768px){ .fcc-fluent-review-slider-element{ overflow:visible!important; contain:none!important; } .fcc-review-slider:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]){ left:auto!important; right:auto!important; transform:none!important; translate:none!important; width:100%!important; inline-size:100%!important; min-width:0!important; min-inline-size:0!important; max-width:min(var(--fcc-rs-max-width,1538px),100%)!important; max-inline-size:min(var(--fcc-rs-max-width,1538px),100%)!important; margin-left:auto!important; margin-right:auto!important; } } /* FC Ecom Suite 6.0.251 — card hover shell-only fix for Customer Reviews. Audit outcome: v6.0.250 added the correct card lift/shadow but also changed the review media-pane background on hover. That can expose unwanted bands inside the card. The hover effect is now shell-only: card lift, border/shadow, and image scale/brightness only. FC Best Sellers is excluded because it has its own product-card hover rules in fc-best-sellers-slider.css. */ .fcc-review-slider[data-fcc-review-slider="1"]:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-card{ position:relative!important; transition:transform 220ms ease,box-shadow 220ms ease,border-color 160ms ease,background-color 160ms ease!important; will-change:transform!important; } .fcc-review-slider[data-fcc-review-slider="1"]:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-card__image-wrap, .fcc-review-slider[data-fcc-review-slider="1"]:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-card__image{ transition:transform 220ms ease,filter 220ms ease,background-color 160ms ease!important; transform-origin:center center!important; } @media (hover:hover) and (pointer:fine){ .fcc-review-slider[data-fcc-review-slider="1"]:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-card:hover, .fcc-review-slider[data-fcc-review-slider="1"]:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-card:focus-within{ transform:translateY(-3px)!important; box-shadow:var(--fcc-rs-card-hover-shadow,0 12px 28px rgba(0,46,37,.14))!important; border-color:var(--fcc-rs-card-hover-border,#D6E8E5)!important; z-index:4!important; } .fcc-review-slider[data-fcc-review-slider="1"]:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-card:hover .fcc-review-card__image, .fcc-review-slider[data-fcc-review-slider="1"]:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-card:focus-within .fcc-review-card__image{ transform:scale(var(--fcc-rs-card-hover-image-scale,1.025))!important; filter:brightness(var(--fcc-rs-card-hover-brightness,1.03))!important; } } @media (prefers-reduced-motion:reduce){ .fcc-review-slider[data-fcc-review-slider="1"]:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-card, .fcc-review-slider[data-fcc-review-slider="1"]:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-card__image-wrap, .fcc-review-slider[data-fcc-review-slider="1"]:not(.fcc-best-sellers-slider):not([data-fcc-best-sellers-slider="1"]) .fcc-review-card__image{ transition:none!important; transform:none!important; } }