/* Ihteshamdev eCommerce — Video Shopping Reels */
.idsr-reels {
    --idsr-navy: #001431;
    --idsr-orange: #ff640f;
    --idsr-muted: #4f5b6d;
    --idsr-card-radius: 16px;
    --idsr-gap: 24px;
    --idsr-per-view: 4;
    --idsr-grid-cols: 4;
    width: 100%;
    background: #eef3ff;
    padding: 56px 0;
    color: #121c2a;
    box-sizing: border-box;
    overflow: hidden;
}
.idsr-reels *, .idsr-reels *::before, .idsr-reels *::after { box-sizing: border-box; }
.idsr-reels button, .idsr-reels a { -webkit-tap-highlight-color: transparent; }
.idsr-reels__container { width: min(100%, 1280px); margin: 0 auto; padding: 0 20px; }
.idsr-reels__header { display:flex; align-items:center; justify-content:space-between; gap:28px; margin-bottom:34px; }
.idsr-reels__heading { min-width:0; }
.idsr-reels__eyebrow { display:inline-flex; align-items:center; gap:6px; min-height:24px; margin-bottom:10px; padding:5px 12px; border-radius:999px; background:#ff640f; color:#fff; font-size:10px; line-height:1; font-weight:800; letter-spacing:.025em; text-transform:uppercase; }
.idsr-reels__eyebrow svg { width:14px; height:14px; flex:0 0 14px; }
.idsr-reels__title { margin:0; color:#001431; font-size:clamp(30px,3vw,38px); line-height:1.12; font-weight:800; letter-spacing:-.035em; }
.idsr-reels__description { margin:6px 0 0; color:#4f5b6d; font-size:15px; line-height:1.55; }
.idsr-reels__arrows { display:flex; align-items:center; gap:12px; flex:0 0 auto; }
.idsr-reels__arrows--mobile { display:none; }
.idsr-reels__arrows--desktop { align-self:center; }
.idsr-reels__arrow { appearance:none; display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; padding:0; border:0; border-radius:50%; background:#fff; color:#001431; box-shadow:0 3px 10px rgba(0,20,49,.06); cursor:pointer; transition:background-color .2s ease,color .2s ease,transform .2s ease,opacity .2s ease; }
.idsr-reels__arrow:hover { transform:translateY(-1px); background:#001431; color:#fff; }
.idsr-reels__arrow:disabled { opacity:.35; cursor:default; transform:none; }
.idsr-reels__arrow svg { width:20px; height:20px; }
.idsr-reels.is-static .idsr-reels__arrows, .idsr-reels.is-static .idsr-reels__dots { display:none !important; }
.idsr-reels__viewport { width:100%; overflow:hidden; }
.idsr-reels__track { display:flex; gap:var(--idsr-gap); overflow-x:auto; overscroll-behavior-inline:contain; scroll-snap-type:x mandatory; scroll-behavior:smooth; scrollbar-width:none; padding:2px 1px 8px; outline:none; }
.idsr-reels__track::-webkit-scrollbar { display:none; }

/* Grid layout mode */
.idsr-reels.is-grid .idsr-reels__viewport { overflow: visible; }
.idsr-reels.is-grid .idsr-reels__track {
    display: grid;
    grid-template-columns: repeat(var(--idsr-grid-cols), minmax(0, 1fr));
    gap: var(--idsr-gap);
    overflow: visible;
    overscroll-behavior: auto;
    scroll-snap-type: none;
    scroll-behavior: auto;
    padding: 2px 1px 8px;
}
.idsr-reels.is-grid .idsr-reel-card {
    width: 100%;
    flex: none;
    scroll-snap-align: none;
}
.idsr-reels.is-grid .idsr-reels__arrows,
.idsr-reels.is-grid .idsr-reels__dots {
    display: none !important;
}
.idsr-reel-card { position:relative; flex:0 0 calc((100% - (var(--idsr-gap) * (var(--idsr-per-view) - 1))) / var(--idsr-per-view)); min-width:0; aspect-ratio:9/16; overflow:hidden; border-radius:16px; background:#001431; box-shadow:0 5px 12px rgba(0,20,49,.14); scroll-snap-align:start; isolation:isolate; }
.idsr-reel-card__media, .idsr-reel-card__video, .idsr-reel-card__poster, .idsr-reel-card__placeholder, .idsr-reel-card__shade { position:absolute; inset:0; width:100%; height:100%; }
.idsr-reel-card__video, .idsr-reel-card__poster { display:block; object-fit:cover; transform:scale(1); transition:transform .5s ease; }
.idsr-reel-card:hover .idsr-reel-card__video, .idsr-reel-card:hover .idsr-reel-card__poster { transform:scale(1.035); }
.idsr-reel-card__placeholder { display:flex; align-items:center; justify-content:center; background:linear-gradient(145deg,#dbe5f7,#bfcde5); color:#001431; }
.idsr-reel-card__placeholder svg { width:54px; height:54px; opacity:.42; }
.idsr-reel-card__shade { --idsr-overlay-color: rgba(0,20,49,.96); z-index:1; background:linear-gradient(to top,var(--idsr-overlay-color) 0%,rgba(0,20,49,.54) 24%,rgba(0,20,49,.12) 58%,rgba(0,20,49,.04) 100%); pointer-events:none; }
.idsr-reel-card__top { position:absolute; z-index:3; top:16px; left:16px; right:16px; display:flex; align-items:center; justify-content:space-between; gap:10px; }
.idsr-reel-card__duration { display:inline-flex; align-items:center; gap:5px; min-height:25px; padding:5px 10px; border-radius:999px; background:rgba(255,255,255,.88); backdrop-filter:blur(7px); color:#223249; font-size:11px; line-height:1; font-weight:800; box-shadow:0 2px 8px rgba(0,0,0,.04); }
.idsr-reel-card__duration i { display:block; width:8px; height:8px; border-radius:50%; background:#e0a07a; }
.idsr-reel-card__sound { appearance:none; display:inline-flex; align-items:center; justify-content:center; width:29px; height:29px; padding:0; border:0; background:transparent; color:#fff; cursor:pointer; filter:drop-shadow(0 2px 4px rgba(0,0,0,.25)); }
.idsr-reel-card__sound svg { width:24px; height:24px; }
.idsr-reel-card__sound .idsr-icon-sound-on { display:inline-flex; }
.idsr-reel-card__sound .idsr-icon-sound-off { display:none; }
.idsr-reel-card__sound.is-muted .idsr-icon-sound-on { display:none; }
.idsr-reel-card__sound.is-muted .idsr-icon-sound-off { display:inline-flex; }
.idsr-reel-card__play { appearance:none; position:absolute; z-index:4; left:50%; top:45%; transform:translate(-50%,-50%); display:inline-flex; align-items:center; justify-content:center; width:56px; height:56px; padding:0; border:0; border-radius:50%; background:#ff640f; color:#fff; box-shadow:0 8px 24px rgba(0,0,0,.18); cursor:pointer; transition:transform .2s ease,opacity .2s ease,background-color .2s ease; }
.idsr-reel-card__play:hover { transform:translate(-50%,-50%) scale(1.08); }
.idsr-reel-card__play svg { width:34px; height:34px; }
.idsr-reel-card__play .idsr-pause-icon { display:none; }
.idsr-reel-card.is-playing .idsr-reel-card__play { opacity:0; pointer-events:none; }
.idsr-reel-card.is-playing:hover .idsr-reel-card__play { opacity:.9; pointer-events:auto; }
.idsr-reel-card.is-playing .idsr-reel-card__play .idsr-play-icon { display:none; }
.idsr-reel-card.is-playing .idsr-reel-card__play .idsr-pause-icon { display:inline-flex; }
.idsr-reel-card__bottom { position:absolute; z-index:3; left:16px; right:16px; bottom:16px; display:flex; flex-direction:column; gap:8px; }
.idsr-reel-card__title { margin:0; color:#fff; font-size:17px; line-height:1.28; font-weight:800; letter-spacing:-.02em; text-shadow:0 2px 4px rgba(0,0,0,.18); }
.idsr-reel-card__buybox { display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:50px; padding:9px 10px; border-radius:13px; background:rgba(255,255,255,.96); backdrop-filter:blur(8px); box-shadow:0 4px 14px rgba(0,0,0,.08); }
.idsr-reel-card__product-meta { display:flex; flex-direction:column; min-width:0; }
.idsr-reel-card__product { overflow:hidden; color:#4f5b6d; white-space:nowrap; text-overflow:ellipsis; font-size:10px; line-height:1.25; font-weight:700; }
.idsr-reel-card__price { margin-top:2px; color:#001431; font-size:13px; line-height:1.2; font-weight:800; white-space:nowrap; }
.idsr-reel-card__price ins { color:inherit; text-decoration:none; }
.idsr-reel-card__price del { color:#8590a1; margin-right:4px; font-size:.78em; font-weight:600; }
.idsr-reel-card__buy { display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto; min-height:29px; padding:7px 13px; border-radius:9px; background:#ff640f; color:#fff !important; font-size:10px; line-height:1; font-weight:800; text-decoration:none !important; box-shadow:none; transition:background-color .2s ease,transform .2s ease; }
.idsr-reel-card__buy:hover { background:#e4560b; color:#fff !important; transform:translateY(-1px); }
.idsr-reels__dots { display:flex; align-items:center; justify-content:center; gap:7px; margin-top:16px; }
.idsr-reels__dot { appearance:none; width:8px; height:8px; padding:0; border:0; border-radius:999px; background:#c8d2e4; cursor:pointer; transition:width .2s ease,background-color .2s ease; }
.idsr-reels__dot.is-active { width:22px; background:#ff640f; }

@media (max-width: 1024px) {
    .idsr-reels { --idsr-per-view: 2; --idsr-grid-cols: 2; --idsr-gap: 18px; }
    .idsr-reels__header { align-items:center; }
}
@media (max-width: 767px) {
    .idsr-reels { --idsr-per-view: 1.15; --idsr-grid-cols: 1; --idsr-gap: 14px; padding:42px 0; }
    .idsr-reels__container { padding:0 14px; }
    .idsr-reels__header { display:block; margin-bottom:22px; }
    .idsr-reels__title { font-size:29px; }
    .idsr-reels__description { max-width:520px; font-size:13px; }
    .idsr-reels__arrows--desktop { display:none !important; }
    .idsr-reels__arrows--mobile { display:flex; justify-content:var(--idsr-mobile-nav-justify, flex-start); gap:10px; width:100%; margin-top:14px; padding-top:0; }
    .idsr-reels__arrow { width:38px; height:38px; box-shadow:0 5px 16px rgba(0,20,49,.08); }
    .idsr-reels__dots { margin-top:10px; }
    .idsr-reel-card__top { top:12px; left:12px; right:12px; }
    .idsr-reel-card__bottom { left:12px; right:12px; bottom:12px; }
    .idsr-reel-card__title { font-size:15px; }
    .idsr-reel-card__buybox { min-height:48px; padding:8px 9px; }
}
@media (max-width: 430px) {
    .idsr-reels__eyebrow { font-size:9px; }
    .idsr-reels__title { font-size:26px; }
    .idsr-reels__description { max-width:300px; }
    .idsr-reels__arrows--mobile { margin-top:12px; }
    .idsr-reels__arrow { width:36px; height:36px; }
}
@media (prefers-reduced-motion: reduce) {
    .idsr-reels__track { scroll-behavior:auto; }
    .idsr-reel-card__video, .idsr-reel-card__poster, .idsr-reel-card__play, .idsr-reels__arrow, .idsr-reel-card__buy { transition:none !important; }
}