/**
 * Hedine - Visual Filter Styling
 * 
 * Unified styles for WPC product filters.
 * Ensures consistent typography and styling across all filter types.
 * 
 * Visual swatch filters (grid layout):
 * - pa_shape (Center Stone Shape) - 3 column grid
 * - pa_metal_type (Metal Type) - 3 column grid
 * 
 * Checkbox/list filters (consistent typography):
 * - pa_stone_family (Primary Stone)
 * - pa_ring_style (Ring Style)
 * - pa_primary_stone_size (Stone Size)
 * - pa_jewelry_state (Jewelry State)
 * - pa_jewelry_style (Jewelry Style)
 * - pa_finish (Surface Finish)
 * 
 * @package Hedine_Stuller_Sync
 */

/* ==========================================================================
   BASE STYLES - Apply to ALL WPC filters for consistent typography
   ========================================================================== */

/* Filter section container */
.wpc-filters-section {
    margin-bottom: 0 !important;
    border-bottom: 1px solid #f0f0f0 !important;
}

.wpc-filters-section:last-child {
    border-bottom: none !important;
}

/* Filter header - consistent across all filters */
.wpc-filters-section .wpc-filter-header {
    padding: 10px 12px !important;
    border-bottom: 1px solid #eee !important;
    background: #fff !important;
}

.wpc-filters-section .wpc-filter-title {
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: #333 !important;
    margin: 0 !important;
    line-height: 1.4 !important;
}

/* Filter content area */
.wpc-filters-section .wpc-filter-content {
    padding: 8px 12px !important;
}

/* Base list reset */
.wpc-filters-section ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.wpc-filters-section li {
    list-style: none !important;
    margin: 0 0 4px 0 !important;
    padding: 0 !important;
}

.wpc-filters-section li:last-child {
    margin-bottom: 0 !important;
}

/* Base link styling */
.wpc-filters-section .wpc-filter-link {
    text-decoration: none !important;
    color: #444 !important;
    transition: color 0.15s ease !important;
}

.wpc-filters-section .wpc-filter-link:hover {
    color: #222 !important;
}

/* Term count - consistent styling */
.wpc-filters-section .wpc-term-count {
    font-size: 10px !important;
    color: #999 !important;
    margin-left: 4px !important;
}

.wpc-filters-section .wpc-term-count span {
    font-size: 10px !important;
}

/* Zero count items - grayed out */
.wpc-filters-section .wpc-term-count-0 {
    opacity: 0.5 !important;
}

.wpc-filters-section .wpc-term-count-0:hover {
    opacity: 0.7 !important;
}

/* Selected state - gold accent */
.wpc-filters-section .wpc-term-selected .wpc-filter-link,
.wpc-filters-section .wpc-term-selected .wpc-term-name {
    color: #B8860B !important;
    font-weight: 600 !important;
}

/* ==========================================================================
   SHARED STYLES - Apply to all visual swatch filters
   ========================================================================== */

/* Filter content container */
.wpc-filter-pa_shape .wpc-filter-content,
.wpc-filter-pa_metal_type .wpc-filter-content {
    padding: 0 !important;
    max-height: none !important;
    overflow: visible !important;
}

/* Individual items - reset defaults */
.wpc-filter-pa_shape .wpc-term-item,
.wpc-filter-pa_metal_type .wpc-term-item {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    width: 100% !important;
    float: none !important;
}

/* Content wrapper */
.wpc-filter-pa_shape .wpc-term-item-content-wrapper,
.wpc-filter-pa_metal_type .wpc-term-item-content-wrapper {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    position: relative !important;
    height: 100% !important;
}

/* Hide radio/checkbox but keep accessible */
.wpc-filter-pa_shape .wpc-term-item input[type="checkbox"],
.wpc-filter-pa_shape .wpc-term-item input[type="radio"],
.wpc-filter-pa_metal_type .wpc-term-item input[type="checkbox"],
.wpc-filter-pa_metal_type .wpc-term-item input[type="radio"] {
    position: absolute !important;
    opacity: 0 !important;
    width: 100% !important;
    height: 100% !important;
    cursor: pointer !important;
    z-index: 10 !important;
    margin: 0 !important;
    top: 0 !important;
    left: 0 !important;
}

