/* Product review widget (W5): our data in the look of the Judge.me widget it replaces.
   Teal by default (scooter pages, as on the live store); brown inside the v2 product-reviews section (theme override).
   W28: sizes, spacing and controls measured on the Shopify store's rendered Judge.me widget (minimal header,
   2026-10-22): 48px above and below, 4.9 at 20px bold + count at 12px, 248x34 "Write a review" (stretches when the
   widget is under 768px wide), 42x36 filter and 40x36 sort icon buttons, 100px photo strip with arrows, 24px stars,
   items 16px apart inside and 24px apart with a hairline, round 28px page buttons. */
.okk-rv{--okk-rv-font:var(--body,Manrope,system-ui,sans-serif);--okk-rv-accent:#108474;--okk-rv-button:#108474;--okk-rv-button-ink:#fff;--okk-rv-avatar:rgba(16,132,116,.1);--okk-rv-text:#000;--okk-rv-soft:#757575;--okk-rv-line:rgba(0,0,0,.2);
  max-width:1200px;margin:0 auto;padding:48px 0;color:var(--okk-rv-text);font:400 16px/normal var(--okk-rv-font);text-align:left;container-type:inline-size}
.v2-product-reviews .okk-rv{--okk-rv-accent:#923d17;--okk-rv-button:#232c31;--okk-rv-avatar:rgba(146,61,23,.1);--okk-rv-text:#29221c;--okk-rv-soft:#66594c;--okk-rv-line:rgba(41,34,28,.2)}
/* Parts and coming-soon pages (v2 product-reviews section), as Judge.me drew it there: the theme's 48px touch height on
   the filter and sort buttons, a 34px Write button, names in the lighter text colour, body lines at normal height */
.v2-product-reviews .okk-rv .okk-rv__write{height:34px;min-height:34px;padding:8px 16px;border-radius:8px;font:400 16px/16px var(--okk-rv-font)}
.v2-product-reviews .okk-rv .okk-rv__icon,.v2-product-reviews .okk-rv .okk-rv__sort{height:48px;min-height:48px}
.v2-product-reviews .okk-rv .okk-rv__name{color:var(--okk-rv-soft)}
.v2-product-reviews .okk-rv .okk-rv__body,.v2-product-reviews .okk-rv .okk-rv__body p{line-height:normal}
.okk-rv *{box-sizing:border-box}
.okk-rv .kk-vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.okk-rv-star{display:block;color:var(--okk-rv-accent)}
.okk-rv .jdgm-star{color:var(--okk-rv-accent)}

/* Header: rating on the left, actions on the right; wraps under 768px with a 40px gap */
.okk-rv__head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap;margin:0 0 24px}
.okk-rv__summary{display:flex;align-items:center;gap:8px;min-height:27px}
.okk-rv .okk-rv__avg{margin:0;font:700 20px/normal var(--okk-rv-font)}
.okk-rv .okk-rv__count{margin:0;font:400 12px/normal var(--okk-rv-font);color:var(--okk-rv-text)}
.okk-rv__actions{display:flex;flex:1 1 300px;justify-content:flex-end;align-items:center;gap:8px;min-width:0}
.okk-rv__write{flex:0 0 248px;width:248px;min-height:34px;padding:8px 16px;border-radius:8px;border:1px solid var(--okk-rv-button);background:var(--okk-rv-button);color:var(--okk-rv-button-ink);font:400 16px/16px var(--okk-rv-font);cursor:pointer;margin-top:1px;margin-bottom:1px}
.okk-rv__write:hover{filter:brightness(1.08)}
.okk-rv__icon,.okk-rv__sort{position:relative;flex:none;width:42px;height:36px;display:grid;place-items:center;padding:0;border:1px solid #000;border-radius:8px;background:transparent;color:#000;cursor:pointer}
.okk-rv__sort{width:40px;margin:0;overflow:hidden}
.okk-rv__icon svg,.okk-rv__sort svg{width:16px;height:16px}
.okk-rv__icon[aria-expanded="true"]{background:#000;color:#fff}
.okk-rv__sort select{position:absolute;inset:-1px;width:calc(100% + 2px);min-width:0;max-width:calc(100% + 2px);height:calc(100% + 2px);opacity:0;border:0;border-radius:8px;cursor:pointer;font:500 16px var(--okk-rv-font);-webkit-appearance:none;appearance:none}
.okk-rv__sort:focus-within{outline:2px solid var(--okk-rv-accent);outline-offset:2px}
@container (max-width:767px){.okk-rv__write{flex:1 1 auto;width:auto}}

/* Histogram (rating filter) */
.okk-rv__hist{display:grid;gap:6px;max-width:420px;margin:0 0 22px}
.okk-rv__hist[hidden]{display:none}
.okk-rv__hrow{display:grid;grid-template-columns:auto 1fr 3.5em;gap:10px;align-items:center;padding:4px 6px;border:0;border-radius:4px;background:none;color:inherit;font:400 13px var(--okk-rv-font);cursor:pointer;text-align:left}
.okk-rv__hrow:hover:not(:disabled),.okk-rv__hrow.is-active{background:#f2f2f2}
.okk-rv__hrow:disabled{cursor:default;opacity:.55}
.okk-rv__hstars{display:flex;gap:1px}
.okk-rv__hbar{height:8px;border-radius:4px;background:#ececec;overflow:hidden}
.okk-rv__hbar span{display:block;height:100%;background:var(--okk-rv-accent)}
.okk-rv__hcount{text-align:right;color:var(--okk-rv-soft)}
.okk-rv__clear{justify-self:start;border:0;background:none;padding:4px 6px;font:600 13px var(--okk-rv-font);text-decoration:underline;color:inherit;cursor:pointer}


/* No reviews yet (Judge.me's empty state): centered line, 16px, then a content-wide Write button */
.okk-rv__none{display:flex;flex-direction:column;align-items:center;gap:16px;padding:24px 0 36px;text-align:center}
.okk-rv .okk-rv__none-text{margin:0;font:400 16px/normal var(--okk-rv-font)}
.okk-rv__none .okk-rv__write,.v2-product-reviews .okk-rv .okk-rv__none .okk-rv__write{flex:none;width:auto;margin:0}

/* Photo strip: 100px thumbnails, 8px apart and 8px in from each side, arrows over the ends */
.okk-rv__strip{position:relative;margin:0 0 12px}
.okk-rv__strip-track{display:flex;gap:8px;overflow-x:auto;padding:0 8px;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none}
.okk-rv__strip-track::-webkit-scrollbar{display:none}
.okk-rv__strip .okk-rv__pic{flex:none;width:100px;height:100px}
.okk-rv__arrow{position:absolute;top:34px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;padding:8px;border:0;border-radius:8px;background:rgba(0,0,0,.4);color:#fff;cursor:pointer}
.okk-rv__arrow[hidden]{display:none}
.okk-rv__arrow svg{width:16px;height:16px}
.okk-rv__arrow--prev{left:8px}
.okk-rv__arrow--next{right:8px}

/* Reviews */
.okk-rv__list{display:grid;gap:24px;padding:24px 0 0}
.okk-rv__item{display:flex;flex-direction:column;gap:16px;padding:0 0 40px;border-bottom:1px solid var(--okk-rv-line)}
.okk-rv__stars{display:flex;gap:4px;margin:0}
.okk-rv__author{display:flex;align-items:center;gap:8px;margin:0}
.okk-rv__avatar{flex:none;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--okk-rv-avatar);font:700 16px/normal var(--okk-rv-font);color:var(--okk-rv-text)}
.okk-rv .okk-rv__name{margin:0;font:700 16px/normal var(--okk-rv-font);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.okk-rv .okk-rv__date{margin:4px 0 0;font:400 14px/normal var(--okk-rv-font);color:var(--okk-rv-soft)}
.okk-rv__badges{display:flex;flex-wrap:wrap;gap:6px;margin:0}
.okk-rv__badge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:999px;background:#f2f2f2;color:var(--okk-rv-soft);font:500 12px/1.5 var(--okk-rv-font)}
.okk-rv__badge--verified{background:var(--okk-rv-avatar);color:var(--okk-rv-text);font-weight:600}
.okk-rv .okk-rv__title{margin:0 0 -8px;font:700 20px/normal var(--okk-rv-font);text-transform:none;letter-spacing:0}
.v2-product-reviews .okk-rv .okk-rv__title{line-height:34px}
.okk-rv__body{overflow-wrap:anywhere;font:400 16px/normal var(--okk-rv-font)}
.okk-rv .okk-rv__body p{margin:0 0 16px;font:inherit}
.okk-rv .okk-rv__body p:last-child{margin:0}
.okk-rv__body.is-clamped{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:5;line-clamp:5;overflow:hidden}
.okk-rv__more{align-self:flex-start;margin:-8px 0 0;padding:0;border:0;background:none;color:var(--okk-rv-text);font:400 14px/normal var(--okk-rv-font);text-decoration:underline;cursor:pointer}
.okk-rv__pics{display:flex;flex-wrap:wrap;gap:8px;margin:0}
.okk-rv__pic{position:relative;width:160px;height:160px;padding:0;border:0;border-radius:8px;overflow:hidden;background:#f2f2f2;cursor:pointer}
.okk-rv__pic img,.okk-rv__pic video{width:100%;height:100%;object-fit:cover;display:block}
.okk-rv__play{position:absolute;inset:0;margin:auto;width:44px;height:44px;border-radius:50%;background:rgba(0,0,0,.55)}
.okk-rv__play::after{content:"";position:absolute;left:17px;top:13px;border-left:14px solid #fff;border-top:9px solid transparent;border-bottom:9px solid transparent}
.okk-rv__reply{margin:0;padding:12px 16px;border-left:3px solid var(--okk-rv-accent);background:#f7f7f7}
.okk-rv__reply-by{margin:0 0 4px;font:600 13px var(--okk-rv-font)}
.okk-rv__empty{margin:12px 0 24px;color:var(--okk-rv-soft)}

/* Pagination: 12px under the last review, round 28px buttons 8px apart, the current page filled */
.okk-rv__pages{display:flex;justify-content:center;align-items:center;gap:8px;padding:12px 0 0;flex-wrap:wrap}
.okk-rv__num,.okk-rv__nav{display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:29.5px;padding:5.25px 7px;border:1px solid transparent;border-radius:24px;color:inherit;font:400 12.25px/normal var(--okk-rv-font);text-decoration:none}
.okk-rv a.okk-rv__num,.okk-rv a.okk-rv__nav{color:var(--okk-rv-text)}
.okk-rv__num.is-current{background:var(--okk-rv-button);border-color:var(--okk-rv-button);color:var(--okk-rv-button-ink)}
.okk-rv__nav{min-width:31.5px;height:28px;border:0}
.okk-rv__nav svg{width:7px;height:12px}
.okk-rv__nav.is-disabled{opacity:.4;pointer-events:none}
.okk-rv__gap{padding:3.5px 5.25px;font:400 14px/normal var(--okk-rv-font)}
.okk-rv.is-loading .okk-rv__list{opacity:.45;transition:opacity .15s}

/* Dialogs */
.okk-rv__dialog,.okk-rv__lightbox{border:0;border-radius:10px;padding:28px 24px 24px;width:min(560px,calc(100vw - 24px));max-height:calc(100vh - 24px);overflow:auto;color:#211e1b;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.okk-rv__dialog::backdrop,.okk-rv__lightbox::backdrop{background:rgba(0,0,0,.55)}
.okk-rv__lightbox{width:min(980px,calc(100vw - 24px));padding:44px 16px 16px;background:#111;color:#fff}
.okk-rv__lightbox img,.okk-rv__lightbox video{display:block;max-width:100%;max-height:calc(100vh - 140px);margin:0 auto;border-radius:6px}
.okk-rv__lightbox p{margin:12px 4px 0;font-size:14px;color:#ddd}
.okk-rv__close{position:absolute;top:8px;right:10px;width:40px;height:40px;border:0;background:none;font:400 30px/1 sans-serif;color:inherit;cursor:pointer}
.okk-rv__dialog-title{margin:0 0 14px;font:700 22px/1.2 var(--okk-rv-font)}
.okk-rv__form{display:grid;gap:14px}
.okk-rv__rate{border:0;margin:0;padding:0}
.okk-rv__rate legend{font:600 14px var(--okk-rv-font);margin-bottom:6px}
.okk-rv__rate-stars{display:inline-flex;flex-direction:row-reverse;gap:4px}
.okk-rv__rate-stars input{position:absolute;opacity:0;pointer-events:none}
.okk-rv__rate-stars label{cursor:pointer;color:#cfcfcf}
.okk-rv__rate-stars label .okk-rv-star{color:inherit}
.okk-rv__rate-stars input:checked~label,.okk-rv__rate-stars label:hover,.okk-rv__rate-stars label:hover~label{color:var(--okk-rv-accent)}
.okk-rv__rate-stars input:focus-visible+label{outline:2px solid var(--okk-rv-accent);outline-offset:2px;border-radius:4px}
.okk-rv .okk-rv__field,.okk-rv .okk-rv__rate legend{display:grid;gap:6px;font:600 14px var(--okk-rv-font);text-transform:none;letter-spacing:0}
.okk-rv__field small{font-weight:400;color:#6b6259}
.okk-rv__field input:not([type=file]),.okk-rv__field textarea{width:100%;padding:12px;border:1px solid #c9c1b4;border-radius:6px;font:400 16px var(--okk-rv-font);color:inherit;background:#fff}
.okk-rv__field textarea{min-height:130px;resize:vertical}
.okk-rv__note{margin:0;font:400 13px/1.5 var(--okk-rv-font);color:#6b6259}
.okk-rv__error{margin:0;padding:10px 12px;border-radius:6px;background:#fbeee6;color:#7a2b0c;font:600 14px var(--okk-rv-font)}
.okk-rv__submit{display:inline-flex;justify-content:center;align-items:center;min-height:48px;padding:12px 22px;border:0;border-radius:6px;background:var(--okk-rv-button);color:#fff;font:600 16px var(--okk-rv-font);text-decoration:none;cursor:pointer}
.okk-rv__submit[disabled]{opacity:.6;cursor:progress}
.okk-rv__form-intro p{margin:0 0 16px}


@media (max-width:749px){
  .okk-rv__name{max-width:12em}
}