/* Shared MyStudio model picker styles — used by lookbook, redress, swap, adshot, lab. */

.model-strip-wrap {
    display: flex; gap: 10px; overflow-x: auto; overflow-y: hidden;
    scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch;
    padding: 4px 2px 10px; scrollbar-width: thin;
}
.model-strip-wrap::-webkit-scrollbar { height: 6px; }
.model-strip-wrap::-webkit-scrollbar-thumb { background: #E5E5E5; border-radius: 3px; }

.model-strip-item {
    flex: 0 0 auto; width: 170px; position: relative;
    border: 2px solid #E5E5E5; border-radius: 12px; overflow: hidden;
    background: #fff; cursor: pointer; transition: all .2s ease;
    scroll-snap-align: start;
}
.model-strip-item:hover {
    border-color: #0A0A0A; transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(10,10,10,.18);
}
.model-strip-item .msi-img {
    width: 100%; aspect-ratio: 3/4; background: #FFFFFF;
    display: flex; align-items: center; justify-content: center; overflow: hidden;
}
.model-strip-item .msi-img img { width: 100%; height: 100%; object-fit: cover; }
.model-strip-item .msi-name {
    font-size: 11px; font-weight: 600; color: #0A0A0A;
    padding: 6px 8px; text-align: center; white-space: nowrap;
    overflow: hidden; text-overflow: ellipsis;
}
.model-strip-item .msi-usage {
    position: absolute; top: 6px; right: 6px;
    background: rgba(10,10,10,0.82); color: #fff; font-size: 10px; font-weight: 700;
    padding: 2px 7px; border-radius: 10px; backdrop-filter: blur(4px);
}
.model-strip-item.selected {
    border-color: #5B8C5A;
    box-shadow: 0 0 0 3px rgba(91,140,90,0.18);
}
.model-strip-item .msi-check {
    position: absolute; inset: 0; display: none;
    align-items: flex-start; justify-content: flex-start;
    pointer-events: none;
}
.model-strip-item.selected .msi-check { display: flex; }
.model-strip-item .msi-check-badge {
    margin: 6px; width: 26px; height: 26px; border-radius: 50%;
    background: #5B8C5A; color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 15px; font-weight: 800;
    box-shadow: 0 2px 6px rgba(0,0,0,0.2);
}

/* Note: .model-strip-empty styling stays per-page — swap/lookbook have richer
   dashed-card empty states; redress uses .strip-empty (different class). */