/* ============================================================================
   LS Fabrication — Reviews tab on single product pages (CusRev output)
   Enqueued by inc/lsfab-product-reviews.php on product pages only.

   Everything is scoped under #tab-reviews so it outweighs CusRev's own
   frontend.css (which anchors on #reviews) without reaching for !important.
   The old dark-mode patches for these selectors were removed from
   absorbed.css on 2026-09-05; site.css keeps its token colours as a fallback
   for CusRev markup that renders outside this tab.

   Three states share the sheet:
     1. empty     — .ls-rev-empty card + the inline form under it (-nc)
     2. list      — head, summary card, toolbar, review cards, show more
     3. form open — CusRev swaps the list for the form; same form styling

   #comments is laid out as a wrapping flex row so the search box and the
   count/sort row can share one line without touching the AJAX markup.
   ========================================================================= */

#tab-reviews #reviews.cr-reviews-ajax-reviews {
    width: 100%;
    color: var(--ls-text);
}

#tab-reviews #reviews > .clear { display: none; }

/* --- Row layout inside #comments ---------------------------------------- */

#tab-reviews #reviews #comments.cr-reviews-ajax-comments {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--ls-space-3) var(--ls-space-4);
}

/* (2,1,0) on purpose: the search box and count row below take their own
   flex basis at (2,2,0), and the head/summary set their own margins. */
#tab-reviews #comments.cr-reviews-ajax-comments > * {
    flex: 0 0 100%;
    min-width: 0;
    margin: 0;
}

/* ============================================================================
   1. HEAD
   ========================================================================= */

#tab-reviews #comments > .ls-rev-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--ls-space-2) var(--ls-space-3);
    margin: 0 0 var(--ls-space-2);
}

#tab-reviews .ls-rev-head__eyebrow,
#tab-reviews .ls-rev-empty__eyebrow {
    flex: 0 0 100%;
    margin: 0;
    padding: 0;
    font-family: var(--ls-font-body);
    font-size: var(--ls-micro);
    font-weight: 600;
    line-height: 1;
    letter-spacing: var(--ls-tracking-eyebrow);
    text-transform: uppercase;
    color: var(--ls-red);
}

/* 2026-09-07 (SEO-02): the count moved OUT of the heading into a sibling pill,
   so the flex row that used to live on the title now lives on .__line. The
   title keeps its own reset because CusRev and Woo both style this class. */
#tab-reviews .ls-rev-head__line {
    display: flex;
    align-items: center;
    gap: var(--ls-space-3);
    flex-wrap: wrap;
}

#tab-reviews .ls-rev-head__title {
    position: static;
    display: block;
    width: auto;
    height: auto;
    margin: 0;
    padding: 0;
    overflow: visible;
    clip: auto;
    clip-path: none;
    white-space: normal;
    font-family: var(--ls-font-display);
    font-size: var(--ls-h3);
    font-weight: 700;
    line-height: var(--ls-leading-tight);
    color: var(--ls-text);
}

#tab-reviews .ls-rev-head__count {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 0 10px;
    background-color: var(--ls-surface-raised);
    border: 1px solid var(--ls-hairline-faint);
    border-radius: var(--ls-radius-pill);
    font-family: var(--ls-font-body);
    font-size: var(--ls-small);
    font-weight: 600;
    letter-spacing: 0;
    color: var(--ls-text-muted);
    font-variant-numeric: tabular-nums;
}

/* ============================================================================
   2. SUMMARY CARD — average, stars, count, CTA | histogram
   ========================================================================= */

#tab-reviews #reviews #comments .cr-summaryBox-wrap {
    display: grid;
    grid-template-columns: minmax(200px, 260px) minmax(0, 1fr);
    align-items: center;
    gap: var(--ls-space-7);
    margin: 0 0 var(--ls-space-2);
    padding: var(--ls-space-6);
    background-color: var(--ls-surface-1);
    border: 1px solid var(--ls-hairline-faint);
    border-radius: var(--ls-radius-lg);
    color: var(--ls-text);
}

#tab-reviews #reviews .cr-summaryBox-wrap .cr-overall-rating-wrap {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: var(--ls-space-2);
    width: 100%;
    max-width: none;
    flex: none;
    padding-right: var(--ls-space-6);
    border-right: 1px solid var(--ls-hairline-faint);
    text-align: left;
}

#tab-reviews #reviews .cr-summaryBox-wrap .cr-average-rating {
    display: flex;
    align-items: baseline;
    gap: 6px;
    font-family: var(--ls-font-display);
    font-size: var(--ls-display);
    font-weight: 700;
    line-height: 0.9;
    letter-spacing: -0.01em;
    color: var(--ls-text);
}

#tab-reviews #reviews .cr-summaryBox-wrap .cr-average-rating span::after {
    content: "/ 5";
    margin-left: 4px;
    font-size: var(--ls-h4);
    font-weight: 600;
    color: var(--ls-text-faint);
}

#tab-reviews #reviews .cr-summaryBox-wrap .cr-average-rating-stars {
    line-height: 0;
    margin-top: var(--ls-space-1);
}

#tab-reviews #reviews .cr-summaryBox-wrap .cr-average-rating-stars .crstar-rating-svg {
    margin: 0;
}