/* Label as clickable card */
.wpc-filter-pa_shape .wpc-term-item label,
.wpc-filter-pa_metal_type .wpc-term-item label {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 12px 4px 10px !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    background: #f8f8f8 !important;
    border: 2px solid #eee !important;
    width: 100% !important;
    box-sizing: border-box !important;
    position: relative !important;
    /* Hide &nbsp; text nodes */
    font-size: 0 !important;
    line-height: 0 !important;
}

.wpc-filter-pa_shape .wpc-term-item label:hover,
.wpc-filter-pa_metal_type .wpc-term-item label:hover {
    background: #fff !important;
    border-color: #ccc !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
}

/* Selected state - gold accent */
.wpc-filter-pa_shape .wpc-term-item input:checked + label,
.wpc-filter-pa_shape .wpc-term-item.wpc-term-selected label,
.wpc-filter-pa_metal_type .wpc-term-item input:checked + label,
.wpc-filter-pa_metal_type .wpc-term-item.wpc-term-selected label {
    background: #fff !important;
    border-color: #B8860B !important;
    box-shadow: 0 2px 8px rgba(184, 134, 11, 0.2) !important;
}

/* Checkmark badge */
.wpc-filter-pa_shape .wpc-term-item input:checked + label::after,
.wpc-filter-pa_shape .wpc-term-item.wpc-term-selected label::after,
.wpc-filter-pa_metal_type .wpc-term-item input:checked + label::after,
.wpc-filter-pa_metal_type .wpc-term-item.wpc-term-selected label::after {
    content: '✓' !important;
    position: absolute !important;
    top: 4px !important;
    right: 4px !important;
    width: 16px !important;
    height: 16px !important;
    background: #B8860B !important;
    color: #fff !important;
    border-radius: 50% !important;
    font-size: 9px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: bold !important;
    line-height: 1 !important;
}

/* Swatch wrapper */
.wpc-filter-pa_shape .wpc-term-swatch-wrapper,
.wpc-filter-pa_metal_type .wpc-term-swatch-wrapper {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-bottom: 6px !important;
    margin-right: 0 !important;
    position: relative !important;
    flex-shrink: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    transition: transform 0.2s ease !important;
}

/* Hover scale effect - multiple selectors for reliable triggering */
.wpc-filter-pa_shape .wpc-term-item label:hover .wpc-term-swatch-wrapper,
.wpc-filter-pa_shape .wpc-term-item:hover .wpc-term-swatch-wrapper,
.wpc-filter-pa_shape .wpc-term-item-content-wrapper:hover .wpc-term-swatch-wrapper,
.wpc-filter-pa_metal_type .wpc-term-item label:hover .wpc-term-swatch-wrapper,
.wpc-filter-pa_metal_type .wpc-term-item:hover .wpc-term-swatch-wrapper,
.wpc-filter-pa_metal_type .wpc-term-item-content-wrapper:hover .wpc-term-swatch-wrapper {
    transform: scale(1.1) !important;
}

/* Swatch image container */
.wpc-filter-pa_shape .wpc-term-swatch-image,
.wpc-filter-pa_metal_type .wpc-term-swatch-image {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: auto !important;
}

/* Swatch images */
.wpc-filter-pa_shape .wpc-term-image,
.wpc-filter-pa_metal_type .wpc-term-image {
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    pointer-events: none !important;
}

