/* Idhar-Udhar Review Media 1.2.3 */

/* ---------- Review form media ---------- */
.woocommerce #reviews .iu-review-media {
    margin: 24px 0 8px !important;
    padding: 22px 0 0 !important;
    border-top: 1px solid rgba(17,17,17,.08) !important;
}
.woocommerce #reviews .iu-review-media__heading {
    margin:0 0 6px !important;
    font-size:18px !important;
    font-weight:700 !important;
    line-height:1.35 !important;
}
.woocommerce #reviews .iu-review-media__help {
    margin:0 0 16px !important;
    font-size:13px !important;
    color:#6d6d6d !important;
    line-height:1.55 !important;
}
.woocommerce #reviews .iu-review-upload {
    display:flex !important;
    align-items:center !important;
    gap:14px !important;
    flex-wrap:wrap !important;
    padding:14px 0 !important;
    border-bottom:1px solid rgba(17,17,17,.06) !important;
}
.woocommerce #reviews .iu-review-upload__copy {
    display:flex !important;
    flex-direction:column !important;
    gap:4px !important;
    flex:1 1 250px !important;
}
.woocommerce #reviews .iu-review-upload__copy strong { font-size:14px !important; font-weight:700 !important; }
.woocommerce #reviews .iu-review-upload__copy span { font-size:12px !important; color:#777 !important; }
.woocommerce #reviews .iu-review-upload__button {
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:42px !important;
    padding:0 17px !important;
    border:1px solid #111 !important;
    border-radius:999px !important;
    background:#111 !important;
    color:#fff !important;
    font-size:12px !important;
    font-weight:700 !important;
    cursor:pointer !important;
}
.woocommerce #reviews .iu-review-upload__input {
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    margin:-1px !important;
    overflow:hidden !important;
    clip:rect(0,0,0,0) !important;
}
.woocommerce #reviews .iu-review-media__preview {
    display:grid !important;
    grid-template-columns:repeat(5,minmax(0,1fr)) !important;
    gap:9px !important;
    flex:1 1 100% !important;
}
.woocommerce #reviews .iu-review-media__preview:empty { display:none !important; }
.woocommerce #reviews .iu-review-media__preview-item {
    overflow:hidden !important;
    border:1px solid rgba(17,17,17,.08) !important;
    border-radius:12px !important;
    background:#f7f6f3 !important;
}
.woocommerce #reviews .iu-review-media__preview-item img {
    display:block !important;
    width:100% !important;
    aspect-ratio:1/1 !important;
    object-fit:cover !important;
}
.woocommerce #reviews .iu-review-media__preview-item video {
    display:block !important;
    width:100% !important;
    aspect-ratio:16/9 !important;
    object-fit:cover !important;
}
.woocommerce #reviews .iu-review-media__preview-item--video { grid-column:span 2 !important; }
.woocommerce #reviews .iu-review-media__filename {
    display:block !important;
    padding:7px 8px !important;
    overflow:hidden !important;
    white-space:nowrap !important;
    text-overflow:ellipsis !important;
    font-size:11px !important;
    color:#666 !important;
}
.woocommerce #reviews .iu-review-media__message { min-height:20px !important; margin-top:9px !important; font-size:12px !important; }

/* ---------- Clean modern review layout ---------- */
.woocommerce #reviews #comments .commentlist {
    margin:18px 0 0 !important;
    padding:0 !important;
}
.woocommerce #reviews #comments .commentlist > li.review,
.woocommerce #reviews #comments .commentlist > li.comment {
    position:relative !important;
    margin:0 0 18px !important;
    padding:24px 30px 24px !important;
    border:1px solid rgba(17,17,17,.09) !important;
    border-radius:16px !important;
    background:#fff !important;
    box-shadow:0 4px 16px rgba(17,17,17,.035) !important;
    list-style:none !important;
}
.woocommerce #reviews #comments .commentlist > li.review::before,
.woocommerce #reviews #comments .commentlist > li.comment::before {
    display:none !important;
}

/* Keep the avatar inside the review card. Monki/theme positioning can otherwise
   pull it outside the card and over the reviewer name. */