#tab-reviews #reviews .cr-summaryBox-wrap .cr-average-rating-stars svg {
    width: 22px;
    height: 22px;
}

#tab-reviews #reviews .cr-summaryBox-wrap .cr-total-rating-count {
    font-family: var(--ls-font-body);
    font-size: var(--ls-small);
    line-height: 1.4;
    color: var(--ls-text-muted);
}

#tab-reviews #reviews.cr-reviews-ajax-reviews .cr-ajax-reviews-add-review {
    margin: var(--ls-space-3) 0 0;
}

/* Histogram */
#tab-reviews #reviews .cr-summaryBox-wrap .ivole-summaryBox {
    width: 100%;
    flex: 1 1 auto;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    font-size: var(--ls-small);
}

#tab-reviews #reviews .cr-summaryBox-wrap .cr-histogramTable {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
    max-width: 560px;
    margin: 0;
}

#tab-reviews #reviews .cr-histogramTable .ivole-histogramRow {
    display: flex;
    align-items: center;
    gap: var(--ls-space-3);
}

#tab-reviews #reviews .cr-histogramTable .ivole-histogramRow .ivole-histogramCell1,
#tab-reviews #reviews .cr-histogramTable .ivole-histogramRow .ivole-histogramCell2,
#tab-reviews #reviews .cr-histogramTable .ivole-histogramRow .ivole-histogramCell3 {
    padding: 0;
}

#tab-reviews #reviews .cr-histogramTable .ivole-histogramRow .ivole-histogramCell1 {
    flex: 0 0 34px;
    min-width: 34px;
}

#tab-reviews #reviews .cr-histogramTable .ivole-histogramRow .ivole-histogramCell2 {
    flex: 1 1 auto;
    min-width: 0;
}

#tab-reviews #reviews .cr-histogramTable .ivole-histogramRow .ivole-histogramCell3 {
    flex: 0 0 40px;
    min-width: 40px;
    text-align: right;
    font-size: var(--ls-small);
    font-weight: 500;
    color: var(--ls-text-muted);
    font-variant-numeric: tabular-nums;
}

#tab-reviews #reviews .cr-histogramTable .ivole-histogramRow .cr-histogram-a,
#tab-reviews #reviews .cr-histogramTable .ivole-histogramRow .cr-histogram-rating-label {
    color: var(--ls-text-muted);
    font-size: var(--ls-small);
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    font-variant-numeric: tabular-nums;
}

#tab-reviews #reviews .cr-histogramTable .ivole-histogramRow .cr-histogram-rating-label {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 4px;
    width: auto;
}

#tab-reviews #reviews .cr-histogramTable .ivole-histogramRow .cr-histogram-rating-icon {
    width: 12px;
    height: 12px;
    fill: var(--ls-amber);
}

#tab-reviews #reviews .cr-histogramTable .ivole-histogramRow:hover .cr-histogram-a,
#tab-reviews #reviews .cr-histogramTable .ivole-histogramRow:hover .ivole-histogramCell3,
#tab-reviews #reviews .cr-histogramTable .ivole-histogramRow.ivole-histogramRow-s .cr-histogram-a,
#tab-reviews #reviews .cr-histogramTable .ivole-histogramRow.ivole-histogramRow-s .ivole-histogramCell3 {
    color: var(--ls-text);
}

#tab-reviews #reviews .ivole-meter {
    height: 8px;
    background: var(--ls-hairline-faint);
    border-radius: var(--ls-radius-pill);
    box-shadow: none;
    overflow: hidden;
}

#tab-reviews #reviews .ivole-meter .ivole-meter-bar {
    display: block;
    height: 100%;
    background: var(--ls-amber);
    border-radius: var(--ls-radius-pill);
    box-shadow: none;
    color: transparent;
    font-size: 0;
    line-height: 0;
    transition: width 0.5s ease;
}

#tab-reviews #reviews .ivole-meter .ivole-meter-bar::before { display: none; }

/* ============================================================================
   3. TOOLBAR — search | count | sort
   ========================================================================= */

#tab-reviews #reviews.cr-reviews-ajax-reviews .cr-ajax-search {
    flex: 1 1 260px;
    display: flex;
    width: auto;
    margin: 0;
    padding: 0;
}

#tab-reviews #reviews.cr-reviews-ajax-reviews .cr-ajax-search > div {
    position: relative;
    flex: 1 1 auto;
}

#tab-reviews #reviews.cr-reviews-ajax-reviews .cr-ajax-search > div > svg:first-child {
    position: absolute;
    top: 50%;
    left: 14px;
    width: 16px;
    height: 16px;
    transform: translateY(-50%);
    fill: var(--ls-text-faint);
    pointer-events: none;
}

#tab-reviews #reviews.cr-reviews-ajax-reviews input.cr-input-text[type="text"] {
    width: 100%;
    height: 44px;
    min-height: 44px;
    margin: 0;
    padding: 0 40px;
    background-color: var(--ls-surface-2);
    border: 1px solid var(--ls-hairline-input);
    border-radius: var(--ls-radius-md);
    box-shadow: none;
    font-family: var(--ls-font-body);
    font-size: var(--ls-body);
    line-height: 42px;
    color: var(--ls-text);
}

