/**
 * Demo 25 — Headline: Compact Chips Row (نوار تراشه‌های فشرده)
 * A horizontal scrollable row of pill-shaped "update chips" — like a tag cloud
 * for recent activity. Each chip = a status dot + single-line title + a tiny
 * price tag on the far edge. Designed for slider mode (one chip per slide) for
 * a true horizontally-scrolling chip rail, but stacks in grid mode too.
 * Violet accent on white — modern, playful.
 */
/* Chips are the most compact headline variant (9px padding), so shrink the
   icon buttons + their SVGs via the shared custom properties. This keeps the
   quick-view / wishlist / compare circles from towering over the chip. */
.jespw-demo-25-compact-chips {
        --jespw-icon-btn: 22px;
        --jespw-icon-svg: 13px;
}
.jespw-demo-25-compact-chips .jespw-card {
        position: relative;
        background: #ffffff;
        border: 1.5px solid #ede9fe;
        border-radius: 999px;
        padding: 9px 16px 9px 14px;
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 11px;
        transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease, background .3s ease;
}
.jespw-demo-25-compact-chips .jespw-card:hover {
        transform: translateY(-3px);
        border-color: #8b5cf6;
        background: #faf5ff;
        box-shadow: 0 10px 22px -12px rgba(139, 92, 246, 0.5);
}
/* Chip = text only. */
.jespw-demo-25-compact-chips .jespw-image,
.jespw-demo-25-compact-chips .jespw-image-wrap {
        display: none !important;
}
.jespw-demo-25-compact-chips .jespw-text-accent,
.jespw-demo-25-compact-chips .jespw-index {
        display: none;
}
/* Category = a tiny colored dot (no text) — uses the dot from the pill bg.
   If the category text is present, show it as a leading mini-label. */
.jespw-demo-25-compact-chips .jespw-category {
        order: 1;
        font-size: 10px;
        font-weight: 700;
        color: #6d28d9;
        background: #ede9fe;
        padding: 3px 9px;
        border-radius: 999px;
        white-space: nowrap;
        flex-shrink: 0;
        display: inline-flex;
        align-items: center;
        gap: 5px;
}
.jespw-demo-25-compact-chips .jespw-category::before {
        content: "";
        width: 5px;
        height: 5px;
        border-radius: 50%;
        background: #8b5cf6;
        flex-shrink: 0;
}
/* Content row = horizontal flex. */
.jespw-demo-25-compact-chips .jespw-content {
        order: 2;
        flex: 1;
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 10px;
        min-width: 0;
        flex-wrap: nowrap;
}
/* Title — single-line, grows to fill, capped width. */
.jespw-demo-25-compact-chips .jespw-title {
        order: 1;
        flex: 1;
        font-size: 13px;
        font-weight: 700;
        line-height: 1.3;
        color: #1e1b4b;
        margin: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        min-width: 0;
        max-width: 38ch;
}
.jespw-demo-25-compact-chips .jespw-title a {
        color: inherit;
        text-decoration: none;
        transition: color .25s ease;
}
.jespw-demo-25-compact-chips .jespw-card:hover .jespw-title a {
        color: #7c3aed;
}
/* Excerpt hidden — chips are single-line. */
.jespw-demo-25-compact-chips .jespw-excerpt {
        display: none;
}
/* Rating hidden. */
.jespw-demo-25-compact-chips .jespw-rating {
        order: 2;
        display: none;
}
/* Modified-date = tiny "time ago" inline (no chip bg — keep it airy). */
.jespw-demo-25-compact-chips .jespw-modified-date {
        order: 3;
        display: inline-flex;
        align-items: center;
        gap: 4px;
        font-size: 11px;
        font-weight: 600;
        color: #8b5cf6;
        white-space: nowrap;
        flex-shrink: 0;
}
.jespw-demo-25-compact-chips .jespw-modified-icon {
        font-size: 0.8em;
        opacity: 0.7;
}
/* Price — tiny tag on the far edge. */
.jespw-demo-25-compact-chips .jespw-price {
        order: 4;
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 5px;
        white-space: nowrap;
        flex-shrink: 0;
}
.jespw-demo-25-compact-chips .jespw-regular-price {
        font-size: 13px;
        font-weight: 800;
        color: #1e1b4b;
}
.jespw-demo-25-compact-chips .jespw-regular-price del {
        color: #a78bfa;
        font-size: 10px;
        font-weight: 400;
        text-decoration: line-through;
}
.jespw-demo-25-compact-chips .jespw-sale-price ins {
        font-size: 13px;
        font-weight: 800;
        color: #7c3aed;
        text-decoration: none;
}
.jespw-demo-25-compact-chips .jespw-discount-percent {
        font-size: 9px;
        font-weight: 700;
        color: #fff;
        background: #8b5cf6;
        padding: 1px 6px;
        border-radius: 999px;
}
/* Button = minimal icon-only (cart). */
.jespw-demo-25-compact-chips .jespw-button {
        padding: 5px 11px;
        font-size: 11px;
        font-weight: 700;
        color: #fff;
        background: #8b5cf6;
        border: none;
        border-radius: 999px;
        transition: all .25s ease;
        white-space: nowrap;
        flex-shrink: 0;
}
.jespw-demo-25-compact-chips .jespw-button:hover {
        background: #7c3aed;
        transform: scale(1.05);
}
/* Badges as micro dots. */
.jespw-demo-25-compact-chips .jespw-badge {
        font-size: 9px;
        font-weight: 700;
        padding: 1px 7px;
        border-radius: 999px;
}
.jespw-demo-25-compact-chips .jespw-badge-new {
        background: #8b5cf6;
        color: #fff;
}
.jespw-demo-25-compact-chips .jespw-badge-sale {
        background: #f43f5e;
        color: #fff;
}
.jespw-demo-25-compact-chips .jespw-badges {
        position: static;
        order: 0;
        display: inline-flex;
        gap: 4px;
        flex-shrink: 0;
}
/* Grid: in grid mode, chips wrap into a multi-column flex-like layout.
   We use auto-fill so chips keep their natural pill width and wrap. */
.jespw-demo-25-compact-chips:not(.jespw-layout-slider) .jespw-grid {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        grid-template-columns: none;
}
.jespw-demo-25-compact-chips:not(.jespw-layout-slider) .jespw-item {
        flex: 0 1 auto;
        width: auto;
        min-width: 240px;
        max-width: 460px;
}
/* Slider: each slide is one chip. */
.jespw-demo-25-compact-chips.jespw-layout-slider .jespw-card {
        height: 100%;
        min-height: 48px;
}
.jespw-demo-25-compact-chips.jespw-layout-slider .swiper-slide {
        width: auto !important;
        max-width: 460px;
}
/* Responsive: chips go full-width on mobile. */
@media (max-width: 640px) {
        .jespw-demo-25-compact-chips:not(.jespw-layout-slider) .jespw-item {
                min-width: 100%;
        }
        .jespw-demo-25-compact-chips .jespw-card:hover {
                transform: none;
        }
}