.woocommerce #reviews #comments .commentlist > li.review .comment_container,
.woocommerce #reviews #comments .commentlist > li.comment .comment_container {
    position:static !important;
    display:grid !important;
    grid-template-columns:56px minmax(0,1fr) !important;
    align-items:start !important;
    column-gap:18px !important;
    margin:0 !important;
    padding:0 !important;
    min-width:0 !important;
}
.woocommerce #reviews #comments .commentlist > li.review img.avatar,
.woocommerce #reviews #comments .commentlist > li.comment img.avatar {
    position:static !important;
    left:auto !important;
    right:auto !important;
    top:auto !important;
    bottom:auto !important;
    transform:none !important;
    grid-column:1 !important;
    grid-row:1 !important;
    justify-self:start !important;
    align-self:start !important;
    float:none !important;
    flex:none !important;
    width:56px !important;
    height:56px !important;
    margin:0 !important;
    padding:0 !important;
    border:1px solid rgba(17,17,17,.08) !important;
    border-radius:50% !important;
    object-fit:cover !important;
    box-shadow:none !important;
}
.woocommerce #reviews #comments .commentlist > li.review .comment-text,
.woocommerce #reviews #comments .commentlist > li.comment .comment-text {
    position:relative !important;
    grid-column:2 !important;
    grid-row:1 !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
}
.woocommerce #reviews #comments .commentlist > li.review .meta,
.woocommerce #reviews #comments .commentlist > li.comment .meta {
    display:flex !important;
    align-items:baseline !important;
    gap:6px 10px !important;
    flex-wrap:wrap !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    font-size:12px !important;
    line-height:1.35 !important;
}
.woocommerce #reviews #comments .commentlist > li.review .woocommerce-review__author,
.woocommerce #reviews #comments .commentlist > li.comment .woocommerce-review__author {
    margin:0 !important;
    font-size:15px !important;
    line-height:1.3 !important;
    font-weight:700 !important;
    color:#111 !important;
    letter-spacing:-.01em !important;
    overflow-wrap:anywhere !important;
}
.woocommerce #reviews #comments .commentlist > li.review .woocommerce-review__published-date,
.woocommerce #reviews #comments .commentlist > li.comment .woocommerce-review__published-date {
    color:#8a8a8a !important;
    font-size:12px !important;
    white-space:nowrap !important;
}

/* The rating is the visual focus: pull it inward from the far-right corner and
   give it a little more presence without letting it overlap the reviewer info. */
.woocommerce #reviews #comments .commentlist > li.review .star-rating,
.woocommerce #reviews #comments .commentlist > li.comment .star-rating,
.woocommerce #reviews #comments .commentlist > li.review .comment-text > .star-rating,
.woocommerce #reviews #comments .commentlist > li.comment .comment-text > .star-rating {
    position:absolute !important;
    z-index:2 !important;
    top:0 !important;
    left:64% !important;
    right:auto !important;
    float:none !important;
    width:6.0em !important;
    margin:0 !important;
    padding:0 !important;
    font-size:20px !important;
    line-height:1 !important;
    letter-spacing:0 !important;
    transform:translateX(-50%) !important;
    white-space:nowrap !important;
}
.woocommerce #reviews #comments .commentlist > li.review .star-rating::before,
.woocommerce #reviews #comments .commentlist > li.comment .star-rating::before,
.woocommerce #reviews #comments .commentlist > li.review .star-rating span::before,
.woocommerce #reviews #comments .commentlist > li.comment .star-rating span::before {
    color:#f6b800 !important;
}
.woocommerce #reviews #comments .commentlist > li.review .description,
.woocommerce #reviews #comments .commentlist > li.comment .description {
    clear:none !important;
    margin:15px 0 0 !important;
    padding:0 !important;
}
.woocommerce #reviews #comments .commentlist > li.review .description p,
.woocommerce #reviews #comments .commentlist > li.comment .description p {
    margin:0 !important;
    max-width:none !important;
    color:#2b2b2b !important;
    font-size:15px !important;
    line-height:1.65 !important;
}