#tab-reviews #reviews.cr-reviews-ajax-reviews input.cr-input-text[type="text"]::placeholder {
    color: var(--ls-text-ghost);
    opacity: 1;
}

#tab-reviews #reviews.cr-reviews-ajax-reviews .cr-input-text:focus {
    background-color: var(--ls-surface-2);
    border-color: var(--ls-red);
    box-shadow: var(--ls-focus-ring);
    outline: none;
}

#tab-reviews #reviews.cr-reviews-ajax-reviews .cr-clear-input {
    right: 14px;
    margin: -8px 0 0;
}

#tab-reviews #reviews.cr-reviews-ajax-reviews .cr-clear-input svg { fill: var(--ls-text-faint); }

#tab-reviews #reviews.cr-reviews-ajax-reviews .cr-count-row {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: var(--ls-space-4);
    margin: 0;
    padding: 0;
    background: none;
    border-radius: 0;
    color: var(--ls-text);
}

#tab-reviews #reviews.cr-reviews-ajax-reviews .cr-count-row-count {
    font-family: var(--ls-font-body);
    font-size: var(--ls-small);
    white-space: nowrap;
    color: var(--ls-text-muted);
    font-variant-numeric: tabular-nums;
}

#tab-reviews #reviews.cr-reviews-ajax-reviews .cr-ajax-reviews-sort-div .cr-ajax-reviews-sort {
    -webkit-appearance: none;
    appearance: none;
    display: block;
    width: auto;
    height: 44px;
    min-height: 44px;
    margin: 0;
    padding: 0 40px 0 14px;
    background-color: var(--ls-surface-2);
    background-image:
        linear-gradient(45deg, transparent 50%, rgba(255,255,255,0.45) 50%),
        linear-gradient(135deg, rgba(255,255,255,0.45) 50%, transparent 50%);
    background-position:
        calc(100% - 19px) calc(50% + 2px),
        calc(100% - 13px) calc(50% + 2px);
    background-size: 6px 6px, 6px 6px;
    background-repeat: no-repeat;
    border: 1px solid var(--ls-hairline-input);
    border-radius: var(--ls-radius-md);
    font-family: var(--ls-font-body);
    font-size: var(--ls-small);
    font-weight: 500;
    line-height: 42px;
    color: var(--ls-text);
    cursor: pointer;
}

#tab-reviews #reviews.cr-reviews-ajax-reviews .cr-ajax-reviews-sort-div .cr-ajax-reviews-sort:focus {
    border-color: var(--ls-red);
    box-shadow: var(--ls-focus-ring);
    outline: none;
}

/* --- Customer photos strip (only when a review carries media) ------------ */

#tab-reviews #reviews.cr-reviews-ajax-reviews .cr-ajax-reviews-cus-images-div {
    margin: var(--ls-space-2) 0 0;
}

#tab-reviews #reviews.cr-reviews-ajax-reviews .cr-ajax-reviews-cus-images-div .cr-ajax-reviews-cus-images-title {
    margin: 0 0 var(--ls-space-3);
    padding: 0;
    font-family: var(--ls-font-body);
    font-size: var(--ls-micro);
    font-weight: 600;
    line-height: 1;
    letter-spacing: var(--ls-tracking-eyebrow);
    text-transform: uppercase;
    color: var(--ls-text-faint);
}

#tab-reviews #reviews.cr-reviews-ajax-reviews .cr-ajax-reviews-cus-images-div2 {
    display: flex;
    gap: var(--ls-space-2);
    padding-bottom: var(--ls-space-1);
    white-space: normal;
    scrollbar-width: thin;
}

#tab-reviews #reviews .cr-comment-image-top {
    flex: 0 0 auto;
    margin: 0;
    background-color: var(--ls-surface-2);
    border: 1px solid var(--ls-hairline-faint);
    border-radius: var(--ls-radius-md);
    filter: none;
    transition: border-color var(--ls-transition);
}

#tab-reviews #reviews .cr-comment-image-top:hover {
    border-color: var(--ls-hairline-strong);
    filter: none;
}

/* woocommerce.css gives every image inside a tab panel a 22px vertical
   margin (description imagery); thumbnails are not that. */
#tab-reviews #reviews .cr-comment-image-top img,
#tab-reviews #reviews .cr-comment-image-top video {
    display: block;
    width: 112px;
    height: 112px;
    margin: 0;
}

/* "With media" filter chip — same shape as the theme's .ls-chip */
#tab-reviews #reviews.cr-reviews-ajax-reviews .cr-review-tags-filter {
    flex: 0 0 auto;
    gap: var(--ls-space-2);
    padding: 0;
}

#tab-reviews #reviews.cr-reviews-ajax-reviews .cr-review-tags-filter .cr-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 44px;
    margin: 0;
    padding: 0 var(--ls-space-4);
    background-color: var(--ls-surface-2);
    border: 1px solid var(--ls-hairline-input);
    border-radius: var(--ls-radius-pill);
    box-shadow: none;
    font-family: var(--ls-font-body);
    font-size: var(--ls-small);
    font-weight: 500;
    line-height: 1;
    color: var(--ls-text-muted);
    cursor: pointer;
    transition: border-color var(--ls-transition), color var(--ls-transition), background-color var(--ls-transition);
}

