/* ============================================================================
   ABZARBIN TOOLS - MODERN SHOP/PRODUCTS PAGE STYLES
   Version: 1.0.0
   ----------------------------------------------------------------------------
   CONTENTS:
   1. Shop Hero Banner
   2. Shop Layout (sidebar + content)
   3. Filter Sidebar (collapsible, modern)
   4. Filter Components (checkboxes, price, ratings)
   5. Shop Toolbar (sort, view switcher)
   6. Product Card (modern, grid/list)
   7. Pagination
   8. No Results / Empty State
   9. Responsive Breakpoints
   ============================================================================ */

/* ============================================================================
   1. SHOP HERO BANNER
============================================================================ */

/* CTA Button */

/* ============================================================================
   2. SHOP LAYOUT
============================================================================ */
.shop-container-modern {
    padding: 40px 0 80px;
    background: #F8F9FB;
}

.shop-layout {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 28px;
    align-items: start;
}

/* ============================================================================
   3. FILTER SIDEBAR
============================================================================ */
.shop-sidebar-modern {
    position: sticky;
    top: 20px;
    background: #fff;
    border: 1px solid #E5E7EB;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(10, 14, 26, 0.04);
    max-height: calc(100vh - 40px);
    display: flex;
    flex-direction: column;
}

.shop-sidebar-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 22px;
    background: linear-gradient(135deg, #EA580C, #9A3412);
    color: #fff;
}

.shop-sidebar-header h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 10px;
}

.shop-sidebar-close {
    display: none;
    background: transparent;
    border: none;
    color: #fff;
    font-size: 18px;
    cursor: pointer;
    padding: 4px;
}

.shop-sidebar-body {
    flex: 1;
    overflow-y: auto;
    padding: 18px;
    /* Custom scrollbar */
    scrollbar-width: thin;
    scrollbar-color: #C8102E #F8F9FB;
}

.shop-sidebar-body::-webkit-scrollbar {
    width: 6px;
}

.shop-sidebar-body::-webkit-scrollbar-track {
    background: #F8F9FB;
    border-radius: 3px;
}

.shop-sidebar-body::-webkit-scrollbar-thumb {
    background: #C8102E;
    border-radius: 3px;
}

.shop-sidebar-footer {
    padding: 14px 18px;
    background: #F8F9FB;
    border-top: 1px solid #E5E7EB;
}

.shop-sidebar-apply {
    width: 100%;
    padding: 12px;
    background: linear-gradient(135deg, #EA580C, #C8102E);
    color: #fff;
    border: none;
    border-radius: 999px;
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.3s;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.shop-sidebar-apply:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(234, 88, 12, 0.35);
}

/* ============================================================================
   4. FILTER COMPONENTS
============================================================================ */

/* Active Filters Chips */
.filter-section {
    border-bottom: 1px solid #F3F4F6;
    padding: 14px 0;
}

.filter-section:first-child {
    padding-top: 0;
}

.filter-section:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.filter-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.filter-section-head h4 {
    margin: 0;
    font-size: 13px;
    font-weight: 700;
    color: #1F2937;
}

.filter-clear-all {
    color: #EA580C;
    font-size: 11px;
    font-weight: 600;
    text-decoration: none;
    transition: color 0.3s;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.filter-clear-all:hover {
    color: #FF6B1A;
}

.active-filters-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.active-filter-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 10px;
    background: rgba(234, 88, 12, 0.08);
    color: #EA580C;
    font-size: 11px;
    font-weight: 600;
    border-radius: 999px;
    border: 1px solid rgba(234, 88, 12, 0.15);
}

.active-filter-chip strong {
    font-weight: 700;
}

/* Collapsible Filter Section */
.filter-section-toggle {
    width: 100%;
    background: transparent;
    border: none;
    padding: 6px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    color: #1F2937;
    cursor: pointer;
    transition: color 0.3s;
}

.filter-section-toggle:hover {
    color: #EA580C;
}

.filter-section-toggle > span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.filter-section-toggle > span > i {
    color: #EA580C;
    font-size: 13px;
}

.filter-section-toggle > i {
    font-size: 10px;
    color: #9CA3AF;
    transition: transform 0.3s;
}

.filter-section.open .filter-section-toggle > i {
    transform: rotate(180deg);
}

.filter-section-body {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1), padding 0.3s;
    padding: 0;
}

.filter-section.open .filter-section-body {
    max-height: 800px;
    padding: 12px 0 6px;
}

/* Category item */
.filter-cat-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
    color: #4B5563;
    font-size: 13px;
    text-decoration: none;
    border-radius: 8px;
    transition: all 0.3s;
    margin-bottom: 2px;
}

.filter-cat-item:hover {
    background: #F8F9FB;
    color: #EA580C;
    padding-inline-start: 16px;
}

.filter-cat-item.active {
    background: rgba(234, 88, 12, 0.08);
    color: #EA580C;
    font-weight: 600;
}

.filter-cat-count {
    font-size: 11px;
    color: #9CA3AF;
    background: #F3F4F6;
    padding: 2px 8px;
    border-radius: 999px;
}

.filter-cat-item.active .filter-cat-count {
    background: #EA580C;
    color: #fff;
}

.filter-cat-show-all {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 10px;
    font-size: 12px;
    color: #EA580C;
    text-decoration: none;
    font-weight: 600;
    transition: gap 0.3s;
}

.filter-cat-show-all:hover {
    gap: 10px;
}

/* Filter search */
.filter-search {
    position: relative;
    margin-bottom: 10px;
}

.filter-search i {
    position: absolute;
    inset-inline-start: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #9CA3AF;
    font-size: 12px;
}

.filter-search-input {
    width: 100%;
    padding: 8px 12px 8px 32px;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    font-family: inherit;
    font-size: 12px;
    background: #F8F9FB;
    transition: all 0.3s;
}

.filter-search-input:focus {
    outline: none;
    border-color: #EA580C;
    background: #fff;
}

/* Checkbox list */
.filter-checkbox-list {
    max-height: 200px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #E5E7EB transparent;
}

.filter-checkbox-list::-webkit-scrollbar {
    width: 4px;
}

.filter-checkbox-list::-webkit-scrollbar-thumb {
    background: #E5E7EB;
    border-radius: 2px;
}

.filter-checkbox {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 6px;
    cursor: pointer;
    transition: background 0.2s;
    border-radius: 6px;
}

.filter-checkbox:hover {
    background: #F8F9FB;
}

.filter-checkbox input[type="checkbox"] {
    display: none;
}

.filter-checkbox-mark {
    width: 18px;
    height: 18px;
    border: 1.5px solid #D1D5DB;
    border-radius: 5px;
    flex-shrink: 0;
    position: relative;
    transition: all 0.3s;
}