/* ---------- Compact customer media ---------- */
.woocommerce #reviews .iu-review-media-display {
    clear:both !important;
    margin:16px 0 0 !important;
    padding:14px 0 0 !important;
    border-top:1px solid rgba(17,17,17,.07) !important;
}
.woocommerce #reviews .iu-review-media-display__heading {
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:10px !important;
    margin:0 0 10px !important;
}
.woocommerce #reviews .iu-review-media-display__heading > span {
    font-size:10px !important;
    line-height:1.2 !important;
    font-weight:800 !important;
    letter-spacing:.12em !important;
    text-transform:uppercase !important;
    color:#252525 !important;
}
.woocommerce #reviews .iu-review-media-display__heading > em {
    margin:0 !important;
    font-size:11px !important;
    font-style:normal !important;
    color:#8a8a8a !important;
}
.woocommerce #reviews .iu-review-media-display__content {
    display:flex !important;
    align-items:flex-start !important;
    gap:22px !important;
}
.woocommerce #reviews .iu-review-media-display__photos,
.woocommerce #reviews .iu-review-media-display__videos {
    min-width:0 !important;
}
.woocommerce #reviews .iu-review-media-display__photos {
    flex:1 1 auto !important;
}
.woocommerce #reviews .iu-review-media-display__videos {
    flex:0 0 190px !important;
}
.woocommerce #reviews .iu-review-media-display__label {
    margin:0 0 7px !important;
    font-size:11px !important;
    line-height:1.2 !important;
    font-weight:700 !important;
    color:#3d3d3d !important;
}
.woocommerce #reviews .iu-review-media-display__images {
    display:flex !important;
    align-items:center !important;
    flex-wrap:wrap !important;
    gap:7px !important;
}
.woocommerce #reviews button.iu-review-media-display__photo {
    position:relative !important;
    display:block !important;
    flex:0 0 76px !important;
    width:76px !important;
    height:76px !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
    border:1px solid rgba(17,17,17,.09) !important;
    border-radius:10px !important;
    background:#f4f1ed !important;
    box-shadow:none !important;
    appearance:none !important;
    -webkit-appearance:none !important;
    cursor:zoom-in !important;
}
.woocommerce #reviews button.iu-review-media-display__photo img {
    display:block !important;
    width:100% !important;
    height:100% !important;
    max-width:none !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    object-fit:cover !important;
    transition:transform .18s ease,filter .18s ease !important;
}
.woocommerce #reviews button.iu-review-media-display__photo:hover img,
.woocommerce #reviews button.iu-review-media-display__photo:focus-visible img {
    transform:scale(1.04) !important;
    filter:brightness(.92) !important;
}
.woocommerce #reviews .iu-review-media-display__more {
    position:absolute !important;
    inset:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    background:rgba(17,17,17,.48) !important;
    color:#fff !important;
    font-size:14px !important;
    font-weight:700 !important;
    pointer-events:none !important;
}
.woocommerce #reviews .iu-review-media-display__microcopy {
    display:block !important;
    margin-top:5px !important;
    font-size:10px !important;
    color:#9a9a9a !important;
}
.woocommerce #reviews button.iu-review-media-display__video {
    position:relative !important;
    display:block !important;
    width:100% !important;
    height:108px !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
    border:1px solid rgba(17,17,17,.09) !important;
    border-radius:10px !important;
    background:#111 !important;
    box-shadow:none !important;
    appearance:none !important;
    -webkit-appearance:none !important;
    cursor:pointer !important;
}
.woocommerce #reviews .iu-review-media-display__video video {
    display:block !important;
    width:100% !important;
    height:100% !important;
    max-width:none !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    object-fit:cover !important;
    background:#111 !important;
    pointer-events:none !important;
}
.woocommerce #reviews .iu-review-media-display__video-overlay {
    position:absolute !important;
    inset:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:8px !important;
    background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.38)) !important;
    color:#fff !important;
    font-size:11px !important;
    font-weight:700 !important;
    letter-spacing:.01em !important;
}
.woocommerce #reviews .iu-review-media-display__play {
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:32px !important;
    height:32px !important;
    border-radius:50% !important;
    background:rgba(255,255,255,.94) !important;
    color:#111 !important;
    font-size:11px !important;
    padding-left:2px !important;
    box-shadow:0 3px 12px rgba(0,0,0,.18) !important;
}