#tab-reviews #reviews.cr-reviews-ajax-reviews .cr-review-tags-filter .cr-tag svg {
    width: 14px;
    height: 14px;
    fill: currentColor;
}

#tab-reviews #reviews.cr-reviews-ajax-reviews .cr-review-tags-filter span.cr-tag:hover {
    background-color: var(--ls-surface-raised);
    border-color: var(--ls-hairline-strong);
    box-shadow: none;
    color: var(--ls-text);
}

#tab-reviews #reviews.cr-reviews-ajax-reviews .cr-review-tags-filter span.cr-tag.cr-tag-selected,
#tab-reviews #reviews.cr-reviews-ajax-reviews .cr-review-tags-filter span.cr-tag.cr-tag-selected:hover {
    background-color: rgba(255, 0, 68, 0.12);
    border-color: var(--ls-red);
    box-shadow: none;
    color: var(--ls-text);
}

#tab-reviews #reviews.cr-reviews-ajax-reviews .cr-review-tags-filter span.cr-tag:focus-visible {
    outline: none;
    box-shadow: var(--ls-focus-ring);
}

/* ============================================================================
   4. REVIEW CARDS
   ========================================================================= */

#tab-reviews #reviews #comments ol.commentlist.cr-ajax-reviews-list {
    display: grid;
    gap: var(--ls-space-3);
    margin: var(--ls-space-1) 0 0;
    padding: 0;
    list-style: none;
}

#tab-reviews #reviews #comments ol.commentlist.cr-ajax-reviews-list > li.review {
    margin: 0;
    padding: 0;
    list-style: none;
}

#tab-reviews #reviews #comments ol.commentlist.cr-ajax-reviews-list .comment_container {
    position: relative;
    margin: 0;
    padding: var(--ls-space-5);
    background-color: var(--ls-surface-1);
    border: 1px solid var(--ls-hairline-faint);
    border-radius: var(--ls-radius-lg);
    color: var(--ls-text);
}

/* Avatar: CusRev prints it as the container's first image, absolutely
   positioned at 0/0 and 50px wide. Pull it inside the padding at 44px. */
#tab-reviews #reviews .comment_container > img,
#tab-reviews #reviews .comment_container .cr-avatar,
#tab-reviews #reviews .comment_container .cr-std-avatar {
    position: absolute;
    top: var(--ls-space-5);
    left: var(--ls-space-5);
    width: 44px;
    height: 44px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    object-fit: cover;
    box-shadow: none;
}

#tab-reviews #reviews .comment_container.cr-verified-owner .cr-avatar-check {
    display: block;
    position: absolute;
    top: calc(var(--ls-space-5) + 28px);
    left: calc(var(--ls-space-5) + 28px);
    width: 18px;
    height: 18px;
    line-height: 0;
    background-color: var(--ls-surface-1);
    border-radius: 50%;
}

#tab-reviews #reviews .comment_container.cr-verified-owner .cr-avatar-check svg {
    width: 18px;
    height: 18px;
    fill: var(--ls-green);
}

#tab-reviews #reviews .cr-ajax-reviews-list .comment_container .cr-comment-text {
    margin: 0 0 0 calc(44px + var(--ls-space-4));
    padding: 0;
    border: 0;
}

#tab-reviews #reviews .cr-ajax-reviews-list .comment_container .cr-comment-text.comment-text-no-avatar {
    margin: 0;
}

#tab-reviews #reviews .cr-comment-text .meta {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--ls-space-3);
    margin: 0 0 var(--ls-space-2);
    padding: 0;
}

#tab-reviews #reviews .cr-comment-text .meta .cr-meta-author-title {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--ls-space-2) var(--ls-space-3);
}

#tab-reviews #reviews .cr-comment-text .meta .woocommerce-review__author {
    font-family: var(--ls-font-body);
    font-size: var(--ls-body);
    font-weight: 600;
    line-height: var(--ls-leading-snug);
    color: var(--ls-text);
}

#tab-reviews #reviews .cr-comment-text .meta .woocommerce-review__verified {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 0 9px;
    background-color: rgba(5, 157, 88, 0.14);
    border: 1px solid rgba(5, 157, 88, 0.35);
    border-radius: var(--ls-radius-pill);
    font-family: var(--ls-font-body);
    font-size: var(--ls-caption);
    font-weight: 600;
    font-style: normal;
    letter-spacing: var(--ls-tracking-eyebrow);
    line-height: 1;
    text-transform: uppercase;
    color: #2fd07f;
}

#tab-reviews #reviews .cr-comment-text .meta time.woocommerce-review__published-date {
    flex: 0 0 auto;
    padding-top: 2px;
    font-family: var(--ls-font-body);
    font-size: var(--ls-small);
    line-height: var(--ls-leading-snug);
    white-space: nowrap;
    color: var(--ls-text-faint);
}

#tab-reviews #reviews .cr-comment-text > .crstar-rating-svg {
    margin: 0 0 var(--ls-space-3);
}

#tab-reviews #reviews .cr-comment-text > .crstar-rating-svg svg {
    width: 16px;
    height: 16px;
}