/* Placeholder for missing images */
.wpc-filter-pa_shape .wpc-no-swatch-yet,
.wpc-filter-pa_metal_type .wpc-no-swatch-yet {
    width: 36px !important;
    height: 36px !important;
    background: linear-gradient(135deg, #f0f0f0 0%, #e0e0e0 100%) !important;
    border-radius: 50% !important;
    border: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Term name */
.wpc-filter-pa_shape .wpc-term-name,
.wpc-filter-pa_metal_type .wpc-term-name {
    font-size: 11px !important;
    font-weight: 500 !important;
    color: #444 !important;
    line-height: 1.3 !important;
    text-transform: capitalize !important;
    max-width: 100% !important;
    overflow: visible !important;
    white-space: normal !important;
    word-wrap: break-word !important;
    text-align: center !important;
    display: block !important;
}

.wpc-filter-pa_shape .wpc-term-item label:hover .wpc-term-name,
.wpc-filter-pa_metal_type .wpc-term-item label:hover .wpc-term-name {
    color: #222 !important;
}

.wpc-filter-pa_shape .wpc-term-item input:checked + label .wpc-term-name,
.wpc-filter-pa_shape .wpc-term-item.wpc-term-selected .wpc-term-name,
.wpc-filter-pa_metal_type .wpc-term-item input:checked + label .wpc-term-name,
.wpc-filter-pa_metal_type .wpc-term-item.wpc-term-selected .wpc-term-name {
    color: #B8860B !important;
    font-weight: 600 !important;
}

/* Count badge - subtle */
.wpc-filter-pa_shape .wpc-term-count,
.wpc-filter-pa_metal_type .wpc-term-count {
    font-size: 9px !important;
    color: #999 !important;
    margin-top: 2px !important;
    display: block !important;
    line-height: 1.2 !important;
}

.wpc-filter-pa_shape .wpc-term-count span,
.wpc-filter-pa_metal_type .wpc-term-count span {
    font-size: 9px !important;
    line-height: 1.2 !important;
}

/* Zero count - grayed out */
.wpc-filter-pa_shape .wpc-term-count-0 label,
.wpc-filter-pa_metal_type .wpc-term-count-0 label {
    opacity: 0.4 !important;
}

.wpc-filter-pa_shape .wpc-term-count-0 label:hover,
.wpc-filter-pa_metal_type .wpc-term-count-0 label:hover {
    opacity: 0.6 !important;
}

/* Filter header */
.wpc-filter-pa_shape .wpc-filter-header,
.wpc-filter-pa_metal_type .wpc-filter-header {
    padding: 10px 12px !important;
    border-bottom: 1px solid #eee !important;
    background: #fff !important;
}

.wpc-filter-pa_shape .wpc-filter-title,
.wpc-filter-pa_metal_type .wpc-filter-title {
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: #333 !important;
    margin: 0 !important;
}

/* Link styling */
.wpc-filter-pa_shape .wpc-filter-link,
.wpc-filter-pa_metal_type .wpc-filter-link {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-decoration: none !important;
    color: inherit !important;
}

/* Restore font-size for child elements (hidden &nbsp; fix) */
.wpc-filter-pa_shape .wpc-term-item label > *,
.wpc-filter-pa_shape .wpc-term-item label a,
.wpc-filter-pa_shape .wpc-term-item label span,
.wpc-filter-pa_metal_type .wpc-term-item label > *,
.wpc-filter-pa_metal_type .wpc-term-item label a,
.wpc-filter-pa_metal_type .wpc-term-item label span {
    font-size: 11px !important;
    line-height: 1.3 !important;
}

/* Reset list styles */
.wpc-filter-pa_shape ul,
.wpc-filter-pa_shape li,
.wpc-filter-pa_metal_type ul,
.wpc-filter-pa_metal_type li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ==========================================================================
   SHAPE FILTER - 3 Column Grid
   ========================================================================== */

.wpc-filter-pa_shape .wpc-filters-ul-list {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px !important;
    padding: 12px !important;
    margin: 0 !important;
}

.wpc-filter-pa_shape .wpc-term-item label {
    min-height: 90px !important;
}

.wpc-filter-pa_shape .wpc-term-swatch-wrapper {
    width: 44px !important;
    height: 44px !important;
}

.wpc-filter-pa_shape .wpc-term-image {
    width: 40px !important;
    height: 40px !important;
}

.wpc-filter-pa_shape .wpc-no-swatch-yet::before {
    content: '◇' !important;
    font-size: 22px !important;
    color: #aaa !important;
}

/* Center items in grid */
.wpc-filter-pa_shape li.wpc-term-item a {
    margin: auto !important;
}

/* ==========================================================================
   METAL TYPE FILTER - 3 Column Grid
   ========================================================================== */

.wpc-filter-pa_metal_type .wpc-filters-ul-list {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px !important;
    padding: 12px !important;
    margin: 0 !important;
    align-items: stretch !important;
}

/* Ensure items stretch to match row height */
.wpc-filter-pa_metal_type .wpc-term-item {
    height: 100% !important;
}

.wpc-filter-pa_metal_type .wpc-term-item-content-wrapper {
    height: 100% !important;
}

.wpc-filter-pa_metal_type .wpc-term-item label {
    min-height: 85px !important;
    height: 100% !important;
    padding: 10px 4px 8px !important;
}

/* Metal swatches - circular gradient images */
.wpc-filter-pa_metal_type .wpc-term-swatch-wrapper {
    width: 36px !important;
    height: 36px !important;
}

.wpc-filter-pa_metal_type .wpc-term-image {
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) !important;
}

/* Placeholder for missing metal images */
.wpc-filter-pa_metal_type .wpc-no-swatch-yet::before {
    content: '●' !important;
    font-size: 18px !important;
    color: #ccc !important;
}

/* Metal names - smaller for 4-col layout */
.wpc-filter-pa_metal_type .wpc-term-name {
    font-size: 10px !important;
}

.wpc-filter-pa_metal_type .wpc-term-item label > *,
.wpc-filter-pa_metal_type .wpc-term-item label span {
    font-size: 10px !important;
}

/* Center items */
.wpc-filter-pa_metal_type li.wpc-term-item a {
    margin: auto !important;
}

/* ==========================================================================
   RESPONSIVE - Stack on smaller screens
   ========================================================================== */

@media (max-width: 400px) {
    .wpc-filter-pa_shape .wpc-filters-ul-list {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    
    .wpc-filter-pa_metal_type .wpc-filters-ul-list {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* ==========================================================================
   FORCE GRID - Override any inline styles
   ========================================================================== */

.wpc-filter-pa_shape .wpc-filters-ul-list[style],
.wpc-filter-pa_metal_type .wpc-filters-ul-list[style] {
    display: grid !important;
}

.wpc-filter-pa_shape .wpc-filters-ul-list > li,
.wpc-filter-pa_metal_type .wpc-filters-ul-list > li {
    display: block !important;
    float: none !important;
    width: 100% !important;
}

/* ==========================================================================
   STONE FAMILY FILTER - Checkbox List with Image Swatches
   Keeps the checkbox list layout but with matching typography
   ========================================================================== */

/* Filter header - match other filters */
.wpc-filter-pa_stone_family .wpc-filter-header {
    padding: 10px 12px !important;
    border-bottom: 1px solid #eee !important;
    background: #fff !important;
}

.wpc-filter-pa_stone_family .wpc-filter-title {
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: #333 !important;
    margin: 0 !important;
}

/* Filter content container */
.wpc-filter-pa_stone_family .wpc-filter-content {
    padding: 8px 12px !important;
}

/* Reset list styles */
.wpc-filter-pa_stone_family .wpc-filters-ul-list {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Individual checkbox items */
.wpc-filter-pa_stone_family .wpc-checkbox-item {
    list-style: none !important;
    margin: 0 0 6px 0 !important;
    padding: 0 !important;
}

.wpc-filter-pa_stone_family .wpc-checkbox-item:last-child {
    margin-bottom: 0 !important;
}

/* Content wrapper - flex row layout */
.wpc-filter-pa_stone_family .wpc-term-item-content-wrapper {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 2px 8px !important;
    border-radius: 6px !important;
    transition: background-color 0.15s ease !important;
}

.wpc-filter-pa_stone_family .wpc-term-item-content-wrapper:hover {
    background-color: #f8f8f8 !important;
}

/* Custom checkbox styling */
.wpc-filter-pa_stone_family input[type="checkbox"] {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    width: 16px !important;
    height: 16px !important;
    min-width: 16px !important;
    border: 2px solid #ccc !important;
    border-radius: 3px !important;
    background: #fff !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
    position: relative !important;
}

.wpc-filter-pa_stone_family input[type="checkbox"]:hover {
    border-color: #999 !important;
}

.wpc-filter-pa_stone_family input[type="checkbox"]:checked {
    background: #B8860B !important;
    border-color: #B8860B !important;
}

.wpc-filter-pa_stone_family input[type="checkbox"]:checked::after {
    content: '✓' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    color: #fff !important;
    font-size: 10px !important;
    font-weight: bold !important;
    line-height: 1 !important;
}

/* Label styling */
.wpc-filter-pa_stone_family .wpc-checkbox-item label {
    display: flex !important;
    align-items: center !important;
    flex: 1 !important;
    cursor: pointer !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Link wrapper */
.wpc-filter-pa_stone_family .wpc-filter-link {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    text-decoration: none !important;
    color: inherit !important;
    flex: 1 !important;
}

/* Stone image swatch */
.wpc-filter-pa_stone_family .wpc-term-swatch-wrapper {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 28px !important;
    height: 28px !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
}

.wpc-filter-pa_stone_family .wpc-term-image {
    width: 26px !important;
    height: 26px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12) !important;
}

/* Stone name */
.wpc-filter-pa_stone_family .wpc-term-name {
    font-size: 12px !important;
    font-weight: 500 !important;
    color: #444 !important;
    line-height: 1.3 !important;
    flex: 1 !important;
}

.wpc-filter-pa_stone_family .wpc-term-item-content-wrapper:hover .wpc-term-name {
    color: #222 !important;
}

/* Selected state */
.wpc-filter-pa_stone_family .wpc-term-selected .wpc-term-name,
.wpc-filter-pa_stone_family input[type="checkbox"]:checked ~ label .wpc-term-name {
    color: #B8860B !important;
    font-weight: 600 !important;
}

/* Count badge */
.wpc-filter-pa_stone_family .wpc-term-count {
    font-size: 10px !important;
    color: #999 !important;
    margin-left: auto !important;
    flex-shrink: 0 !important;
}

.wpc-filter-pa_stone_family .wpc-term-count span {
    font-size: 10px !important;
}

/* Zero count - grayed out */
.wpc-filter-pa_stone_family .wpc-term-count-0 .wpc-term-item-content-wrapper {
    opacity: 0.5 !important;
}

.wpc-filter-pa_stone_family .wpc-term-count-0 .wpc-term-item-content-wrapper:hover {
    opacity: 0.7 !important;
}

/* Hide trailing &nbsp; */
.wpc-filter-pa_stone_family label {
    font-size: 0 !important;
}

.wpc-filter-pa_stone_family label > *,
.wpc-filter-pa_stone_family label a,
.wpc-filter-pa_stone_family label span {
    font-size: 12px !important;
}

/* ==========================================================================
   TEXT-BASED CHECKBOX FILTERS - Consistent styling for list filters
   Applies to: pa_primary_stone_size, pa_jewelry_state, pa_finish
   Note: pa_jewelry_style has its own dedicated section below with image swatches
   ========================================================================== */

/* Target all checkbox filters that are NOT the styled swatch ones */
.wpc-filter-pa_primary_stone_size .wpc-filter-content,
.wpc-filter-pa_jewelry_state .wpc-filter-content,
.wpc-filter-pa_finish .wpc-filter-content {
    padding: 8px 12px !important;
}

/* Checkbox item wrapper */
.wpc-filter-pa_primary_stone_size .wpc-checkbox-item,
.wpc-filter-pa_jewelry_state .wpc-checkbox-item,
.wpc-filter-pa_finish .wpc-checkbox-item {
    margin: 0 0 2px 0 !important;
}

/* Content wrapper - flex layout */
.wpc-filter-pa_primary_stone_size .wpc-term-item-content-wrapper,
.wpc-filter-pa_jewelry_state .wpc-term-item-content-wrapper,
.wpc-filter-pa_finish .wpc-term-item-content-wrapper {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 4px 6px !important;
    border-radius: 4px !important;
    transition: background-color 0.15s ease !important;
}

.wpc-filter-pa_primary_stone_size .wpc-term-item-content-wrapper:hover,
.wpc-filter-pa_jewelry_state .wpc-term-item-content-wrapper:hover,
.wpc-filter-pa_finish .wpc-term-item-content-wrapper:hover {
    background-color: #f8f8f8 !important;
}

/* Custom checkbox styling */
.wpc-filter-pa_primary_stone_size input[type="checkbox"],
.wpc-filter-pa_jewelry_state input[type="checkbox"],
.wpc-filter-pa_finish input[type="checkbox"] {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    width: 14px !important;
    height: 14px !important;
    min-width: 14px !important;
    border: 2px solid #ccc !important;
    border-radius: 3px !important;
    background: #fff !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
    position: relative !important;
}

.wpc-filter-pa_primary_stone_size input[type="checkbox"]:hover,
.wpc-filter-pa_jewelry_state input[type="checkbox"]:hover,
.wpc-filter-pa_finish input[type="checkbox"]:hover {
    border-color: #999 !important;
}

.wpc-filter-pa_primary_stone_size input[type="checkbox"]:checked,
.wpc-filter-pa_jewelry_state input[type="checkbox"]:checked,
.wpc-filter-pa_finish input[type="checkbox"]:checked {
    background: #B8860B !important;
    border-color: #B8860B !important;
}

.wpc-filter-pa_primary_stone_size input[type="checkbox"]:checked::after,
.wpc-filter-pa_jewelry_state input[type="checkbox"]:checked::after,
.wpc-filter-pa_finish input[type="checkbox"]:checked::after {
    content: '✓' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    color: #fff !important;
    font-size: 9px !important;
    font-weight: bold !important;
    line-height: 1 !important;
}

/* Label styling */
.wpc-filter-pa_primary_stone_size .wpc-checkbox-item label,
.wpc-filter-pa_jewelry_state .wpc-checkbox-item label,
.wpc-filter-pa_finish .wpc-checkbox-item label {
    display: flex !important;
    align-items: center !important;
    flex: 1 !important;
    cursor: pointer !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 0 !important; /* Hide &nbsp; */
}

/* Link and text */
.wpc-filter-pa_primary_stone_size .wpc-filter-link,
.wpc-filter-pa_jewelry_state .wpc-filter-link,
.wpc-filter-pa_finish .wpc-filter-link {
    font-size: 12px !important;
    font-weight: 500 !important;
    color: #444 !important;
    flex: 1 !important;
}

/* Count styling */
.wpc-filter-pa_primary_stone_size .wpc-term-count,
.wpc-filter-pa_jewelry_state .wpc-term-count,
.wpc-filter-pa_finish .wpc-term-count {
    font-size: 10px !important;
    color: #999 !important;
    margin-left: auto !important;
    flex-shrink: 0 !important;
}

/* ==========================================================================
   JEWELRY STYLE FILTER - Stuller-inspired layout with image swatches on right
   Layout: [Checkbox] [Name] [Image Swatch] [Count]
   ========================================================================== */

/* Container */
.wpc-filter-pa_jewelry_style .wpc-filter-content {
    padding: 8px 10px !important;
}

/* List reset */
.wpc-filter-pa_jewelry_style .wpc-filters-ul-list {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Each filter item row */
.wpc-filter-pa_jewelry_style .wpc-term-item {
    margin: 0 0 6px 0 !important;
    padding: 0 !important;
}

.wpc-filter-pa_jewelry_style .wpc-term-item:last-child {
    margin-bottom: 0 !important;
}

/* Content wrapper - main flex row */
.wpc-filter-pa_jewelry_style .wpc-term-item-content-wrapper {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 8px 10px !important;
    border-radius: 6px !important;
    transition: background-color 0.15s ease !important;
    min-height: 40px !important;
}

.wpc-filter-pa_jewelry_style .wpc-term-item-content-wrapper:hover {
    background-color: #f5f5f5 !important;
}

/* Checkbox/Radio styling */
.wpc-filter-pa_jewelry_style input[type="checkbox"],
.wpc-filter-pa_jewelry_style input[type="radio"] {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    width: 16px !important;
    height: 16px !important;
    min-width: 16px !important;
    max-width: 16px !important;
    border: 2px solid #ccc !important;
    border-radius: 3px !important;
    background: #fff !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
    position: relative !important;
}

.wpc-filter-pa_jewelry_style input[type="checkbox"]:hover,
.wpc-filter-pa_jewelry_style input[type="radio"]:hover {
    border-color: #999 !important;
}

.wpc-filter-pa_jewelry_style input[type="checkbox"]:checked,
.wpc-filter-pa_jewelry_style input[type="radio"]:checked {
    background: #B8860B !important;
    border-color: #B8860B !important;
}

.wpc-filter-pa_jewelry_style input[type="checkbox"]:checked::after,
.wpc-filter-pa_jewelry_style input[type="radio"]:checked::after {
    content: '✓' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    color: #fff !important;
    font-size: 10px !important;
    font-weight: bold !important;
    line-height: 1 !important;
}

/* Label - contains the link and count */
.wpc-filter-pa_jewelry_style .wpc-term-item label {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    flex: 1 !important;
    min-width: 0 !important; /* Allow flex item to shrink */
    cursor: pointer !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 0 !important; /* Hide &nbsp; */
    gap: 10px !important; /* Space between link and count */
}

/* Filter link - flex row container */
.wpc-filter-pa_jewelry_style .wpc-filter-link {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    text-decoration: none !important;
    color: inherit !important;
    gap: 12px !important;
}

/* Term name - left side, fixed minimum width */
.wpc-filter-pa_jewelry_style .wpc-term-name {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #333 !important;
    order: 1 !important;
    flex-shrink: 0 !important;
    min-width: 90px !important;
    white-space: nowrap !important;
}

.wpc-filter-pa_jewelry_style .wpc-term-item-content-wrapper:hover .wpc-term-name {
    color: #B8860B !important;
}

.wpc-filter-pa_jewelry_style .wpc-term-selected .wpc-term-name,
.wpc-filter-pa_jewelry_style input:checked ~ label .wpc-term-name {
    color: #B8860B !important;
    font-weight: 600 !important;
}

/* Swatch wrapper - RIGHT SIDE with fixed width, NO BORDER */
.wpc-filter-pa_jewelry_style .wpc-term-swatch-wrapper {
    order: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 60px !important;
    min-width: 60px !important;
    max-width: 60px !important;
    height: 24px !important;
    flex-shrink: 0 !important;
    margin-left: auto !important;
    margin-right: 0 !important;
    overflow: hidden !important;
    /* Remove any default borders from plugin */
    border: none !important;
    border-width: 0 !important;
    border-style: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

/* Also target the inner swatch span that might have borders */
.wpc-filter-pa_jewelry_style .wpc-term-swatch {
    border: none !important;
    border-width: 0 !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

/* Image swatch - both with and without image class */
.wpc-filter-pa_jewelry_style .wpc-term-swatch-image,
.wpc-filter-pa_jewelry_style .wpc-term-swatch-wrapper > span {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    overflow: hidden !important;
    border: none !important;
    background: transparent !important;
}

/* The actual image - constrained to swatch wrapper */
.wpc-filter-pa_jewelry_style .wpc-term-image {
    max-width: 60px !important;
    max-height: 22px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    opacity: 0.65 !important;
    transition: opacity 0.15s ease !important;
    border: none !important;
}

.wpc-filter-pa_jewelry_style .wpc-term-item-content-wrapper:hover .wpc-term-image {
    opacity: 1 !important;
}

.wpc-filter-pa_jewelry_style .wpc-term-selected .wpc-term-image,
.wpc-filter-pa_jewelry_style input:checked ~ label .wpc-term-image {
    opacity: 1 !important;
}

/* No swatch placeholder - hide completely */
.wpc-filter-pa_jewelry_style .wpc-no-swatch-yet {
    display: none !important;
}

/* Alternative: show empty box for missing swatches */
.wpc-filter-pa_jewelry_style .wpc-term-swatch-wrapper:not(.wpc-term-swatch-image) {
    background: transparent !important;
    border: none !important;
}

/* Count styling - far right, ensure not overlapped */
.wpc-filter-pa_jewelry_style .wpc-term-count {
    font-size: 12px !important;
    color: #888 !important;
    flex-shrink: 0 !important;
    min-width: 30px !important;
    text-align: right !important;
    margin-left: auto !important; /* Push to far right */
    background: transparent !important;
}

.wpc-filter-pa_jewelry_style .wpc-term-count span {
    font-size: inherit !important;
    color: inherit !important;
}

/* Zero count items */
.wpc-filter-pa_jewelry_style .wpc-term-count-0 .wpc-term-item-content-wrapper {
    opacity: 0.5 !important;
}

.wpc-filter-pa_jewelry_style .wpc-term-count-0 .wpc-term-item-content-wrapper:hover {
    opacity: 0.7 !important;
}

/* Selected item highlight */
.wpc-filter-pa_jewelry_style .wpc-term-selected .wpc-term-item-content-wrapper,
.wpc-filter-pa_jewelry_style .wpc-term-item:has(input:checked) .wpc-term-item-content-wrapper {
    background-color: rgba(184, 134, 11, 0.08) !important;
}

/* ==========================================================================
   LABEL FILTERS - Ring Style and similar pill/tag style filters
   ========================================================================== */

.wpc-filter-pa_ring_style .wpc-filter-content {
    padding: 10px 12px !important;
}

.wpc-filter-pa_ring_style .wpc-filters-labels {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
}

.wpc-filter-pa_ring_style .wpc-label-item {
    margin: 0 !important;
}

.wpc-filter-pa_ring_style .wpc-term-item-content-wrapper {
    display: flex !important;
    align-items: center !important;
}

/* Hide the actual checkbox input */
.wpc-filter-pa_ring_style .wpc-label-input {
    position: absolute !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
}

/* Label as pill/tag */
.wpc-filter-pa_ring_style .wpc-label-item label {
    display: inline-flex !important;
    align-items: center !important;
    cursor: pointer !important;
    margin: 0 !important;
    padding: 0 !important;
}

.wpc-filter-pa_ring_style .wpc-filter-label-wrapper {
    display: inline-flex !important;
    align-items: center !important;
    padding: 6px 12px !important;
    background: #f5f5f5 !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 20px !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    color: #444 !important;
    transition: all 0.15s ease !important;
    white-space: nowrap !important;
}

.wpc-filter-pa_ring_style .wpc-filter-label-wrapper:hover {
    background: #fff !important;
    border-color: #ccc !important;
}

.wpc-filter-pa_ring_style .wpc-filter-label-wrapper .wpc-filter-link {
    font-size: 11px !important;
    font-weight: 500 !important;
    color: inherit !important;
}

.wpc-filter-pa_ring_style .wpc-filter-label-wrapper .wpc-term-count {
    font-size: 10px !important;
    color: #888 !important;
    margin-left: 4px !important;
}

/* Selected state */
.wpc-filter-pa_ring_style .wpc-term-selected .wpc-filter-label-wrapper,
.wpc-filter-pa_ring_style .wpc-label-input:checked + label .wpc-filter-label-wrapper {
    background: #B8860B !important;
    border-color: #B8860B !important;
    color: #fff !important;
}

.wpc-filter-pa_ring_style .wpc-term-selected .wpc-filter-label-wrapper .wpc-filter-link,
.wpc-filter-pa_ring_style .wpc-label-input:checked + label .wpc-filter-label-wrapper .wpc-filter-link {
    color: #fff !important;
}

.wpc-filter-pa_ring_style .wpc-term-selected .wpc-filter-label-wrapper .wpc-term-count,
.wpc-filter-pa_ring_style .wpc-label-input:checked + label .wpc-filter-label-wrapper .wpc-term-count {
    color: rgba(255, 255, 255, 0.8) !important;
}

/* ==========================================================================
   PRICE RANGE FILTER - Consistent styling
   ========================================================================== */

.wpc-filter-_price .wpc-filter-content {
    padding: 12px !important;
}

.wpc-filter-_price .wpc-filters-range-wrapper {
    display: flex !important;
    gap: 10px !important;
    margin-bottom: 12px !important;
}

.wpc-filter-_price .wpc-filters-range-column {
    flex: 1 !important;
}

.wpc-filter-_price .wpc-filters-range-min,
.wpc-filter-_price .wpc-filters-range-max {
    width: 100% !important;
    padding: 8px 10px !important;
    border: 1px solid #ddd !important;
    border-radius: 4px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #333 !important;
    text-align: center !important;
    transition: border-color 0.15s ease !important;
}

.wpc-filter-_price .wpc-filters-range-min:focus,
.wpc-filter-_price .wpc-filters-range-max:focus {
    outline: none !important;
    border-color: #B8860B !important;
}

/* Slider styling */
.wpc-filter-_price .ui-slider {
    height: 4px !important;
    background: #e0e0e0 !important;
    border: none !important;
    border-radius: 2px !important;
}

.wpc-filter-_price .ui-slider-range {
    background: #B8860B !important;
}

.wpc-filter-_price .ui-slider-handle {
    width: 16px !important;
    height: 16px !important;
    background: #fff !important;
    border: 2px solid #B8860B !important;
    border-radius: 50% !important;
    top: -6px !important;
    cursor: pointer !important;
}

.wpc-filter-_price .ui-slider-handle:focus {
    outline: none !important;
}

/* ==========================================================================
   SEARCH FIELD - Consistent styling
   ========================================================================== */

.wpc-filter-layout-search-field .wpc-filter-content,
.wpc-filter-layout-search-field .wpc-search-field-wrapper {
    padding: 10px 12px !important;
}

.wpc-filter-layout-search-field .wpc-search-field {
    width: 100% !important;
    padding: 8px 12px 8px 32px !important;
    border: 1px solid #ddd !important;
    border-radius: 4px !important;
    font-size: 13px !important;
    color: #333 !important;
    transition: border-color 0.15s ease !important;
}

.wpc-filter-layout-search-field .wpc-search-field:focus {
    outline: none !important;
    border-color: #B8860B !important;
}

.wpc-filter-layout-search-field .wpc-search-icon {
    position: absolute !important;
    left: 22px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    color: #999 !important;
}

/* ==========================================================================
   MORE/LESS TOGGLE - For filters with many options
   ========================================================================== */

.wpc-filters-section .wpc-show-more-less {
    display: block !important;
    padding: 8px 12px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    color: #B8860B !important;
    text-decoration: none !important;
    cursor: pointer !important;
    border-top: 1px solid #f0f0f0 !important;
}

.wpc-filters-section .wpc-show-more-less:hover {
    color: #8B6914 !important;
}