/* ---------- Fullscreen media viewer ---------- */
.iu-review-media-viewer {
    position:fixed !important;
    inset:0 !important;
    z-index:999999 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:20px !important;
    background:rgba(10,10,10,.94) !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transition:opacity .18s ease,visibility .18s ease !important;
}
.iu-review-media-viewer.is-open {
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
}
.iu-review-media-viewer__backdrop {
    position:absolute !important;
    inset:0 !important;
}
.iu-review-media-viewer__content {
    position:relative !important;
    z-index:2 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:min(920px,92vw) !important;
    max-height:88vh !important;
}
.iu-review-media-viewer__image,
.iu-review-media-viewer__video {
    display:none !important;
    width:auto !important;
    height:auto !important;
    max-width:90vw !important;
    max-height:84vh !important;
    margin:0 !important;
    border-radius:12px !important;
    object-fit:contain !important;
    box-shadow:0 24px 70px rgba(0,0,0,.42) !important;
    background:#111 !important;
}
.iu-review-media-viewer__image.is-visible,
.iu-review-media-viewer__video.is-visible {
    display:block !important;
}
.iu-review-media-viewer__close,
.iu-review-media-viewer__nav {
    position:absolute !important;
    z-index:3 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:42px !important;
    height:42px !important;
    margin:0 !important;
    padding:0 !important;
    border:1px solid rgba(255,255,255,.15) !important;
    border-radius:50% !important;
    background:rgba(255,255,255,.12) !important;
    color:#fff !important;
    cursor:pointer !important;
}
.iu-review-media-viewer__close {
    top:16px !important;
    right:16px !important;
    font-size:24px !important;
}
.iu-review-media-viewer__nav {
    top:50% !important;
    margin-top:-21px !important;
    font-size:26px !important;
}
.iu-review-media-viewer__nav--prev { left:14px !important; }
.iu-review-media-viewer__nav--next { right:14px !important; }
.iu-review-media-viewer__counter {
    position:absolute !important;
    left:50% !important;
    bottom:14px !important;
    z-index:3 !important;
    padding:5px 9px !important;
    border-radius:999px !important;
    background:rgba(255,255,255,.12) !important;
    color:#fff !important;
    font-size:11px !important;
    transform:translateX(-50%) !important;
}
body.iu-review-media-viewer-open { overflow:hidden !important; }

@media (max-width: 860px) {
    .woocommerce #reviews .iu-review-media-display__content { gap:16px !important; }
    .woocommerce #reviews .iu-review-media-display__videos { flex-basis:170px !important; }
    .woocommerce #reviews button.iu-review-media-display__video { height:96px !important; }
}

@media (max-width: 767px) {
    .woocommerce #reviews #comments .commentlist > li.review,
    .woocommerce #reviews #comments .commentlist > li.comment {
        padding:18px 16px 20px !important;
    }
    .woocommerce #reviews #comments .commentlist > li.review .comment_container,
    .woocommerce #reviews #comments .commentlist > li.comment .comment_container {
        grid-template-columns:46px minmax(0,1fr) !important;
        column-gap:12px !important;
    }
    .woocommerce #reviews #comments .commentlist > li.review img.avatar,
    .woocommerce #reviews #comments .commentlist > li.comment img.avatar {
        width:46px !important;
        height:46px !important;
    }
    .woocommerce #reviews #comments .commentlist > li.review .star-rating,
    .woocommerce #reviews #comments .commentlist > li.comment .star-rating,
    .woocommerce #reviews #comments .commentlist > li.review .comment-text > .star-rating,
    .woocommerce #reviews #comments .commentlist > li.comment .comment-text > .star-rating {
        position:static !important;
        display:block !important;
        width:6em !important;
        margin:8px 0 0 !important;
        transform:none !important;
        font-size:18px !important;
    }
}

@media (max-width: 767px) {
    .woocommerce #reviews #comments .commentlist > li.review,
    .woocommerce #reviews #comments .commentlist > li.comment {
        padding:16px !important;
        border-radius:14px !important;
    }
    .woocommerce #reviews #comments .commentlist > li.review .comment_container,
    .woocommerce #reviews #comments .commentlist > li.comment .comment_container {
        gap:11px !important;
    }
    .woocommerce #reviews #comments .commentlist > li.review img.avatar,
    .woocommerce #reviews #comments .commentlist > li.comment img.avatar {
        flex-basis:40px !important;
        width:40px !important;
        height:40px !important;
    }
    .woocommerce #reviews .iu-review-media-display__content {
        display:block !important;
    }
    .woocommerce #reviews .iu-review-media-display__videos {
        width:190px !important;
        margin-top:13px !important;
    }
    .woocommerce #reviews button.iu-review-media-display__photo {
        flex-basis:70px !important;
        width:70px !important;
        height:70px !important;
    }
    .iu-review-media-viewer { padding:10px !important; }
    .iu-review-media-viewer__close { top:9px !important; right:9px !important; }
    .iu-review-media-viewer__nav--prev { left:5px !important; }
    .iu-review-media-viewer__nav--next { right:5px !important; }
}