/* "Verified review - view original" — keep the trust link, dial it down. */
#tab-reviews #reviews .cr-comment-text p.ivole-verified-badge {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 var(--ls-space-3);
    padding: 0;
    font-size: var(--ls-caption);
    line-height: var(--ls-leading-snug);
    color: var(--ls-text-faint);
}

#tab-reviews #reviews .cr-comment-text p.ivole-verified-badge img {
    width: 14px;
    height: 14px;
    margin: 0;
    vertical-align: middle;
    opacity: 0.8;
}

#tab-reviews #reviews .cr-comment-text p.ivole-verified-badge .ivole-verified-badge-text {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--ls-text-faint);
}

#tab-reviews #reviews .cr-comment-text p.ivole-verified-badge a {
    color: var(--ls-text-soft);
    text-decoration: underline;
    text-decoration-color: var(--ls-hairline-strong);
    text-underline-offset: 2px;
}

#tab-reviews #reviews .cr-comment-text p.ivole-verified-badge a:hover {
    color: var(--ls-red);
    text-decoration-color: currentColor;
}

#tab-reviews #reviews .cr-comment-text .description {
    margin: 0;
    padding: 0;
}

/* Star-only reviews end on the verified line; nothing trails after it. */
#tab-reviews #reviews .cr-comment-text > :last-child {
    margin-bottom: 0;
}

#tab-reviews #reviews .cr-comment-text .description p {
    margin: 0;
    padding: 0;
    font-family: var(--ls-font-body);
    font-size: var(--ls-body);
    line-height: var(--ls-leading-body);
    color: var(--ls-text-muted);
}

#tab-reviews #reviews .cr-comment-text .description p + p { margin-top: 10px; }

#tab-reviews #reviews .cr-comment-text .cr-comment-images {
    display: flex;
    flex-wrap: wrap;
    gap: var(--ls-space-2);
    margin: var(--ls-space-3) 0 0;
}

#tab-reviews #reviews .cr-comment-text .cr-comment-images .iv-comment-image,
#tab-reviews #reviews .cr-comment-text .cr-comment-videos .cr-comment-video {
    float: none;
    margin: 0;
    border: 1px solid var(--ls-hairline-faint);
    border-radius: var(--ls-radius-md);
    overflow: hidden;
    filter: none;
}

#tab-reviews #reviews .cr-comment-text .cr-comment-images .iv-comment-image:hover {
    border-color: var(--ls-hairline-strong);
    filter: none;
}

#tab-reviews #reviews .cr-comment-text .cr-comment-images div.iv-comment-image img {
    display: block;
    width: 96px;
    height: 96px;
    max-width: 96px;
    max-height: 96px;
    margin: 0;
    border-radius: 0;
}

#tab-reviews #reviews .cr-comment-text .cr-comment-videos video,
#tab-reviews #reviews .cr-comment-text .cr-comment-videos img,
#tab-reviews #reviews .comment_container .cr-avatar-check svg,
#tab-reviews .cr-ajax-reviews-review-form img {
    margin: 0;
}

/* Show more */
#tab-reviews #reviews .cr-show-more {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: var(--ls-space-2);
}

/* Ghost button. components.css paints every button's border transparent with
   !important, so the outline colour has to be !important too (same as the
   theme's own .ls-btn--outline). */
#tab-reviews #reviews.cr-reviews-ajax-reviews .cr-show-more-reviews-prd,
#tab-reviews #comments.cr-reviews-ajax-comments > .cr-show-more-reviews-prd {
    flex: 0 0 auto;
    margin: var(--ls-space-2) auto 0;
    background-color: transparent;
    border-color: var(--ls-hairline-strong) !important;
    color: var(--ls-text);
}

#tab-reviews #reviews.cr-reviews-ajax-reviews .cr-show-more-reviews-prd:hover {
    background-color: rgba(255, 255, 255, 0.06);
    border-color: var(--ls-text) !important;
    color: var(--ls-text);
}

/* ============================================================================
   5. EMPTY STATE
   ========================================================================= */

#tab-reviews .ls-rev-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: var(--ls-space-7) var(--ls-space-5);
    background-color: var(--ls-surface-1);
    background-image: radial-gradient(ellipse 60% 70% at 50% 0%, rgba(255, 0, 68, 0.12), transparent);
    border: 1px solid var(--ls-hairline-faint);
    border-radius: var(--ls-radius-lg);
    text-align: center;
}

#tab-reviews .ls-rev-empty__stars {
    display: flex;
    gap: 6px;
    margin-bottom: var(--ls-space-4);
    line-height: 0;
    color: var(--ls-amber);
}

#tab-reviews .ls-rev-empty__stars svg {
    display: block;
    width: 28px;
    height: 28px;
}

#tab-reviews .ls-rev-empty__eyebrow { flex: 0 0 auto; }

#tab-reviews .ls-rev-empty__title {
    margin: var(--ls-space-3) 0 var(--ls-space-3);
    padding: 0;
    font-family: var(--ls-font-display);
    font-size: var(--ls-h3);
    font-weight: 700;
    line-height: var(--ls-leading-tight);
    color: var(--ls-text);
}

