.lipstick-picker { max-width: 920px; margin: 10px auto; font-family: 'IRANSansX', 'iransansx', sans-serif; direction: rtl; position:relative; padding:60px 10px; box-sizing:border-box; }
.lp-center-bg { position:absolute; left:50%; transform:translateX(-50%); top:38%; pointer-events:none; z-index:1; }
.lp-center-bg img { display:block; width:220px; max-width:34vw; height:auto; }
.lp-row { display:flex; align-items:center; gap:8px; padding:8px 0; border-radius:6px; background:transparent; position:relative; z-index:2; }
.lp-items { display:flex; gap:12px; width:100%; justify-content:center; align-items:center; }
.lp-items .lp-item { flex: 0 0 120px; box-sizing:border-box; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:6px; cursor:pointer; background:transparent; border:none; }
.lp-item img.lp-head-img, .lp-item img.lp-brand-img { width:100px; height:100px; object-fit:contain; display:block; }
.lp-color-dot { display:inline-block; width:100px; height:100px; border-radius:6px; background:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; margin-bottom:6px; }
.lp-label { font-size:13px; text-align:center; display:block; margin-top:6px; }
.lp-brand-text {
    padding: 4px;
    font-size: 15px;
    font-weight: 700;
    color: white;
    background-color: black !important;
    border-radius: 8px;
}
.lp-item.visible { display:flex; }
.lp-item { display:none; } /* hide all then JS will show 3 visible */
/* remove any lift/shadow on active */
.lp-item.active { box-shadow:none; transform:none; }
/* arrows minimal */
.lp-arrow { background:transparent; color:#000; border:none; width:40px; height:40px; cursor:pointer; font-size:20px; }
.lp-footer { margin-top:12px; display:flex; align-items:center; justify-content:flex-end; gap:12px; position:relative; z-index:2; }
.lp-actions .lp-submit { background:#000; color:#fff; border:none; padding:10px 18px; border-radius:6px; cursor:pointer; }
@media (max-width:768px) {
    .lp-center-bg img { width:160px; }
    .lp-item img.lp-head-img, .lp-item img.lp-brand-img, .lp-color-dot { width:80px; height:80px; }
    .lp-items .lp-item { flex: 0 0 90px; }
}


/* ===== MODS 2 ===== */

/* Adjust neighbors: show left/right items and visually de-emphasize them */
.lp-item.left, .lp-item.right { display:flex !important; opacity:0.75; transform: scale(0.95); transition: transform .18s ease, opacity .18s ease; }
.lp-item.active { transform: scale(1.02); opacity:1; }


/* FORCE NO-WRAP MOD */

/* Force no-wrap and keep neighbors visible even at edges */
.lp-items { flex-wrap: nowrap !important; overflow: visible !important; -webkit-overflow-scrolling: touch; justify-content:center; }
/* Ensure lp-item doesn't shrink and maintains width */
.lp-items .lp-item { flex: 0 0 auto !important; min-width: 80px; max-width: 140px; }
/* Visible items z-index and positioning */
.lp-items .lp-item.visible { display:flex !important; z-index: 3 !important; }
.lp-items .lp-item.left, .lp-items .lp-item.right { z-index:2 !important; }
.lp-items { gap: 12px !important; }