.filter-checkbox input[type="checkbox"]:checked + .filter-checkbox-mark {
    background: linear-gradient(135deg, #EA580C, #C8102E);
    border-color: #EA580C;
}

.filter-checkbox input[type="checkbox"]:checked + .filter-checkbox-mark::after {
    content: '\f00c';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 10px;
}

.filter-checkbox-label {
    flex: 1;
    font-size: 13px;
    color: #4B5563;
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.filter-checkbox-count {
    font-size: 11px;
    color: #9CA3AF;
    background: #F3F4F6;
    padding: 1px 7px;
    border-radius: 999px;
}

.filter-rating-text {
    color: #4B5563;
}

.fa-star.empty {
    color: #E5E7EB;
}

.filter-show-more {
    width: 100%;
    padding: 8px;
    background: transparent;
    border: 1px dashed #E5E7EB;
    border-radius: 8px;
    color: #6B7280;
    font-family: inherit;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    margin-top: 8px;
    transition: all 0.3s;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.filter-show-more:hover {
    background: #F8F9FB;
    border-color: #EA580C;
    color: #EA580C;
}

/* Price inputs */
.filter-price-inputs {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.filter-price-inputs input {
    flex: 1;
    padding: 8px 10px;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    font-family: inherit;
    font-size: 12px;
    text-align: center;
}

.filter-price-inputs input:focus {
    outline: none;
    border-color: #EA580C;
}

.filter-price-inputs span {
    color: #9CA3AF;
    font-weight: 700;
}

.filter-price-apply {
    width: 100%;
    padding: 10px;
    background: #F8F9FB;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    color: #EA580C;
    font-family: inherit;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.3s;
}

.filter-price-apply:hover {
    background: #EA580C;
    color: #fff;
    border-color: #EA580C;
}

/* Override default WooCommerce widget styling */
.shop-sidebar-modern .widget {
    margin-bottom: 0;
    padding: 0;
    border: none;
    background: transparent;
}

.shop-sidebar-modern .widget-title {
    font-size: 14px;
    font-weight: 700;
    color: #1F2937;
    margin: 0 0 14px;
    padding: 0;
}

.shop-sidebar-modern .widget ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.shop-sidebar-modern .widget ul li {
    padding: 6px 0;
    border: none;
}

.shop-sidebar-modern .widget a {
    color: #4B5563;
    font-size: 13px;
    text-decoration: none;
    transition: color 0.3s;
}

.shop-sidebar-modern .widget a:hover {
    color: #EA580C;
}

.shop-sidebar-modern .price_slider {
    margin: 14px 0;
    background: #EA580C;
    height: 4px;
    border-radius: 2px;
}

.shop-sidebar-modern .price_slider_amount {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.shop-sidebar-modern .price_slider_amount button {
    background: #EA580C !important;
    color: #fff !important;
    border: none !important;
    padding: 8px 18px !important;
    border-radius: 999px !important;
    font-family: inherit !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    cursor: pointer;
}

/* ============================================================================
   5. SHOP TOOLBAR
============================================================================ */
.shop-content-modern {
    min-width: 0;
}

/* ============================================================================
   4b. SMART SEARCH BAR — ORESTA ToolFinder integration (v3.2.0)
   Rendered above the toolbar only when the smart-search plugin is active.
============================================================================ */
.shop-smart-search {
    margin-bottom: 20px;
    padding: 14px 16px;
    background: linear-gradient(135deg, rgba(234, 88, 12, 0.05) 0%, rgba(10, 14, 26, 0.04) 100%);
    border: 1px solid #E5E7EB;
    border-inline-start: 3px solid #EA580C;
    border-radius: 14px;
}

.shop-smart-search-form {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.shop-smart-search-field {
    flex: 1;
    min-width: 220px;
    display: flex;
    align-items: center;
    gap: 10px;
    background: #fff;
    border: 1px solid #E5E7EB;
    border-radius: 10px;
    padding: 10px 14px;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.shop-smart-search-field:focus-within {
    border-color: #EA580C;
    box-shadow: 0 0 0 3px rgba(234, 88, 12, 0.10);
}

.shop-smart-search-field > i {
    color: #EA580C;
    font-size: 15px;
}

.shop-smart-search-field input {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-family: inherit;
    font-size: 13.5px;
    color: #0A0E1A;
    min-width: 0;
}

.shop-smart-search-field input::placeholder {
    color: #9CA3AF;
}

.shop-smart-search-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 20px;
    background: linear-gradient(135deg, #EA580C, #C8102E);
    color: #fff;
    border: none;
    border-radius: 10px;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.shop-smart-search-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(234, 88, 12, 0.25);
}

/* The plugin's own [oresta_homepage_search] output lives inside the slot —
   give it breathing room so it never clips. */
.shop-smart-search > form,
.shop-smart-search .oresta-search,
.shop-smart-search .oresta-search-form {
    width: 100%;
}

@media (max-width: 640px) {
    .shop-smart-search-form {
        flex-direction: column;
        align-items: stretch;
    }
    .shop-smart-search-btn {
        justify-content: center;
    }
}

.shop-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 14px 18px;
    background: #fff;
    border: 1px solid #E5E7EB;
    border-radius: 14px;
    margin-bottom: 20px;
    box-shadow: 0 2px 8px rgba(10, 14, 26, 0.03);
    flex-wrap: wrap;
}

.shop-toolbar-left {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.shop-toolbar-right {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

.shop-filter-toggle-btn {
    display: none;
    align-items: center;
    gap: 8px;
    padding: 9px 16px;
    background: linear-gradient(135deg, #EA580C, #C8102E);
    color: #fff;
    border: none;
    border-radius: 999px;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    position: relative;
}

.filter-count-badge {
    background: #FF6B1A;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-inline-start: 4px;
}

.shop-results-count {
    font-size: 13px;
    color: #6B7280;
}

.shop-results-count strong {
    color: #1F2937;
    font-weight: 700;
}

.shop-sort-form {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #6B7280;
}

.shop-sort-form label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.shop-sort-form label i {
    color: #9CA3AF;
    font-size: 12px;
}

.shop-sort-select {
    padding: 8px 14px;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    background: #fff;
    font-family: inherit;
    font-size: 13px;
    color: #1F2937;
    cursor: pointer;
    transition: all 0.3s;
}

.shop-sort-select:hover {
    border-color: #EA580C;
}

.shop-sort-select:focus {
    outline: none;
    border-color: #EA580C;
    box-shadow: 0 0 0 3px rgba(234, 88, 12, 0.1);
}

/* View Switcher */
.shop-view-switcher {
    display: flex;
    background: #F8F9FB;
    border-radius: 8px;
    padding: 3px;
    border: 1px solid #E5E7EB;
}

.view-btn {
    width: 36px;
    height: 32px;
    background: transparent;
    border: none;
    color: #9CA3AF;
    font-size: 13px;
    cursor: pointer;
    border-radius: 6px;
    transition: all 0.3s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.view-btn.active {
    background: #fff;
    color: #EA580C;
    box-shadow: 0 1px 3px rgba(10, 14, 26, 0.1);
}

.view-btn:hover:not(.active) {
    color: #6B7280;
}

/* ============================================================================
   6. PRODUCT CARD
============================================================================ */
.shop-products-wrapper .woocommerce ul.products,
.shop-products-wrapper ul.products {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.shop-products-wrapper ul.products li.product,
.product-card-modern {
    background: #fff;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(10, 14, 26, 0.04);
    border: 1px solid #F3F4F6;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    margin: 0 !important;
    width: auto !important;
    display: flex;
    flex-direction: column;
}

.shop-products-wrapper ul.products li.product:hover,
.product-card-modern:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 40px rgba(10, 14, 26, 0.1);
    border-color: rgba(234, 88, 12, 0.3);
}

/* Image */
.pcm-image-wrap {
    position: relative;
    aspect-ratio: 1/1;
    overflow: hidden;
    background: #F8F9FB;
}

.pcm-image-link {
    display: block;
    width: 100%;
    height: 100%;
}

.pcm-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    padding: 0;
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    background: #fff;
}

.product-card-modern:hover .pcm-image {
    transform: scale(1.08);
}

.pcm-image-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #F8F9FB, #fff);
    color: #D1D5DB;
    font-size: 60px;
}

/* Badges */
.pcm-badges {
    position: absolute;
    top: 12px;
    inset-inline-start: 12px;
    z-index: 3;
    display: flex;
    flex-direction: column;
    gap: 6px;
    align-items: flex-start;
}

.pcm-badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    color: #fff;
    backdrop-filter: blur(6px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.pcm-badge-sale {
    background: linear-gradient(135deg, #FF6B1A, #F5A623);
}

.pcm-badge-new {
    background: linear-gradient(135deg, #1E40AF, #3B82F6);
}

.pcm-badge-hot {
    background: linear-gradient(135deg, #EA580C, #C8102E);
}

.pcm-badge-out {
    background: linear-gradient(135deg, #4B5563, #6B7280);
}

/* Quick Actions */
.pcm-quick-actions {
    position: absolute;
    top: 12px;
    inset-inline-end: 12px;
    z-index: 3;
    display: flex;
    flex-direction: column;
    gap: 6px;
    opacity: 0;
    transform: translateX(10px);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

[dir="rtl"] .pcm-quick-actions {
    transform: translateX(-10px);
}

.product-card-modern:hover .pcm-quick-actions {
    opacity: 1;
    transform: translateX(0);
}

.pcm-quick-btn {
    width: 36px;
    height: 36px;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    border: none;
    border-radius: 50%;
    color: #4B5563;
    font-size: 13px;
    cursor: pointer;
    transition: all 0.3s;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 10px rgba(10, 14, 26, 0.1);
}

.pcm-quick-btn:hover {
    background: linear-gradient(135deg, #EA580C, #C8102E);
    color: #fff;
    transform: scale(1.1);
}

.pcm-quick-btn.active {
    background: linear-gradient(135deg, #FF6B1A, #F5A623);
    color: #fff;
}

/* Content */
.pcm-content {
    padding: 16px 18px 18px;
    display: flex;
    flex-direction: column;
    flex: 1;
}

.pcm-brand {
    font-size: 11px;
    color: #EA580C;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 4px;
}

.pcm-title {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5;
    margin: 0 0 8px;
    min-height: 42px;
}

.pcm-title a {
    color: #1F2937;
    text-decoration: none;
    transition: color 0.3s;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.product-card-modern:hover .pcm-title a {
    color: #EA580C;
}

/* Rating */
.pcm-rating {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
    font-size: 12px;
    color: #6B7280;
}

.pcm-stars {
    color: #F5A623;
    font-size: 11px;
    display: inline-flex;
    gap: 1px;
}

.pcm-no-rating span {
    color: #D1D5DB;
    font-style: italic;
}

/* Short description (only visible in list view) */
.pcm-short-desc {
    font-size: 12px;
    color: #9CA3AF;
    margin: 0 0 10px;
    line-height: 1.6;
    display: none;
}

.pcm-desc-placeholder {
    color: #D1D5DB;
    font-style: italic;
}

/* Bottom: Price + Add to cart */
.pcm-bottom {
    margin-top: auto;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.pcm-price-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.pcm-price-wrap .price,
.pcm-price-wrap .amount {
    font-size: 18px;
    font-weight: 800;
    color: #1F2937;
    display: inline-flex;
    align-items: baseline;
    gap: 4px;
}

.pcm-price-wrap .price del,
.pcm-price-wrap del .amount {
    color: #9CA3AF;
    font-size: 13px;
    font-weight: 400;
    text-decoration: line-through;
}

.pcm-price-wrap .price ins,
.pcm-price-wrap ins .amount {
    color: #EA580C;
    text-decoration: none;
    background: transparent;
}

.pcm-price-on-request {
    color: #EA580C !important;
    font-size: 13px !important;
    font-weight: 700 !important;
}

.pcm-actions {
    display: flex;
    gap: 8px;
}

.pcm-add-to-cart {
    flex: 1;
    padding: 11px 14px;
    background: linear-gradient(135deg, #EA580C, #C8102E);
    color: #fff;
    border: none;
    border-radius: 999px;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.3s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    text-align: center;
}

.pcm-add-to-cart:hover {
    background: linear-gradient(135deg, #9A3412, #EA580C);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(234, 88, 12, 0.3);
}

.pcm-add-to-cart.added {
    background: linear-gradient(135deg, #16A34A, #22C55E);
}

.pcm-add-to-cart.loading {
    pointer-events: none;
    opacity: 0.7;
}

.pcm-out-of-stock {
    background: #F3F4F6;
    color: #6B7280;
}

.pcm-out-of-stock:hover {
    background: #E5E7EB;
    color: #4B5563;
    transform: none;
    box-shadow: none;
}

/* ============================================================================
   7. LIST VIEW
============================================================================ */
.shop-products-wrapper.list-view ul.products,
.shop-products-wrapper.list-view ul.products {
    grid-template-columns: 1fr;
}

.shop-products-wrapper.list-view .product-card-modern,
.shop-products-wrapper.list-view ul.products li.product {
    display: grid;
    grid-template-columns: 240px 1fr;
    align-items: stretch;
}

.shop-products-wrapper.list-view .pcm-image-wrap {
    aspect-ratio: auto;
    height: 100%;
}

.shop-products-wrapper.list-view .pcm-content {
    padding: 22px 26px;
}

.shop-products-wrapper.list-view .pcm-short-desc {
    display: block;
}

.shop-products-wrapper.list-view .pcm-title {
    min-height: auto;
    font-size: 18px;
}

.shop-products-wrapper.list-view .pcm-title a {
    -webkit-line-clamp: 1;
}

.shop-products-wrapper.list-view .pcm-bottom {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.shop-products-wrapper.list-view .pcm-price-wrap .price,
.shop-products-wrapper.list-view .pcm-price-wrap .amount {
    font-size: 22px;
}

.shop-products-wrapper.list-view .pcm-actions {
    flex: 0 0 auto;
}

.shop-products-wrapper.list-view .pcm-add-to-cart {
    padding: 12px 28px;
}

/* ============================================================================
   8. PAGINATION
============================================================================ */
.shop-products-wrapper .woocommerce-pagination {
    margin-top: 40px;
    text-align: center;
}

.shop-products-wrapper .woocommerce-pagination ul {
    display: inline-flex;
    gap: 6px;
    list-style: none;
    padding: 0;
    margin: 0;
    background: #fff;
    padding: 6px;
    border-radius: 999px;
    border: 1px solid #E5E7EB;
    box-shadow: 0 2px 8px rgba(10, 14, 26, 0.04);
}

.shop-products-wrapper .woocommerce-pagination li {
    margin: 0;
    border: none;
}

.shop-products-wrapper .woocommerce-pagination a,
.shop-products-wrapper .woocommerce-pagination span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    height: 38px;
    padding: 0 12px;
    color: #4B5563;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    border-radius: 999px;
    transition: all 0.3s;
}

.shop-products-wrapper .woocommerce-pagination a:hover {
    background: #F8F9FB;
    color: #EA580C;
}

.shop-products-wrapper .woocommerce-pagination .current {
    background: linear-gradient(135deg, #EA580C, #C8102E);
    color: #fff;
}

.shop-products-wrapper .woocommerce-pagination .next a,
.shop-products-wrapper .woocommerce-pagination .prev a {
    background: rgba(234, 88, 12, 0.06);
    color: #EA580C;
}

/* ============================================================================
   9. NO RESULTS
============================================================================ */
.shop-no-results {
    text-align: center;
    padding: 60px 20px;
    background: #fff;
    border: 1px solid #E5E7EB;
    border-radius: 18px;
}

.shop-no-results-icon {
    width: 100px;
    height: 100px;
    margin: 0 auto 24px;
    background: linear-gradient(135deg, #F3F4F6, #E5E7EB);
    color: #9CA3AF;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 40px;
}

.shop-no-results h2 {
    font-size: 24px;
    font-weight: 700;
    color: #1F2937;
    margin: 0 0 12px;
}

.shop-no-results p {
    color: #6B7280;
    font-size: 14px;
    margin: 0 0 24px;
    max-width: 480px;
    margin-inline: auto;
    line-height: 1.7;
}

.shop-no-results-cta {
    margin-bottom: 20px;
    padding: 20px;
    background: linear-gradient(135deg, rgba(234, 88, 12, 0.05), rgba(255, 107, 26, 0.05));
    border-radius: 14px;
    border: 1px dashed rgba(234, 88, 12, 0.2);
}

.shop-no-results-cta p {
    margin-bottom: 12px;
    color: #1F2937;
    font-weight: 600;
}

.btn-primary-modern {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 26px;
    background: linear-gradient(135deg, #EA580C, #C8102E);
    color: #fff;
    border: none;
    border-radius: 999px;
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.3s;
    box-shadow: 0 8px 20px rgba(234, 88, 12, 0.3);
}

.btn-primary-modern:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(234, 88, 12, 0.4);
    color: #fff;
}

.btn-outline-modern {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 22px;
    background: transparent;
    color: #EA580C;
    border: 1.5px solid #EA580C;
    border-radius: 999px;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s;
}

.btn-outline-modern:hover {
    background: #EA580C;
    color: #fff;
}

/* ============================================================================
   10. MOBILE SIDEBAR OVERLAY
============================================================================ */
.shop-sidebar-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(10, 14, 26, 0.5);
    backdrop-filter: blur(4px);
    z-index: 998;
    opacity: 0;
    transition: opacity 0.3s;
}

.shop-sidebar-overlay.active {
    display: block;
    opacity: 1;
}

/* ============================================================================
   11. RESPONSIVE
============================================================================ */
@media (max-width: 1200px) {
    .shop-products-wrapper .woocommerce ul.products,
    .shop-products-wrapper ul.products {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 992px) {
    .shop-layout {
        grid-template-columns: 1fr;
    }

    .shop-sidebar-modern {
        position: fixed;
        top: 0;
        inset-inline-start: 0;
        bottom: 0;
        width: 320px;
        max-height: 100vh;
        z-index: 999;
        transform: translateX(-100%);
        transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        border-radius: 0;
    }

    [dir="rtl"] .shop-sidebar-modern {
        inset-inline-start: auto;
        inset-inline-end: 0;
        transform: translateX(100%);
    }

    .shop-sidebar-modern.active {
        transform: translateX(0);
    }

    .shop-sidebar-close {
        display: flex;
    }

    .shop-filter-toggle-btn {
        display: inline-flex;
    }

    .shop-products-wrapper .woocommerce ul.products,
    .shop-products-wrapper ul.products {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {

    .shop-toolbar {
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
    }

    .shop-toolbar-left,
    .shop-toolbar-right {
        justify-content: space-between;
    }

    .shop-products-wrapper.list-view .product-card-modern,
    .shop-products-wrapper.list-view ul.products li.product {
        grid-template-columns: 140px 1fr;
    }

    .shop-products-wrapper.list-view .pcm-content {
        padding: 14px 16px;
    }

    .shop-products-wrapper.list-view .pcm-bottom {
        flex-direction: column;
        align-items: stretch;
    }
}

@media (max-width: 480px) {
    .shop-products-wrapper .woocommerce ul.products,
    .shop-products-wrapper ul.products {
        grid-template-columns: 1fr;
    }

    .shop-products-wrapper.list-view .product-card-modern,
    .shop-products-wrapper.list-view ul.products li.product {
        grid-template-columns: 1fr;
    }

    .shop-products-wrapper.list-view .pcm-image-wrap {
        aspect-ratio: 1/1;
    }
}

/* RTL fixes */
[dir="rtl"] .pcm-badges {
    inset-inline-start: 12px;
    inset-inline-end: auto;
}

[dir="rtl"] .pcm-quick-actions {
    inset-inline-end: 12px;
    inset-inline-start: auto;
}

/* ============================================================================
   ██ v5.2.0 — SHOP REDESIGN LAYER (ostadabzar-style + AbzarBin theme) ██
   بازطراحی کامل صفحه فروشگاه: هدر فشرده، چیپ دسته‌ها، سایدبار فیلتر مدرن،
   گرید کاملاً ریسپانسیو (موبایل/تبلت/دسکتاپ/لنداسکیپ) و متن‌های خوانا.
   ============================================================================ */

/* ---------- 12. TOPBAR (فشرده و مدرن) ---------- */
.shop-topbar {
    background: #fff;
    border-bottom: 1px solid #EDE9E3;
    padding: 18px 0 14px;
}
.shop-topbar-breadcrumb {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: #78716C;
    background: #FAF8F5;
    border: 1px solid #EDE9E3;
    border-radius: 999px;
    padding: 5px 14px;
    margin-bottom: 14px;
}
.shop-topbar-breadcrumb a {
    color: #57534E;
    text-decoration: none;
    font-weight: 600;
}
.shop-topbar-breadcrumb a:hover { color: #EA580C; }
.shop-topbar-breadcrumb .sep { font-size: 8px; color: #A8A29E; }
.shop-topbar-breadcrumb .current { color: #1C1917; font-weight: 700; }
.shop-topbar-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
}
.shop-topbar-title {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: clamp(19px, 2.6vw, 26px);
    font-weight: 900;
    color: #1C1917;
    margin: 0;
    line-height: 1.4;
}
.shop-topbar-title::before {
    content: '';
    width: 5px;
    height: 26px;
    border-radius: 3px;
    background: linear-gradient(180deg, #EA580C, #FBBF24);
    flex-shrink: 0;
}
/* v6.11.0 — صفحه برند: نشان رنگی برند در هدر فروشگاه */
.shop-topbar-title.is-brand::before {
    background: linear-gradient(180deg, var(--bzc, #EA580C), var(--bzc2, #B4430A));
}
.shop-brand-logo {
    height: 46px;
    max-width: 158px;
    width: auto;
    object-fit: contain;
    background: #FFFFFF;
    border: 1px solid var(--bzc-bd, #EDE9E3);
    border-radius: 12px;
    padding: 4px 12px;
    box-shadow: 0 2px 8px rgba(28, 25, 23, 0.05);
    flex-shrink: 0;
}
.shop-brand-lettermark {
    width: 46px;
    height: 46px;
    border-radius: 12px;
    color: #FFFFFF;
    font-size: 20px;
    font-weight: 900;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: linear-gradient(155deg, var(--bzc2, #B4430A) 0%, var(--bzc, #EA580C) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 6px 14px var(--bzc-glow, rgba(234, 88, 12, 0.16));
}
@media (max-width: 767px) {
    .shop-brand-logo { height: 38px; max-width: 124px; }
    .shop-brand-lettermark { width: 38px; height: 38px; font-size: 17px; }
}
.shop-topbar-count {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    font-weight: 700;
    color: #57534E;
    background: #FAF8F5;
    border: 1px solid #EDE9E3;
    border-radius: 999px;
    padding: 4px 12px;
}
.shop-topbar-count b { color: #EA580C; font-size: 13px; }
.shop-topbar-clear {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 16px;
    border-radius: 999px;
    background: rgba(234, 88, 12, 0.09);
    border: 1px solid rgba(234, 88, 12, 0.35);
    color: #C2410C;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.25s;
}
.shop-topbar-clear:hover { background: #EA580C; color: #fff; }

/* ---------- 13. چیپ‌های دسته (اسکرول افقی + snap) ---------- */
.shop-topbar-cats {
    display: flex;
    gap: 8px;
    margin-top: 14px;
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
    scroll-snap-type: x proximity;
    padding-bottom: 4px;
    -webkit-overflow-scrolling: touch;
}
.shop-topbar-cats::-webkit-scrollbar { display: none; }
.shop-topbar-cats a {
    scroll-snap-align: start;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 16px;
    border-radius: 999px;
    background: #FAF8F5;
    border: 1px solid #EDE9E3;
    color: #44403C;
    font-size: 12.5px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    transition: all 0.22s;
}
.shop-topbar-cats a i { font-size: 11px; color: #A8A29E; transition: color 0.22s; }
.shop-topbar-cats a small {
    font-size: 10.5px;
    font-weight: 700;
    color: #A8A29E;
    background: #fff;
    border-radius: 999px;
    padding: 1px 7px;
    transition: all 0.22s;
}
.shop-topbar-cats a:hover {
    border-color: #EA580C;
    color: #C2410C;
    background: #fff;
    box-shadow: 0 4px 12px rgba(234, 88, 12, 0.12);
}
.shop-topbar-cats a:hover i { color: #EA580C; }
.shop-topbar-cats a.active {
    background: linear-gradient(135deg, #EA580C, #C2410C);
    border-color: transparent;
    color: #fff;
    box-shadow: 0 6px 16px rgba(234, 88, 12, 0.30);
}
.shop-topbar-cats a.active i { color: #FBBF24; }
.shop-topbar-cats a.active small { background: rgba(255,255,255,0.22); color: #fff; }

/* ---------- 14. بدنه فروشگاه ---------- */
.shop-container-modern { padding: 26px 0 70px; background: #F6F4F0; }
.shop-layout { grid-template-columns: 276px minmax(0, 1fr); gap: 24px; }

/* سایدبار فیلتر */
.shop-sidebar-modern {
    top: 96px;
    border: 1px solid #EDE9E3;
    border-radius: 18px;
    box-shadow: 0 4px 20px rgba(28, 25, 23, 0.05);
}
.shop-sidebar-header {
    background: #1C1917;
    padding: 15px 20px;
}
.shop-sidebar-header h3 {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-size: 14px;
    font-weight: 800;
    color: #fff;
    margin: 0;
}
.shop-sidebar-header h3 i { color: #FBBF24; font-size: 13px; }
.shop-sidebar-close {
    display: none;
    width: 36px; height: 36px;
    border: 1px solid rgba(255,255,255,0.25);
    background: rgba(255,255,255,0.08);
    color: #fff;
    border-radius: 999px;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 13px;
}
.shop-sidebar-close:active { background: #EA580C; }

.filter-section { border-bottom: 1px solid #F0EDE7; }
.filter-section:last-of-type { border-bottom: 0; }
.filter-section-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
    padding: 14px 20px;
    background: transparent;
    border: 0;
    cursor: pointer;
    font-family: inherit;
    text-align: start;
    transition: background 0.2s;
}
.filter-section-toggle:hover { background: #FAF8F5; }
.filter-section-toggle > span {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-size: 13px;
    font-weight: 800;
    color: #1C1917;
}
.filter-section-toggle > span > i {
    color: #EA580C;
    font-size: 12px;
    width: 26px; height: 26px;
    display: inline-flex; align-items: center; justify-content: center;
    background: rgba(234, 88, 12, 0.09);
    border-radius: 8px;
}
.filter-section-toggle > .fa-chevron-down { color: #A8A29E; font-size: 10px; transition: transform 0.25s; }
.filter-section.open .filter-section-toggle > .fa-chevron-down { transform: rotate(180deg); color: #EA580C; }

/* آیتم دسته درختی */
.filter-cat-item {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 9px 10px;
    margin: 2px 12px;
    border-radius: 10px;
    color: #44403C;
    font-size: 12.5px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s;
}
.filter-cat-item i { color: #A8A29E; font-size: 12px; width: 18px; text-align: center; }
.filter-cat-item:hover { background: #FAF8F5; color: #C2410C; }
.filter-cat-item:hover i { color: #EA580C; }
.filter-cat-item.active {
    background: rgba(234, 88, 12, 0.10);
    color: #C2410C;
}
.filter-cat-item.active i { color: #EA580C; }
.filter-cat-name { flex: 1; min-width: 0; line-height: 1.6; }
.filter-cat-count {
    flex-shrink: 0;
    font-size: 10px;
    font-weight: 700;
    color: #78716C;
    background: #FAF8F5;
    border: 1px solid #EDE9E3;
    border-radius: 999px;
    padding: 1px 8px;
}
.filter-cat-item.active .filter-cat-count {
    background: #EA580C;
    border-color: #EA580C;
    color: #fff;
}
.filter-cat-children {
    border-inline-start: 2px solid rgba(234, 88, 12, 0.25);
    margin: 2px 20px 6px 12px;
    padding-inline-start: 6px;
}
.filter-cat-item.sub { margin: 1px 4px; font-size: 12px; font-weight: 500; color: #57534E; }
.filter-cat-show-all {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin: 10px 12px 14px;
    padding: 9px 12px;
    border: 1px dashed #D6D0C8;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 700;
    color: #EA580C;
    text-decoration: none;
    transition: all 0.2s;
}
.filter-cat-show-all:hover { background: #EA580C; color: #fff; border-style: solid; }

/* نقطه رنگی برند */
.filter-brand-dot {
    display: inline-block;
    width: 9px; height: 9px;
    border-radius: 50%;
    margin-inline-end: 6px;
    box-shadow: 0 0 0 2px #fff, 0 0 0 3px rgba(28,25,23,0.08);
    vertical-align: middle;
}

/* چک‌باکس فیلترها — لمس‌پذیر و خوانا */
.filter-checkbox {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    margin: 2px 12px;
    border-radius: 10px;
    cursor: pointer;
    transition: background 0.2s;
    min-height: 40px;
}
.filter-checkbox:hover { background: #FAF8F5; }
.filter-checkbox input[type="checkbox"] { accent-color: #EA580C; width: 16px; height: 16px; cursor: pointer; flex-shrink: 0; }
.filter-checkbox-label { flex: 1; font-size: 12.5px; font-weight: 600; color: #44403C; line-height: 1.6; }
.filter-checkbox-count { font-size: 10.5px; font-weight: 700; color: #A8A29E; }
.filter-rating-text { font-size: 11px; color: #78716C; margin-inline-start: 4px; }

/* فیلتر قیمت */
.filter-price-inputs {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 4px 12px 10px;
}
.filter-price-inputs input {
    flex: 1;
    min-width: 0;
    padding: 9px 10px;
    border: 1px solid #E5E0D8;
    border-radius: 10px;
    font-size: 12.5px;
    font-family: inherit;
    color: #1C1917;
    background: #FAF8F5;
}
.filter-price-inputs input:focus { outline: none; border-color: #EA580C; background: #fff; }
.filter-price-inputs span { color: #A8A29E; font-weight: 700; }
.filter-price-apply {
    display: block;
    width: calc(100% - 24px);
    margin: 0 12px 14px;
    padding: 10px;
    border: 0;
    border-radius: 10px;
    background: #1C1917;
    color: #FBBF24;
    font-size: 12.5px;
    font-weight: 700;
    font-family: inherit;
    cursor: pointer;
    transition: all 0.2s;
}
.filter-price-apply:hover { background: #EA580C; color: #fff; }

/* چیپ‌های فیلتر فعال */
.active-filters-chips { display: flex; flex-wrap: wrap; gap: 7px; padding: 4px 0 10px; }
.active-filter-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 11.5px;
    font-weight: 700;
    color: #C2410C;
    background: rgba(234, 88, 12, 0.08);
    border: 1px solid rgba(234, 88, 12, 0.30);
    border-radius: 999px;
    padding: 4px 12px;
}
.active-filter-chip strong { color: #1C1917; }
.filter-clear-all {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    font-weight: 700;
    color: #B91C1C;
    text-decoration: none;
}
.filter-clear-all:hover { text-decoration: underline; }

/* دکمه اعمال فیلتر — چسبان در پایین سایدبار */
.shop-sidebar-footer {
    position: sticky;
    bottom: 0;
    background: #fff;
    border-top: 1px solid #EDE9E3;
    padding: 12px 16px;
}
.shop-sidebar-apply {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 12px;
    border: 0;
    border-radius: 12px;
    background: linear-gradient(135deg, #EA580C, #C2410C);
    color: #fff;
    font-size: 13.5px;
    font-weight: 800;
    font-family: inherit;
    cursor: pointer;
    box-shadow: 0 6px 18px rgba(234, 88, 12, 0.30);
    transition: all 0.2s;
}
.shop-sidebar-apply:active { transform: scale(0.98); }

/* ---------- 15. نوار ابزار (toolbar) ---------- */
.shop-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    background: #fff;
    border: 1px solid #EDE9E3;
    border-radius: 14px;
    padding: 10px 14px;
    margin-bottom: 18px;
}
.shop-toolbar-left { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.shop-filter-toggle-btn {
    display: none;
    align-items: center;
    gap: 7px;
    padding: 9px 16px;
    border: 1px solid #EDE9E3;
    border-radius: 999px;
    background: #1C1917;
    color: #fff;
    font-size: 12.5px;
    font-weight: 700;
    font-family: inherit;
    cursor: pointer;
}
.shop-filter-toggle-btn i { color: #FBBF24; }
.filter-count-badge {
    min-width: 18px; height: 18px;
    display: inline-flex; align-items: center; justify-content: center;
    background: #EA580C;
    color: #fff;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
}
.shop-results-count { font-size: 12.5px; color: #78716C; font-weight: 500; }
.shop-results-count strong { color: #1C1917; font-weight: 800; }
.shop-toolbar-right { display: flex; align-items: center; gap: 10px; }
.shop-sort-form {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 12px;
    color: #78716C;
}
.shop-sort-select {
    padding: 8px 12px;
    border: 1px solid #E5E0D8;
    border-radius: 10px;
    background: #FAF8F5;
    font-family: inherit;
    font-size: 12.5px;
    font-weight: 600;
    color: #1C1917;
    cursor: pointer;
}
.shop-sort-select:focus { outline: none; border-color: #EA580C; }
.shop-view-switcher {
    display: inline-flex;
    background: #FAF8F5;
    border: 1px solid #EDE9E3;
    border-radius: 10px;
    padding: 3px;
    gap: 2px;
}
.view-btn {
    width: 34px; height: 32px;
    border: 0;
    background: transparent;
    color: #A8A29E;
    border-radius: 8px;
    cursor: pointer;
    font-size: 13px;
    transition: all 0.2s;
}
.view-btn.active { background: #1C1917; color: #FBBF24; }
.view-btn:not(.active):hover { color: #EA580C; background: #fff; }

/* ---------- 16. گرید محصولات — ریسپانسیو قطعی ---------- */
.shop-products-wrapper ul.products,
.shop-products-wrapper .woocommerce ul.products,
.woocommerce .shop-products-wrapper ul.products {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 16px;
    margin: 0;
    padding: 0;
    list-style: none;
    float: none !important;
    width: 100%;
}
.shop-products-wrapper ul.products::before,
.shop-products-wrapper ul.products::after { display: none !important; }
.shop-products-wrapper ul.products li.product {
    width: 100% !important;
    margin: 0 !important;
    float: none !important;
    clear: none !important;
    min-width: 0;
}

/* ---------- 17. حالت بدون نتیجه ---------- */
.shop-no-results { border: 1px solid #EDE9E3; border-radius: 18px; background: #fff; }
.shop-no-results h2 { color: #1C1917; }
.shop-no-results p { color: #78716C; }

/* ---------- 18. ریسپانسیو فروشگاه ---------- */
@media (max-width: 1200px) {
    .shop-products-wrapper ul.products,
    .shop-products-wrapper .woocommerce ul.products,
    .woocommerce .shop-products-wrapper ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
@media (min-width: 993px) {
    .shop-sidebar-overlay { display: none !important; }
}
@media (max-width: 992px) {
    .shop-layout { grid-template-columns: minmax(0, 1fr); }
    /* سایدبار = کشوی موبایل از پایین صفحه (bottom-sheet مدرن) */
    .shop-sidebar-modern {
        position: fixed;
        top: auto;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        max-width: 100%;
        max-height: 86vh;
        height: auto;
        z-index: 1200;
        border-radius: 22px 22px 0 0;
        transform: translateY(105%);
        transition: transform 0.34s cubic-bezier(0.32, 0.72, 0, 1);
        box-shadow: 0 -20px 60px rgba(28, 25, 23, 0.25);
    }
    [dir="rtl"] .shop-sidebar-modern { transform: translateY(105%); inset: auto 0 0 0; }
    .shop-sidebar-modern.active { transform: translateY(0); }
    .shop-sidebar-close { display: inline-flex; }
    .shop-sidebar-body { max-height: calc(86vh - 130px); overflow-y: auto; overscroll-behavior: contain; }
    .shop-filter-toggle-btn { display: inline-flex; }
    .shop-sidebar-overlay {
        display: none;
        position: fixed;
        inset: 0;
        background: rgba(28, 25, 23, 0.55);
        backdrop-filter: blur(2px);
        z-index: 1199;
    }
    .shop-products-wrapper ul.products,
    .shop-products-wrapper .woocommerce ul.products,
    .woocommerce .shop-products-wrapper ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .shop-topbar-cats a { padding: 8px 14px; font-size: 12px; }
}
@media (max-width: 480px) {
    .shop-products-wrapper ul.products,
    .shop-products-wrapper .woocommerce ul.products,
    .woocommerce .shop-products-wrapper ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px; }
    .shop-container-modern { padding: 18px 0 90px; }
    .shop-toolbar { padding: 8px 10px; gap: 8px; }
    .shop-toolbar-left { width: 100%; justify-content: space-between; }
    .shop-toolbar-right { width: 100%; justify-content: space-between; }
    .shop-sort-form { flex: 1; justify-content: space-between; }
    .shop-sort-select { flex: 1; }
    .shop-topbar { padding: 14px 0 10px; }
    .shop-topbar-title { font-size: 18px; }
    .shop-topbar-title::before { height: 20px; }
    .shop-topbar-count { font-size: 11px; }
}
@media (max-width: 340px) {
    .shop-products-wrapper ul.products,
    .shop-products-wrapper .woocommerce ul.products,
    .woocommerce .shop-products-wrapper ul.products { grid-template-columns: minmax(0, 1fr) !important; }
}

/* ---------- 19. فروشگاه در حالت لنداسکیپ موبایل ---------- */
@media (orientation: landscape) and (max-height: 540px) and (max-width: 1024px) {
    .shop-sidebar-modern.active { max-height: 92vh; }
    .shop-sidebar-body { max-height: calc(92vh - 130px); }
    .shop-topbar { padding: 10px 0 8px; }
    .shop-topbar-breadcrumb { margin-bottom: 8px; }
    .shop-topbar-cats { margin-top: 8px; }
    .shop-container-modern { padding: 14px 0 70px; }
    .shop-products-wrapper ul.products,
    .shop-products-wrapper .woocommerce ul.products,
    .woocommerce .shop-products-wrapper ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}


/* ============================================================================
   20. v5.4.0 — SHOP FULL-BLEED REDesign (الگو: abzaret/abzarmarket/abzarreza)
   ----------------------------------------------------------------------------
   ۱) اسلایدر دسته‌بندی تمام‌عرض با فلش قبلی/بعدی + اسکرول لمسی
   ۲) گرید محصولات تمام‌صفحه ۶/۵/۴/۳/۲ ستونه (سایدبار = دراور کشویی)
   ۳) کارت فشرده: توضیح کوتاه و امتیاز در گرید فروشگاه مخفی (مثل abzaret)
   ============================================================================ */

/* ---------- 20.1 — چیدمان تک‌ستونه تمام‌عرض ---------- */
.shop-fullbleed .shop-layout,
.shop-container-modern .shop-layout {
    display: block !important;
    grid-template-columns: none !important;
    gap: 0 !important;
}
.shop-container-modern { padding: 0 0 90px; }
.shop-container-modern > .container {
    max-width: 1300px;
    margin-inline: auto;
}

/* سایدبار = دراور کشویی در همه سایزها (الگوی WoodMart/abzaret)
   v5.4.3-fix: لنگر دراور به inset-inline-start تغییر کرد — قبلاً inset-inline-end +
   transform هم‌جهت، پنل را به وسط صفحه می‌آورد (باگ «فیلتر بزرگ روی صفحه») */
.shop-sidebar-modern {
    position: fixed !important;
    top: 0;
    inset-inline-start: 0;
    inset-inline-end: auto;
    width: min(360px, 88vw);
    height: 100dvh;
    max-height: 100dvh;
    margin: 0 !important;
    border-radius: 0 !important;
    transform: translateX(-102%);
    transition: transform 0.32s cubic-bezier(0.32, 0.72, 0, 1);
    box-shadow: -18px 0 48px rgba(28, 25, 23, 0.18);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    z-index: 1002;
}
[dir="rtl"] .shop-sidebar-modern { transform: translateX(102%); }
.shop-sidebar-modern.active { transform: translateX(0) !important; }
.shop-sidebar-modern .shop-sidebar-body { flex: 1; overflow-y: auto; }
.shop-sidebar-overlay {
    position: fixed;
    inset: 0;
    background: rgba(28, 25, 23, 0.45);
    backdrop-filter: blur(2px);
    z-index: 1001;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s ease, visibility 0.25s ease;
}
.shop-sidebar-overlay.active { opacity: 1; visibility: visible; }

/* ---------- 20.2 — اسلایدر دسته‌بندی (چیپ‌ها + فلش‌ها + محو لبه) ---------- */
.shopcat-carousel {
    background: #fff;
    border-block: 1px solid #EDE9E3;
    padding: 12px 0 14px;
}
.shopcat-carousel-head {
    max-width: 1300px;
    margin-inline: auto;
    padding-inline: clamp(16px, 2.6vw, 40px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}
.shopcat-carousel-title {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 800;
    color: #1C1917;
    letter-spacing: -0.01em;
}
.shopcat-carousel-title i { color: #EA580C; font-size: 13px; }
.shopcat-carousel-nav { display: flex; gap: 8px; }
.shopcat-arrow {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    border: 1px solid #EDE9E3;
    background: #FAF8F5;
    color: #1C1917;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    transition: all 0.18s ease;
}
.shopcat-arrow:hover:not(:disabled) {
    background: #1C1917;
    color: #fff;
    border-color: #1C1917;
}
.shopcat-arrow:disabled { opacity: 0.3; cursor: default; pointer-events: none; }

.shopcat-track-outer { position: relative; }
.shopcat-track {
    display: flex;
    align-items: center;
    gap: 8px;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    /* v5.4 fix — بدون این، کروم در RTL نقطه snap اولیه را داخل padding می‌برد
       و چیپ اول نصفه دیده می‌شد؛ scroll-padding باید هم‌عرض padding باشد */
    scroll-padding-inline: clamp(16px, 2.6vw, 40px);
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding: 4px clamp(16px, 2.6vw, 40px) 10px;
    scroll-behavior: smooth;
    max-width: 1300px;
    margin-inline: auto;
}
.shopcat-track::-webkit-scrollbar { display: none; }

.shopcat-chip {
    flex-shrink: 0;
    scroll-snap-align: start;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 40px;
    padding: 0 16px;
    background: #FAF8F5;
    border: 1px solid #EDE9E3;
    border-radius: 10px;
    color: #44403C;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none !important;
    white-space: nowrap;
    transition: all 0.18s ease;
}
.shopcat-chip i { font-size: 12px; color: #78716C; transition: color 0.18s ease; }
.shopcat-chip small {
    font-size: 10.5px;
    color: #A8A29E;
    background: #F0EDE8;
    border-radius: 99px;
    padding: 1px 7px;
    font-weight: 700;
    line-height: 1.6;
}
.shopcat-chip:hover {
    border-color: #EA580C;
    color: #C2410C;
    background: #FFF7ED;
    transform: translateY(-1px);
}
.shopcat-chip:hover i { color: #EA580C; }
.shopcat-chip.is-active {
    background: #1C1917;
    border-color: #1C1917;
    color: #fff;
}
.shopcat-chip.is-active i { color: #FDBA74; }
.shopcat-chip.is-active small { background: rgba(255, 255, 255, 0.14); color: #FDBA74; }
.shopcat-chip-sale {
    border-color: rgba(234, 88, 12, 0.35);
    background: linear-gradient(135deg, #FFF7ED, #FFEDD5);
    color: #C2410C;
}
.shopcat-chip-sale i { color: #EA580C; }
.shopcat-chip-sale:hover { border-color: #EA580C; background: #FFEDD5; }

/* محو لبه‌ها هنگام امکان اسکرول */
.shopcat-fade {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 42px;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.25s ease;
    z-index: 2;
}
.shopcat-fade.is-visible { opacity: 1; }
.shopcat-fade-start {
    inset-inline-start: 0;
    background: linear-gradient(to left, #fff, rgba(255, 255, 255, 0));
}
[dir="rtl"] .shopcat-fade-start {
    background: linear-gradient(to right, #fff, rgba(255, 255, 255, 0));
}
.shopcat-fade-end {
    inset-inline-end: 0;
    background: linear-gradient(to right, #fff, rgba(255, 255, 255, 0));
}
[dir="rtl"] .shopcat-fade-end {
    background: linear-gradient(to left, #fff, rgba(255, 255, 255, 0));
}

/* ---------- 20.3 — گرید محصولات تمام‌صفحه ۶/۵/۴/۳/۲ ---------- */
.shop-products-wrapper ul.products,
.shop-products-wrapper .woocommerce ul.products,
.woocommerce .shop-products-wrapper ul.products {
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 14px 12px !important;
}
@media (max-width: 1399px) {
    .shop-products-wrapper ul.products,
    .shop-products-wrapper .woocommerce ul.products,
    .woocommerce .shop-products-wrapper ul.products {
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    }
}
@media (max-width: 1199px) {
    .shop-products-wrapper ul.products,
    .shop-products-wrapper .woocommerce ul.products,
    .woocommerce .shop-products-wrapper ul.products {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
}
@media (max-width: 991px) {
    .shop-products-wrapper ul.products,
    .shop-products-wrapper .woocommerce ul.products,
    .woocommerce .shop-products-wrapper ul.products {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 12px 10px !important;
    }
}
@media (max-width: 767px) {
    .shop-products-wrapper ul.products,
    .shop-products-wrapper .woocommerce ul.products,
    .woocommerce .shop-products-wrapper ul.products {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }
}
@media (max-width: 360px) {
    .shop-products-wrapper ul.products,
    .shop-products-wrapper .woocommerce ul.products,
    .woocommerce .shop-products-wrapper ul.products {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

/* کارت فشرده در گرید فروشگاه (الگوی abzaret): بدون توضیح کوتاه/امتیاز */
.shop-products-wrapper .pcm-short-desc,
.shop-products-wrapper .pcm-rating { display: none !important; }
.shop-products-wrapper .pcm-content { padding: 10px 10px 12px !important; }
.shop-products-wrapper .pcm-brand { font-size: 9.5px !important; margin-bottom: 2px !important; }
.shop-products-wrapper .pcm-title { font-size: 12.5px !important; }
.shop-products-wrapper .pcm-title a {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 34px;
}
.shop-products-wrapper .pcm-price-wrap .price { font-size: 13px !important; }
.shop-products-wrapper .pcm-price-wrap .price del { font-size: 10px !important; }
.shop-products-wrapper .pcm-add-to-cart { height: 38px !important; font-size: 11.5px !important; }
.shop-products-wrapper .pcm-quick-btn { width: 28px !important; height: 28px !important; font-size: 11px !important; }

/* ---------- 20.4 — نوار ابزار و نتیجه‌ها ---------- */
.shop-toolbar {
    position: sticky;
    top: 0;
    z-index: 20;
    background: #FAF8F5;
    border: 1px solid #EDE9E3;
    border-radius: 12px;
    margin: 14px 0;
    padding: 10px 14px;
}
.shop-products-wrapper { margin-top: 4px; }

/* صفحه‌بندی تمیز */
.shop-products-wrapper + .woocommerce-pagination,
.woocommerce-pagination {
    margin-top: 26px;
    justify-content: center;
}

/* ---------- 20.5 — دراور فیلتر: حالت لنداسکیپ ---------- */
@media (orientation: landscape) and (max-height: 540px) and (max-width: 1024px) {
    .shop-products-wrapper ul.products,
    .shop-products-wrapper .woocommerce ul.products,
    .woocommerce .shop-products-wrapper ul.products {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
    .shopcat-chip { height: 36px; font-size: 12px; }
}

/* ============================================================================
   21. v5.4.3 — رفع باگ «فیلتر بزرگ روی صفحه فروشگاه»
   ----------------------------------------------------------------------------
   باگ: از v5.4.0 جهت اسلاید دراور فیلتر معکوس بود — لنگر (inset-inline-end) و
   transform هم‌جهت بودند، در نتیجه پنل فیلتر به‌جای بیرون صفحه، در وسط صفحه
   شناور می‌شد (روی دسکتاپ/تبلت کاملاً دیده می‌شد). همچنین در دسکتاپ دکمه
   «فیلترها»، ضربدر بستن و اورلی تیره همگی مخفی بودند و دراور عملاً بی‌دسترسی بود.
   اصلاح:
   ۱) لنگر دراور به ابتدای منطقی صفحه (RTL: لبه راست) + جهت اسلاید صحیح
   ۲) دکمه «فیلترها» در تولبار در همه سایزها نمایان
   ۳) ضربدر بستن دراور در همه سایزها نمایان
   ۴) اورلی تیره پس‌زمینه هنگام باز شدن در همه سایزها (حذف قید مخفی‌سازی دسکتاپ)
   ============================================================================ */
.shop-sidebar-modern {
    inset-inline-start: 0 !important;   /* LTR: لبه چپ | RTL: لبه راست */
    inset-inline-end: auto !important;  /* خنثی‌کردن left:0 قدیمی لایه‌های <=992 */
    transform: translateX(-102%);
}
[dir="rtl"] .shop-sidebar-modern { transform: translateX(102%); }
.shop-sidebar-modern.active { transform: translateX(0) !important; }

/* دکمه «فیلترها» — نمایان در همه سایزها (سایدبار از v5.4 فقط دراور کشویی است) */
.shop-filter-toggle-btn { display: inline-flex !important; }

/* ضربدر بستن — نمایان در همه سایزها */
.shop-sidebar-close { display: inline-flex !important; }

/* اورلی تیره — با .active در همه سایزها نمایش داده شود
   ( specificity بالاتر از قاعده display:none !important قدیمی دسکتاپ ) */
.shop-sidebar-overlay.active {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* ============================================================================
   22. v5.5.0 — فیلتر کنار محصولات (سایدبار دائمی دسکتاپ — الگوی abzarreza.com/shop)
   ----------------------------------------------------------------------------
   درخواست کاربر: «فیلتر رو مخفی کردی، یکاری کن کنار محصولات قرار بگیره و نشون
   داده بشه». در دسکتاپ (≥992px) پنل فیلتر به‌صورت ستون چسبان «کنار» گرید
   محصولات نمایش داده می‌شود (سمت راست در RTL، مثل ابزاررضا: سایدبار ~308px +
   فاصله ~44px + گرید). در تبلت/موبایل همان دراور کشویی v5.4.3 می‌ماند.
   نکته فنی: قواعد دراور (بخش ۲۰/۲۱) با !important در همه عرض‌ها اعمال می‌شوند؛
   این بخش بعد از آن‌ها قرار گرفته تا با همان specificity اما دیرتر، برنده شود.
   ============================================================================ */
@media (min-width: 992px) {

    /* چیدمان دوستونه: سایدبار (راست در RTL) + محتوا */
    .shop-container-modern > .container {
        display: grid !important;
        grid-template-columns: 300px minmax(0, 1fr);
        gap: 0 28px;
        align-items: start;
    }

    /* پنل فیلتر: چسبان و همیشه نمایان */
    .shop-sidebar-modern {
        position: sticky !important;
        top: calc(var(--ry-header-h, 80px) + 18px) !important;
        inset-inline: auto !important;
        width: auto !important;
        min-width: 0;
        height: auto !important;
        max-height: calc(100vh - var(--ry-header-h, 80px) - 44px) !important;
        transform: none !important;
        border-radius: 18px !important;
        border: 1px solid #EDE9E3 !important;
        box-shadow: 0 6px 22px rgba(28, 25, 23, 0.06) !important;
        display: flex !important;
        flex-direction: column !important;
        overflow: hidden;
        z-index: 5;
        margin: 18px 0 0 !important;
    }
    .shop-sidebar-modern.active { transform: none !important; }

    /* سربرگ پنل — سبک تمیز ابزاررضا (نوار تیره باریک) */
    .shop-sidebar-modern .shop-sidebar-header {
        padding: 14px 18px;
        background: linear-gradient(135deg, #1C1917 0%, #292524 100%);
    }

    /* روی دسکتاپ: ضربدر و اورلی و دکمه «فیلترها» معنا ندارند */
    .shop-sidebar-modern .shop-sidebar-close { display: none !important; }
    .shop-container-modern .shop-sidebar-overlay { display: none !important; }
    .shop-toolbar .shop-filter-toggle-btn { display: none !important; }

    /* دکمه اعمال: تمام‌عرض داخل پنل */
    .shop-sidebar-modern .shop-sidebar-footer { padding: 12px 14px 14px; }

    /* تولبار: چسبان زیر هدر چسبان (نه زیر لبه صفحه) */
    .shop-toolbar {
        position: sticky;
        top: calc(var(--ry-header-h, 80px) + 12px);
        margin-top: 18px;
    }

    /* گرید محصولات: ۴ ستونه در فضای کوچک‌شده (الگوی ابزاررضا: ~۵ کارت ۱۸۵px)
       1300 − 300 (سایدبار) − 28 (فاصله) = ~970px محتوا */
    .shop-products-wrapper ul.products,
    .shop-products-wrapper .woocommerce ul.products,
    .woocommerce .shop-products-wrapper ul.products {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 16px 14px !important;
    }
    /* کارت کمی بزرگ‌تر از حالت فشرده ۶ستونه — قابل‌خواندن‌تر */
    .shop-products-wrapper .pcm-title { font-size: 13px !important; }
    .shop-products-wrapper .pcm-price-wrap .price { font-size: 13.5px !important; }
    .shop-products-wrapper .pcm-add-to-cart { height: 40px !important; font-size: 12px !important; }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .shop-products-wrapper ul.products,
    .shop-products-wrapper .woocommerce ul.products,
    .woocommerce .shop-products-wrapper ul.products {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (min-width: 1500px) {
    .shop-products-wrapper ul.products,
    .shop-products-wrapper .woocommerce ul.products,
    .woocommerce .shop-products-wrapper ul.products {
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    }
}

/* موبایل/تبلت (<992px): بدون تغییر — دراور کشویی v5.4.3 برقرار است */

/* ============================================================================
   22. v6.3.0 — SHOP CARDS: عریض‌تر، شیک‌تر + دکمه سبد خرید جدید
   ----------------------------------------------------------------------------
   درخواست کاربر: «کارت‌های محصول کلاً عوض بشه، کمی عریض‌تر (الان خیلی کوچیک
   است)، حالت شیک‌تر؛ دکمهٔ افزودن به سبد زیر هر محصول زیبا نیست — سبک و رنگ
   کاملاً عوض شود و مناسب سایت باشد».
   اصلاحات:
    ۱) گرید: دسکتاپ ۴ ستونه (به‌جای ۶ ستونهٔ فشردهٔ قدیم) → کارت‌ها ~۲۶۰px
    ۲) کارت: قاب گرم ظریف، تصویر روی پس‌زمینهٔ کرم، سایه و هاور لطیف
    ۳) دکمهٔ سبد: دکمهٔ دومنطقه‌ای کهربایی (چیپ آیکون + متن) — هویت جدید
   ============================================================================ */

/* ---------- ۲۲.۱ گرید عریض ---------- */
.shop-products-wrapper ul.products,
.shop-products-wrapper .woocommerce ul.products,
.woocommerce .shop-products-wrapper ul.products {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 18px 14px !important;
}
@media (max-width: 1399px) {
    .shop-products-wrapper ul.products,
    .shop-products-wrapper .woocommerce ul.products,
    .woocommerce .shop-products-wrapper ul.products {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
}
@media (max-width: 1199px) {
    .shop-products-wrapper ul.products,
    .shop-products-wrapper .woocommerce ul.products,
    .woocommerce .shop-products-wrapper ul.products {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 14px 12px !important;
    }
}
@media (max-width: 767px) {
    .shop-products-wrapper ul.products,
    .shop-products-wrapper .woocommerce ul.products,
    .woocommerce .shop-products-wrapper ul.products {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px 10px !important;
    }
}

/* ---------- ۲۲.۲ کارت مدرن ---------- */
.shop-products-wrapper ul.products li.product,
.shop-products-wrapper .product-card-modern,
.product-card-modern {
    border-radius: 18px;
    border: 1px solid #EDE7DE;
    background: linear-gradient(180deg, #FFFFFF 0%, #FDFCFA 100%);
    box-shadow: 0 2px 10px -4px rgba(28, 25, 23, 0.06);
    transition: transform 0.35s cubic-bezier(0.34, 1.3, 0.5, 1), box-shadow 0.3s ease, border-color 0.25s ease;
}
.shop-products-wrapper ul.products li.product:hover,
.shop-products-wrapper .product-card-modern:hover,
.product-card-modern:hover {
    transform: translateY(-5px);
    border-color: rgba(244, 123, 32, 0.38);
    box-shadow: 0 26px 48px -18px rgba(28, 25, 23, 0.22), 0 6px 16px -8px rgba(244, 123, 32, 0.18);
}
/* تصویر روی کرم گرم (هماهنگ با تم) */
.shop-products-wrapper .pcm-image-wrap,
.pcm-image-wrap {
    background: linear-gradient(180deg, #FBF8F4 0%, #F4EEE6 100%) !important;
    border-bottom: 1px solid #F1EBE2;
}
.shop-products-wrapper .pcm-image,
.pcm-image {
    padding: 0 !important;
    object-fit: cover;
}
/* برند و عنوان */
.shop-products-wrapper .pcm-brand,
.pcm-brand {
    font-size: 10px !important;
    color: #C2703A !important;
    letter-spacing: 0.4px;
    margin-bottom: 4px !important;
}
.shop-products-wrapper .pcm-title,
.pcm-title {
    font-size: 13px !important;
    margin-bottom: 4px !important;
}
.shop-products-wrapper .pcm-title a,
.pcm-title a {
    color: #292524;
    line-height: 1.75;
    min-height: 44px;
}
.shop-products-wrapper .pcm-title a:hover,
.pcm-title a:hover {
    color: #D9660F !important;
}
/* قیمت */
.shop-products-wrapper .pcm-price-wrap .price,
.shop-products-wrapper .pcm-price-wrap .amount,
.pcm-price-wrap .price,
.pcm-price-wrap .amount {
    font-size: 15.5px !important;
    color: #1C1917 !important;
    font-weight: 800 !important;
}
.shop-products-wrapper .pcm-price-wrap .price del,
.shop-products-wrapper .pcm-price-wrap del .amount {
    font-size: 10.5px !important;
    color: #A8A29E !important;
}
.shop-products-wrapper .pcm-price-wrap .price ins,
.shop-products-wrapper .pcm-price-wrap ins .amount {
    color: #EA580C !important;
}
/* محتوای کارت */
.shop-products-wrapper .pcm-content,
.pcm-content {
    padding: 12px 12px 14px !important;
}

/* ---------- ۲۲.۳ دکمهٔ سبد خرید — هویت جدید (دومنطقه‌ای کهربایی) ---------- */
.shop-products-wrapper .pcm-add-to-cart,
.pcm-add-to-cart {
    width: 100%;
    height: 46px;
    padding: 0 5px !important;
    border-radius: 13px;
    background: linear-gradient(135deg, #FB923C 0%, #F47B20 45%, #E8670C 100%) !important;
    color: #FFFFFF !important;
    font-family: inherit;
    font-size: 12.5px !important;
    font-weight: 800 !important;
    letter-spacing: 0.1px;
    cursor: pointer;
    text-decoration: none;
    border: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    box-shadow: 0 12px 24px -10px rgba(244, 123, 32, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.35);
    transition: transform 0.2s cubic-bezier(0.34, 1.4, 0.5, 1), box-shadow 0.22s ease, filter 0.2s ease;
}
/* چیپ آیکون سبد — سطح شیشه‌ای روشن */
.pcm-atc-ico {
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.24);
    border: 1px solid rgba(255, 255, 255, 0.38);
    color: #FFFFFF;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    transition: transform 0.2s cubic-bezier(0.34, 1.4, 0.5, 1), background 0.2s ease;
}
.pcm-atc-txt {
    flex: 1;
    min-width: 0;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-inline-end: 6px;
}
.shop-products-wrapper .pcm-add-to-cart:hover,
.pcm-add-to-cart:hover {
    background: linear-gradient(135deg, #F97316 0%, #EA580C 55%, #C2410C 100%) !important;
    color: #FFFFFF !important;
    transform: translateY(-2px);
    box-shadow: 0 18px 34px -12px rgba(234, 88, 12, 0.65), inset 0 1px 0 rgba(255, 255, 255, 0.35);
    filter: saturate(1.05);
}
.pcm-add-to-cart:hover .pcm-atc-ico {
    background: rgba(255, 255, 255, 0.34);
    transform: scale(1.06);
}
/* حالت «اضافه شد» */
.shop-products-wrapper .pcm-add-to-cart.added,
.pcm-add-to-cart.added {
    background: linear-gradient(135deg, #16A34A 0%, #15803D 100%) !important;
    box-shadow: 0 12px 24px -10px rgba(22, 163, 74, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.3);
}
/* حالت بارگذاری */
.pcm-add-to-cart.loading {
    pointer-events: none;
    opacity: 0.75;
    filter: saturate(0.6);
}
/* ناموجود */
.shop-products-wrapper .pcm-add-to-cart.pcm-out-of-stock,
.pcm-add-to-cart.pcm-out-of-stock {
    background: #F1EDE6 !important;
    color: #78716C !important;
    box-shadow: none;
    border: 1px dashed #D6CFC4;
}
.pcm-add-to-cart.pcm-out-of-stock .pcm-atc-ico {
    background: rgba(120, 113, 108, 0.12);
    border-color: rgba(120, 113, 108, 0.25);
    color: #78716C;
}
/* آیکون‌های سریع: گردتر و گرم‌تر */
.shop-products-wrapper .pcm-quick-btn,
.pcm-quick-btn {
    width: 34px !important;
    height: 34px !important;
    border-radius: 10px !important;
    color: #78716C !important;
    background: rgba(255, 252, 248, 0.96) !important;
    border: 1px solid #EDE7DE !important;
    box-shadow: 0 4px 12px -4px rgba(28, 25, 23, 0.16);
}
.pcm-quick-btn:hover {
    background: linear-gradient(135deg, #F97316, #EA580C) !important;
    color: #fff !important;
    border-color: transparent !important;
    transform: translateY(-1px) scale(1.06);
}
/* بج تخفیف کهربایی */
.pcm-badge-sale {
    background: linear-gradient(135deg, #FB923C, #EA580C) !important;
    font-size: 11px !important;
    padding: 3px 9px !important;
}

/* ---------- ۲۲.۴ موبایل: دکمهٔ درشت‌تر لمس‌پذیر ---------- */
@media (max-width: 767px) {
    .shop-products-wrapper .pcm-add-to-cart,
    .pcm-add-to-cart {
        height: 44px;
        font-size: 11.5px !important;
        border-radius: 12px;
    }
    .pcm-atc-ico {
        width: 32px;
        height: 32px;
        font-size: 13px;
    }
    .shop-products-wrapper .pcm-title a,
    .pcm-title a {
        min-height: 40px;
        font-size: 12px !important;
    }
    .shop-products-wrapper .pcm-price-wrap .price,
    .shop-products-wrapper .pcm-price-wrap .amount {
        font-size: 14px !important;
    }
}
@media (max-width: 360px) {
    .shop-products-wrapper ul.products,
    .shop-products-wrapper .woocommerce ul.products,
    .woocommerce .shop-products-wrapper ul.products {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

/* ==========================================================================
   v6.9.0 — «یک سایز بکسان» تصاویر کارت‌ها (نسخهٔ نهایی و بدون برش ناقص)
   قاعدهٔ cover تضمین می‌کند همهٔ تصاویر کارت‌ها دقیقاً هم‌اندازه دیده شوند:
   کادر مربعی + پرشدن کامل کادر — دیگر تصویری کوچک‌تر/بزرگ‌تر دیده نمی‌شود.
   (نسخهٔ v6.8.0 با contain باعث حاشیهٔ سفید و «بزرگ‌وکوچک دیده‌شدن» می‌شد.)
   ========================================================================== */
.shop-products-wrapper .pcm-image-wrap,
.pcm-image-wrap {
    aspect-ratio: 1 / 1;
    position: relative;
    overflow: hidden;
}

.shop-products-wrapper .pcm-image-link,
.pcm-image-link {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.shop-products-wrapper .pcm-image,
.pcm-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    padding: 0 !important;
}

/* نمای لیستی: کادر افقی هم‌ارتفاع */
.shop-products-wrapper.list-view .pcm-image-wrap {
    aspect-ratio: auto;
    height: 100%;
    min-height: 200px;
}
.shop-products-wrapper.list-view .pcm-image {
    object-fit: cover;
}

/* کارت‌های پیشنهاد شگفت‌انگیز صفحه اصلی — هم‌اندازه */
.abz-offer6 .abz-o6-media img,
.abz-offer6 .abz-o6-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


/* ============================================================================
   v6.13.0 — هیرو بنر رنگی صفحهٔ فروشگاه (abz-shop-hero)
   گرادیان صنعتی تیره + درخشش کهربایی + جستجو + آمار + تصویر محصول
   ============================================================================ */
.abz-shop-hero {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(900px 400px at 88% -12%, rgba(234, 88, 12, 0.32), transparent 64%),
        radial-gradient(700px 380px at 6% 110%, rgba(120, 53, 15, 0.35), transparent 60%),
        linear-gradient(158deg, #17120E 0%, #241C15 48%, #33251A 100%);
    padding: clamp(30px, 4.5vw, 58px) 0 clamp(32px, 4vw, 52px);
    font-family: 'Vazirmatn', -apple-system, 'Segoe UI', Tahoma, sans-serif;
}

.abz-shop-hero-bg {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(253, 186, 116, 0.07) 1px, transparent 1.5px);
    background-size: 24px 24px;
    pointer-events: none;
}

.abz-shop-hero-inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr);
    gap: clamp(18px, 3vw, 40px);
    align-items: center;
}

/* --- متن --- */
.abz-shop-hero-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 11.5px;
    font-weight: 800;
    color: #FDBA74;
    background: rgba(253, 186, 116, 0.1);
    border: 1px solid rgba(253, 186, 116, 0.26);
    border-radius: 999px;
    padding: 7px 14px;
    margin-bottom: 16px;
}

.abz-shop-hero-title {
    font-size: clamp(22px, 3.4vw, 34px);
    font-weight: 900;
    line-height: 1.65;
    color: #FFFAF2;
    margin: 0 0 12px;
}

.abz-shop-hero-hl {
    display: block;
    background: linear-gradient(120deg, #FDBA74 0%, #F97316 55%, #FB923C 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.abz-shop-hero-desc {
    font-size: 13.5px;
    line-height: 2.1;
    color: rgba(255, 250, 242, 0.7);
    margin: 0 0 22px;
    max-width: 56ch;
}

/* --- جستجو --- */
.abz-shop-hero-search {
    display: flex;
    align-items: center;
    gap: 4px;
    background: rgba(255, 255, 255, 0.96);
    border-radius: 15px;
    padding: 6px 6px 6px 14px;
    box-shadow: 0 24px 54px -22px rgba(0, 0, 0, 0.65);
    max-width: 560px;
    margin-bottom: 22px;
}

[dir="rtl"] .abz-shop-hero-search { padding: 6px 14px 6px 6px; }

.abz-shop-hero-search > i {
    color: #EA580C;
    font-size: 15px;
    flex-shrink: 0;
}

.abz-shop-hero-search input {
    flex: 1;
    min-width: 0;
    border: 0;
    outline: none;
    background: transparent;
    font-family: inherit;
    font-size: 13.5px;
    font-weight: 600;
    color: #1C1917;
    height: 44px;
    padding: 0 12px;
}

.abz-shop-hero-search input::placeholder { color: #A8A29E; font-weight: 500; }

.abz-shop-hero-search button {
    border: 0;
    border-radius: 11px;
    height: 44px;
    padding: 0 24px;
    font-family: inherit;
    font-size: 13.5px;
    font-weight: 900;
    color: #fff;
    background: linear-gradient(135deg, #EA580C, #C2410C);
    cursor: pointer;
    transition: filter 0.2s ease, transform 0.2s ease;
    flex-shrink: 0;
}

.abz-shop-hero-search button:hover { filter: brightness(1.08); transform: translateY(-1px); }

/* --- آمار --- */
.abz-shop-hero-stats {
    display: flex;
    gap: clamp(14px, 2.6vw, 34px);
    flex-wrap: wrap;
}

.abz-shop-stat b {
    display: block;
    font-size: clamp(19px, 2.4vw, 25px);
    font-weight: 900;
    color: #FDBA74;
    line-height: 1.5;
}

.abz-shop-stat span {
    font-size: 11.5px;
    font-weight: 700;
    color: rgba(255, 250, 242, 0.58);
}

/* --- تصویر --- */
.abz-shop-hero-art {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 300px;
}

.abz-shop-hero-art > img {
    position: relative;
    z-index: 2;
    max-width: 100%;
    max-height: 340px;
    object-fit: contain;
    filter: drop-shadow(0 30px 40px rgba(0, 0, 0, 0.5));
    animation: abzShopFloat 5.5s ease-in-out infinite;
}

@keyframes abzShopFloat {
    0%, 100% { transform: translateY(0) rotate(-1deg); }
    50% { transform: translateY(-12px) rotate(1deg); }
}

.abz-shop-hero-ring {
    position: absolute;
    width: 240px;
    height: 240px;
    border-radius: 50%;
    border: 1.5px dashed rgba(253, 186, 116, 0.3);
    animation: abzShopSpin 26s linear infinite;
}

.abz-shop-hero-ring-2 {
    width: 330px;
    height: 330px;
    border-color: rgba(253, 186, 116, 0.16);
    animation-duration: 40s;
    animation-direction: reverse;
}

@keyframes abzShopSpin { to { transform: rotate(360deg); } }

.abz-shop-hero-chip {
    position: absolute;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 11px;
    font-weight: 800;
    color: #1C1917;
    background: rgba(255, 255, 255, 0.95);
    border-radius: 999px;
    padding: 8px 14px;
    box-shadow: 0 12px 26px -12px rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    white-space: nowrap;
}

.abz-shop-hero-chip i { color: #EA580C; }
.abz-shop-hero-chip-1 { top: 14%; inset-inline-start: 2%; }
.abz-shop-hero-chip-2 { bottom: 20%; inset-inline-start: -2%; }
.abz-shop-hero-chip-3 { top: 8%; inset-inline-end: 0%; }

@media (max-width: 900px) {
    .abz-shop-hero-inner { grid-template-columns: 1fr; }
    .abz-shop-hero-art { min-height: 230px; order: -1; }
    .abz-shop-hero-art > img { max-height: 240px; }
    .abz-shop-hero-ring { width: 180px; height: 180px; }
    .abz-shop-hero-ring-2 { width: 250px; height: 250px; }
}

@media (max-width: 560px) {
    .abz-shop-hero-search { flex-wrap: nowrap; }
    .abz-shop-hero-search button { padding: 0 16px; }
    .abz-shop-hero-chip-2 { display: none; }
    .abz-shop-hero-chip-1 { inset-inline-start: 0; }
}