#tab-reviews .ls-rev-empty__copy {
    max-width: 54ch;
    margin: 0 0 var(--ls-space-5);
    padding: 0;
    font-family: var(--ls-font-body);
    font-size: var(--ls-body);
    line-height: var(--ls-leading-body);
    color: var(--ls-text-muted);
}

/* ============================================================================
   6. WRITE-A-REVIEW FORM
   ========================================================================= */

#tab-reviews .cr-ajax-reviews-review-form {
    margin: var(--ls-space-4) 0 0;
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-wrap {
    padding: var(--ls-space-6);
    background-color: var(--ls-surface-1);
    border: 1px solid var(--ls-hairline-faint);
    border-radius: var(--ls-radius-lg);
    color: var(--ls-text);
}

/* Form heading row ("Write a review" + back arrow when opened over a list) */
#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-wrap .cr-review-form-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 0 var(--ls-space-5);
    padding: 0 0 var(--ls-space-4);
    border: 0;
    border-bottom: 1px solid var(--ls-hairline-faint);
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-wrap .cr-review-form-nav .cr-nav-left {
    display: flex;
    align-items: center;
    gap: var(--ls-space-2);
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-wrap .cr-review-form-nav .cr-nav-left span {
    font-family: var(--ls-font-display);
    font-size: var(--ls-h4);
    font-weight: 700;
    line-height: 1.1;
    color: var(--ls-text);
}

/* CusRev draws the back arrow and the close X with a hard-coded #0E252C
   stroke attribute on the path; a CSS stroke outranks the attribute. */
#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-wrap .cr-review-form-nav svg {
    width: 28px;
    height: 28px;
    margin: 0 0 0 -6px;
    fill: none;
    cursor: pointer;
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-wrap .cr-review-form-nav .cr-nav-right svg {
    margin: 0 -6px 0 0;
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-wrap .cr-review-form-nav svg path {
    stroke: var(--ls-text-soft);
    stroke-width: 1.75;
    transition: stroke var(--ls-transition);
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-wrap .cr-review-form-nav svg:hover path {
    stroke: var(--ls-text);
}

/* Inline (no reviews yet): the arrow leads nowhere, so it goes. */
#tab-reviews .cr-ajax-reviews-review-form.cr-ajax-reviews-review-form-nc .cr-review-form-nav .cr-nav-left svg {
    display: none;
}

/* Product line */
#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-item {
    display: flex;
    align-items: center;
    gap: var(--ls-space-4);
    max-width: none;
    margin: 0 0 var(--ls-space-5);
    padding: 0 0 var(--ls-space-5);
    border-bottom: 1px solid var(--ls-hairline-faint);
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-item img {
    display: block;
    width: 56px;
    height: 56px;
    margin: 0;
    border-radius: var(--ls-radius-md);
    object-fit: cover;
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-item span {
    display: block;
    font-family: var(--ls-font-body);
    font-size: var(--ls-body);
    font-weight: 600;
    line-height: 1.35;
    color: var(--ls-text);
}

/* Rating */
#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-rating-overall .cr-review-form-rating {
    max-width: none;
    margin: 0 0 var(--ls-space-5);
    padding: 0;
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-rating-overall .cr-review-form-rating-label,
#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-lbl {
    position: static;
    display: block;
    height: auto;
    margin: 0 0 var(--ls-space-2);
    padding: 0;
    background: none;
    font-family: var(--ls-font-body);
    font-size: var(--ls-micro);
    font-weight: 600;
    line-height: 1;
    letter-spacing: var(--ls-tracking-eyebrow);
    text-transform: uppercase;
    color: var(--ls-text-faint);
}

#tab-reviews .cr-ajax-reviews-review-form .required { color: var(--ls-red); }

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-rating-cont {
    display: flex;
    align-items: center;
    border-radius: var(--ls-radius-md);
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-rating-cont:focus-visible {
    outline: none;
    box-shadow: var(--ls-focus-ring);
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-rating-cont .cr-review-form-rating-inner {
    height: 32px;
    padding: 0 3px;
    cursor: pointer;
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-rating-cont .cr-review-form-rating-inner svg {
    width: 32px;
    height: 32px;
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-rating-cont .cr-review-form-rating-nbr {
    height: 32px;
    margin: 0 0 0 var(--ls-space-3);
    font-family: var(--ls-font-body);
    font-size: var(--ls-small);
    font-weight: 500;
    line-height: 32px;
    color: var(--ls-text-muted);
    font-variant-numeric: tabular-nums;
}

/* Fields */
#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-comment,
#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-ne,
#tab-reviews .cr-ajax-reviews-review-form .cr-form-item-media,
#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-buttons {
    max-width: none;
    margin: 0 0 var(--ls-space-5);
    padding: 0;
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-ne {
    display: flex;
    gap: var(--ls-space-4);
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-ne .cr-review-form-name,
#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-ne .cr-review-form-email {
    flex: 1 1 0;
    min-width: 0;
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-comment .cr-review-form-comment-txt,
#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-ne .cr-review-form-txt {
    display: block;
    width: 100%;
    margin: 0;
    background-color: var(--ls-surface-2);
    border: 1px solid var(--ls-hairline-input);
    border-radius: var(--ls-radius-md);
    box-shadow: none;
    font-family: var(--ls-font-body);
    font-size: var(--ls-body);
    color: var(--ls-text);
    transition: border-color var(--ls-transition), box-shadow var(--ls-transition);
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-comment .cr-review-form-comment-txt {
    min-height: 140px;
    padding: var(--ls-space-3) var(--ls-control-pad-x);
    line-height: var(--ls-leading-body);
    resize: vertical;
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-ne .cr-review-form-txt {
    height: var(--ls-control-h);
    min-height: var(--ls-control-h);
    padding: 0 var(--ls-control-pad-x);
    line-height: normal;
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-comment-txt:focus,
#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-txt:focus {
    border-color: var(--ls-red);
    box-shadow: var(--ls-focus-ring);
    outline: none;
}

/* Chrome autofill paints the field white; keep it on the surface. */
#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-txt:-webkit-autofill,
#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-txt:-webkit-autofill:hover,
#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-txt:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px var(--ls-surface-2) inset;
    -webkit-text-fill-color: var(--ls-text);
    caret-color: var(--ls-text);
    transition: background-color 9999s ease-out;
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-comment.cr-review-form-error .cr-review-form-comment-txt,
#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-name.cr-review-form-error .cr-review-form-txt,
#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-email.cr-review-form-error .cr-review-form-txt {
    border: 1px solid var(--ls-red);
    box-shadow: var(--ls-focus-ring);
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-field-error {
    margin: var(--ls-space-2) 0 0;
    font-family: var(--ls-font-body);
    font-size: var(--ls-small);
    color: var(--ls-red);
}

/* Photo / video drop zone */
#tab-reviews .cr-ajax-reviews-review-form .cr-form-item-media-none {
    display: flex;
    align-items: center;
    padding: var(--ls-space-4);
    background-color: var(--ls-surface-2);
    border: 1px dashed var(--ls-hairline-strong);
    border-radius: var(--ls-radius-md);
    cursor: pointer;
    transition: border-color var(--ls-transition);
}

#tab-reviews .cr-ajax-reviews-review-form .cr-form-item-media-none:hover,
#tab-reviews .cr-ajax-reviews-review-form .cr-form-item-media-none:active {
    border-color: var(--ls-text-soft);
}

#tab-reviews .cr-ajax-reviews-review-form .cr-form-item-media-none .cr-form-item-media-icon {
    width: 40px;
    height: 40px;
    padding: 9px;
    border: 1px solid var(--ls-hairline);
    border-radius: var(--ls-radius-md);
    fill: var(--ls-text-soft);
}

#tab-reviews .cr-ajax-reviews-review-form .cr-form-item-media-none .cr-form-item-media-icon:first-child {
    margin: 0 var(--ls-space-2) 0 0;
}

#tab-reviews .cr-ajax-reviews-review-form .cr-form-item-media-none span {
    margin: 0 0 0 var(--ls-space-4);
    font-family: var(--ls-font-body);
    font-size: var(--ls-small);
    color: var(--ls-text-muted);
}

#tab-reviews .cr-ajax-reviews-review-form .cr-form-item-media-preview .cr-upload-images-containers,
#tab-reviews .cr-ajax-reviews-review-form .cr-form-item-media-preview .cr-form-item-media-add {
    border-color: var(--ls-hairline-strong);
    border-radius: var(--ls-radius-md);
    color: var(--ls-text-soft);
}

/* Buttons */
#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-buttons {
    display: flex;
    gap: var(--ls-space-3);
    margin-bottom: 0;
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-wrap .cr-review-form-buttons .cr-review-form-submit,
#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-wrap .cr-review-form-buttons .cr-review-form-cancel {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 1 1 0;
    width: auto;
    min-height: var(--ls-btn-h);
    height: auto;
    margin: 0;
    padding: 0 var(--ls-btn-pad-x);
    border-radius: var(--ls-btn-radius);
    font-family: var(--ls-font-display);
    font-size: var(--ls-btn-font);
    font-weight: 700;
    letter-spacing: var(--ls-tracking-button);
    line-height: 1;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-color var(--ls-transition), border-color var(--ls-transition), color var(--ls-transition);
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-wrap .cr-review-form-buttons .cr-review-form-submit {
    background-color: var(--ls-red-btn);
    border: 1px solid var(--ls-red-btn);
    color: #ffffff;
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-wrap .cr-review-form-buttons .cr-review-form-submit:hover {
    background-color: var(--ls-red-btn-hover);
    border-color: var(--ls-red-btn-hover);
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-wrap .cr-review-form-buttons .cr-review-form-cancel {
    background-color: transparent;
    border: 1px solid var(--ls-hairline-strong);
    color: var(--ls-text);
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-wrap .cr-review-form-buttons .cr-review-form-cancel:hover {
    background-color: var(--ls-surface-raised);
    border-color: var(--ls-text);
}

#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-wrap .cr-review-form-buttons .cr-review-form-submit:focus-visible,
#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-wrap .cr-review-form-buttons .cr-review-form-cancel:focus-visible {
    outline: none;
    box-shadow: var(--ls-focus-ring);
}

/* Inline (no reviews yet) form has nothing to cancel back to. */
#tab-reviews .cr-ajax-reviews-review-form.cr-ajax-reviews-review-form-nc .cr-review-form-wrap .cr-review-form-buttons .cr-review-form-cancel {
    display: none;
}

/* Thank-you / error message after submit */
#tab-reviews .cr-ajax-reviews-review-form .cr-review-form-result {
    font-family: var(--ls-font-body);
    font-size: var(--ls-body);
    line-height: var(--ls-leading-body);
    color: var(--ls-text);
}

/* ============================================================================
   7. PHONE
   ========================================================================= */

@media (max-width: 767px) {

    #tab-reviews #reviews #comments .cr-summaryBox-wrap {
        grid-template-columns: 1fr;
        gap: var(--ls-space-5);
        padding: var(--ls-space-5) var(--ls-space-4);
    }

    #tab-reviews #reviews .cr-summaryBox-wrap .cr-overall-rating-wrap {
        align-items: center;
        padding: 0 0 var(--ls-space-5);
        border-right: 0;
        border-bottom: 1px solid var(--ls-hairline-faint);
        text-align: center;
    }

    #tab-reviews #reviews .cr-summaryBox-wrap .cr-average-rating { font-size: var(--ls-display); }

    #tab-reviews #reviews.cr-reviews-ajax-reviews .cr-ajax-search { flex: 0 0 100%; }

    #tab-reviews #reviews.cr-reviews-ajax-reviews .cr-count-row {
        flex: 0 0 100%;
        justify-content: space-between;
    }

    #tab-reviews #reviews #comments ol.commentlist.cr-ajax-reviews-list .comment_container {
        padding: var(--ls-space-4);
    }

    #tab-reviews #reviews .comment_container > img,
    #tab-reviews #reviews .comment_container .cr-avatar,
    #tab-reviews #reviews .comment_container .cr-std-avatar {
        top: var(--ls-space-4);
        left: var(--ls-space-4);
        width: 40px;
        height: 40px;
    }

    #tab-reviews #reviews .comment_container.cr-verified-owner .cr-avatar-check {
        top: calc(var(--ls-space-4) + 25px);
        left: calc(var(--ls-space-4) + 25px);
    }


    #tab-reviews #reviews .cr-comment-text .meta {
        flex-wrap: wrap;
    }

    #tab-reviews .ls-rev-empty {
        padding: var(--ls-space-6) var(--ls-space-4);
    }

    #tab-reviews .cr-ajax-reviews-review-form .cr-review-form-wrap {
        padding: var(--ls-space-5) var(--ls-space-4);
    }

    #tab-reviews .cr-ajax-reviews-review-form .cr-review-form-ne {
        flex-direction: column;
    }

    #tab-reviews .cr-ajax-reviews-review-form .cr-review-form-ne .cr-review-form-name,
    #tab-reviews .cr-ajax-reviews-review-form .cr-review-form-ne .cr-review-form-email {
        flex: none;
        width: 100%;
    }

    /* Phone cards: the avatar indents only the name row; the stars, the
       verified line and the review body run full width underneath. */
    #tab-reviews #reviews #comments .cr-ajax-reviews-list .comment_container .cr-comment-text {
        margin: 0;
    }

    #tab-reviews #reviews #comments ol.commentlist li .cr-comment-text .meta {
        min-height: 40px;
        margin-bottom: var(--ls-space-3);
        padding-left: calc(40px + var(--ls-space-3));
        flex-direction: column;
        justify-content: center;
        gap: var(--ls-space-1);
    }

    #tab-reviews #reviews .cr-comment-text .meta time.woocommerce-review__published-date {
        padding-top: 0;
    }

    #tab-reviews .cr-ajax-reviews-review-form .cr-review-form-buttons {
        flex-direction: column;
    }
}

/* ============================================================================
   8. OUTRANKING DIVI'S THEME BUILDER CSS
   Divi's dynamic sheet for the product template carries
   `.woocommerce #reviews #comments ol.commentlist li { margin-bottom: 40px
   !important }`, `… h2/h3 { margin-bottom: 30px !important }` and
   `… li img.avatar { width: auto !important }`. Each is restated here with
   more IDs so the card grid, the head and the avatar size hold.
   ========================================================================= */

#tab-reviews #reviews #comments ol.commentlist.cr-ajax-reviews-list > li.review {
    margin: 0 !important;
}

#tab-reviews #reviews #comments h3.ls-rev-head__title {
    margin: 0 !important;
}

#tab-reviews #reviews #comments h3.ls-rev-empty__title {
    margin: var(--ls-space-3) 0 !important;
}

#tab-reviews #reviews #comments ol.commentlist li img.avatar,
#tab-reviews #reviews #comments ol.commentlist li .comment_container > img {
    width: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    background: none !important;
    border: 0 !important;
}

#tab-reviews #reviews #comments ol.commentlist li .cr-comment-text .meta {
    font-size: var(--ls-body);
    color: var(--ls-text);
}

@media (max-width: 767px) {
    #tab-reviews #reviews #comments ol.commentlist li img.avatar,
    #tab-reviews #reviews #comments ol.commentlist li .comment_container > img {
        width: 40px !important;
        height: 40px !important;
    }
}