.elementor-334 .elementor-element.elementor-element-53a4065{--display:flex;--min-height:320px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--overlay-opacity:0.5;}.elementor-334 .elementor-element.elementor-element-53a4065:not(.elementor-motion-effects-element-type-background), .elementor-334 .elementor-element.elementor-element-53a4065 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://beeboon.in/wp-content/uploads/2025/05/beer-5433299_1920.webp");}.elementor-334 .elementor-element.elementor-element-53a4065::before, .elementor-334 .elementor-element.elementor-element-53a4065 > .elementor-background-video-container::before, .elementor-334 .elementor-element.elementor-element-53a4065 > .e-con-inner > .elementor-background-video-container::before, .elementor-334 .elementor-element.elementor-element-53a4065 > .elementor-background-slideshow::before, .elementor-334 .elementor-element.elementor-element-53a4065 > .e-con-inner > .elementor-background-slideshow::before, .elementor-334 .elementor-element.elementor-element-53a4065 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#000000;--background-overlay:'';}.elementor-334 .elementor-element.elementor-element-53a4065 > .elementor-shape-bottom .elementor-shape-fill, .elementor-334 .elementor-element.elementor-element-53a4065 > .e-con-inner > .elementor-shape-bottom .elementor-shape-fill{fill:#FA8E04;}.elementor-334 .elementor-element.elementor-element-53a4065 > .elementor-shape-bottom svg, .elementor-334 .elementor-element.elementor-element-53a4065 > .e-con-inner > .elementor-shape-bottom svg{height:120px;}.elementor-widget-theme-archive-title .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-334 .elementor-element.elementor-element-a7e89cd{text-align:center;}.elementor-334 .elementor-element.elementor-element-a7e89cd .elementor-heading-title{font-family:"Montaga", Sans-serif;font-weight:600;color:#FFFFFF;}.elementor-334 .elementor-element.elementor-element-ad9b852{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-334 .elementor-element.elementor-element-544d2eb{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--border-radius:20px 20px 20px 20px;box-shadow:0px 0px 10px 0px rgba(0, 0, 0, 0.25);--padding-top:10px;--padding-bottom:10px;--padding-left:10px;--padding-right:10px;}.elementor-334 .elementor-element.elementor-element-544d2eb:not(.elementor-motion-effects-element-type-background), .elementor-334 .elementor-element.elementor-element-544d2eb > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFDF8;}.elementor-334 .elementor-element.elementor-element-d45dda5{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-widget-loop-grid .elementor-pagination{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-loop-grid .elementor-button{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-loop-grid .e-load-more-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-334 .elementor-element.elementor-element-6a272be{--grid-columns:3;}.elementor-334 .elementor-element.elementor-element-6a272be .elementor-loop-container{grid-auto-rows:1fr;}.elementor-334 .elementor-element.elementor-element-6a272be .e-loop-item > .elementor-section, .elementor-334 .elementor-element.elementor-element-6a272be .e-loop-item > .elementor-section > .elementor-container, .elementor-334 .elementor-element.elementor-element-6a272be .e-loop-item > .e-con, .elementor-334 .elementor-element.elementor-element-6a272be .e-loop-item .elementor-section-wrap  > .e-con{height:100%;}@media(max-width:1024px){.elementor-334 .elementor-element.elementor-element-6a272be{--grid-columns:2;}}@media(max-width:767px){.elementor-334 .elementor-element.elementor-element-53a4065{--min-height:196px;}.elementor-334 .elementor-element.elementor-element-53a4065 > .elementor-shape-bottom svg, .elementor-334 .elementor-element.elementor-element-53a4065 > .e-con-inner > .elementor-shape-bottom svg{height:48px;}.elementor-334 .elementor-element.elementor-element-a7e89cd .elementor-heading-title{font-size:31px;}.elementor-334 .elementor-element.elementor-element-d45dda5{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-334 .elementor-element.elementor-element-6a272be{--grid-columns:2;--grid-row-gap:0px;--grid-column-gap:0px;}}@media(min-width:768px){.elementor-334 .elementor-element.elementor-element-544d2eb{--width:25%;}.elementor-334 .elementor-element.elementor-element-d45dda5{--width:75%;}}/* Start custom CSS for shortcode, class: .elementor-element-c2b6ad6 *//* --- Main Filter Container --- */
.myfilter .themify_product_filter_widget,
.myfilter form[class*="wpf-"] {
    background-color: #ffffff;
    padding: 30px 30px 30px 30px;
    border-radius: 12px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
    font-family: 'Poppins', sans-serif;
    border: 1px solid #eee;
}

/* --- Filter Section Titles --- */
.myfilter .wpf_item_name {
    font-size: 18px;
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    color: #333333;
    margin-bottom: 18px;
    padding-bottom: 12px;
    border-bottom: 1px dashed #E0E0E0;
    text-transform: capitalize;
    position: relative;
}
.myfilter .wpf_item_name::before {
    content: '';
    position: absolute;
    left: 0;
    bottom: -1px;
    width: 50px;
    height: 3px;
    background-color: #FF9800; /* Orange title accent */
    border-radius: 2px;
}

/* --- Text Input Field (Product Title Search) --- */
.myfilter .wpf_search_text_input input[type="text"],
.myfilter .wpf_autocomplete input[type="text"] {
    background-color: #F9F9F9;
    border: 1px solid #E0E0E0;
    padding: 12px 18px 12px 45px; /* Increased padding-left for icon */
    border-radius: 8px;
    font-family: 'Poppins', sans-serif;
    font-size: 15px;
    width: 100%;
    box-sizing: border-box;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
    color: #333333;
    /* SVG Search Icon (Orange: #FF9800) */
    background-image: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22%23FF9800%22%20width%3D%2218px%22%20height%3D%2218px%22%3E%3Cpath%20d%3D%22M15.5%2014h-.79l-.28-.27A6.471%206.471%200%200%200%2016%209.5%206.5%206.5%200%201%200%209.5%2016c1.61%200%203.09-.59%204.23-1.57l.27.28v.79l5%204.99L20.49%2019l-4.99-5zm-6%200C7.01%2014%205%2011.99%205%209.5S7.01%205%209.5%205%2014%207.01%2014%209.5%2011.99%2014%209.5%2014z%22%2F%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%3C%2Fsvg%3E');
    background-repeat: no-repeat;
    background-position: 15px center;
    background-size: 18px 18px;
}

.myfilter .wpf_search_text_input input[type="text"]:focus,
.myfilter .wpf_autocomplete input[type="text"]:focus {
    border-color: #FF9800;
    box-shadow: 0 0 0 3px rgba(255, 152, 0, 0.2);
    outline: none;
    background-color: #fff;
}

/* --- Filter Items List (ul containing checkboxes/radio) --- */
.myfilter .wpf_items_group,
.myfilter ul[class*="wpf_"] {
    list-style: none;
    padding-left: 0;
    margin-left: 0;
    margin-top: 10px;
}
.myfilter .wpf_items_group li,
.myfilter ul[class*="wpf_"] li {
    width: 100%;
    margin-bottom: 15px;
    position: relative;
}

/* --- Labels for Checkboxes/Radio Buttons --- */
.myfilter .wpf_items_group li label,
.myfilter ul[class*="wpf_"] li label {
    color: #555555;
    text-transform: capitalize;
    font-family: 'Poppins', sans-serif;
    font-size: 15px;
    font-weight: 400;
    display: flex;
    align-items: center;
    cursor: pointer;
    transition: color 0.3s ease;
    padding-left: 30px;
    position: relative;
}
.myfilter .wpf_items_group li label:hover,
.myfilter ul[class*="wpf_"] li label:hover {
    color: #FF9800;
}

/* --- Custom Checkboxes --- */
.myfilter .wpf_items_group li input[type="checkbox"],
.myfilter ul[class*="wpf_"] li input[type="checkbox"] {
    opacity: 0;
    position: absolute;
    width: 0;
    height: 0;
}
.myfilter .wpf_items_group li label::before, /* The box */
.myfilter ul[class*="wpf_"] li label::before {
    content: '';
    width: 20px;
    height: 20px;
    border: 2px solid #BDBDBD;
    border-radius: 5px;
    background-color: #fff;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    transition: all 0.2s ease-in-out;
}
.myfilter .wpf_items_group li label::after, /* The checkmark */
.myfilter ul[class*="wpf_"] li label::after {
    content: '✔';
    font-size: 14px;
    font-weight: bold;
    color: #fff;
    background-color: #FF9800; /* Orange checkmark background */
    width: 20px;
    height: 20px;
    border-radius: 5px;
    position: absolute;
    left: 0px;
    top: 50%;
    transform: translateY(-50%) scale(0);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s ease-in-out;
    border: 2px solid #FF9800; /* Orange border */
}
.myfilter .wpf_items_group li input[type="checkbox"]:checked + label::before,
.myfilter ul[class*="wpf_"] li input[type="checkbox"]:checked + label::before {
    border-color: #FF9800;
}
.myfilter .wpf_items_group li input[type="checkbox"]:checked + label::after,
.myfilter ul[class*="wpf_"] li input[type="checkbox"]:checked + label::after {
    transform: translateY(-50%) scale(1);
}

/* --- Product Count Badge --- */
.myfilter .wpf_item_count {
    background-color: #FFEB3B; /* Yellow background for count */
    color: #424242;
    font-size: 11px;
    font-weight: 600;
    padding: 3px 8px;
    border-radius: 10px;
    margin-left: 8px;
    line-height: 1;
}

/* --- Price Slider - MINIMALIST STYLE --- */
.myfilter .ui-widget.ui-widget-content { /* Slider track wrapper */
    border: none;
}
.myfilter .ui-slider { /* Slider track (inactive part) */
    background: #E0E0E0; /* Light grey for inactive track */
    border-radius: 3px;
    height: 6px;
    border: none;
    margin-top: 15px;
    margin-bottom: 10px;
    position: relative;
}
.myfilter .ui-widget-header { /* Slider range highlight (active part) */
    background-color: #F0B958 !important; /* Orange from your latest image */
    border-radius: 3px;
    border: none;
    height: 100%;
}
.myfilter .ui-slider-handle { /* Slider handles (dots) */
    width: 16px;
    height: 16px;
    background: #FFFFFF !important;
    border: 1px solid #D0D0D0;
    border-radius: 50% !important;
    cursor: grab;
    top: -5px !important; /* (track_height - handle_height) / 2 -> (6-16)/2 = -5 */
    margin-left: -8px; /* Half of handle width */
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
    transition: box-shadow 0.2s ease, transform 0.2s ease;
    outline: none;
}
.myfilter .ui-slider-handle:hover {
    box-shadow: 0 2px 5px rgba(0,0,0,0.3);
    transform: scale(1.1);
}
.myfilter .ui-slider-handle:active {
    cursor: grabbing;
    box-shadow: 0 1px 2px rgba(0,0,0,0.15);
}
.myfilter .wpf_slider_amount { /* Price range text below slider */
    font-size: 14px;
    color: #777777; /* Greyer text */
    font-weight: 400;
    text-align: center;
    margin-top: 12px;
}

/* --- Search/Filter Button --- */
.myfilter .wpf_search_button,
.myfilter .wpf-filter-button,
.myfilter button[type="submit"] {
    background-color: #FFEB3B !important; /* Yellow background */
    color: #424242 !important; /* Dark grey text for yellow */
    font-family: 'Poppins', sans-serif;
    font-size: 16px;
    font-weight: 700;
    padding: 14px 35px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: background-color 0.3s ease, transform 0.2s ease, box-shadow 0.3s ease;
    display: block;
    width: 100%;
    margin-top: 25px;
    box-shadow: 0 4px 10px rgba(255, 235, 59, 0.4); /* Yellow shadow */
}
.myfilter .wpf_search_button:hover,
.myfilter .wpf-filter-button:hover,
.myfilter button[type="submit"]:hover {
    background-color: #FDD835 !important; /* Slightly darker yellow on hover */
    color: #333333 !important;
    transform: translateY(-3px);
    box-shadow: 0 6px 15px rgba(255, 213, 79, 0.5);
}

/* --- Reset Button --- */
.myfilter .wpf_reset_button {
    background-color: transparent !important;
    color: #FF9800 !important; /* Orange text */
    font-family: 'Poppins', sans-serif;
    font-size: 14px;
    font-weight: 500;
    padding: 10px 20px;
    border: 2px solid #FF9800; /* Orange border */
    border-radius: 8px;
    cursor: pointer;
    text-transform: capitalize;
    transition: all 0.3s ease;
    display: block;
    width: 100%;
    margin-top: 15px;
    text-align: center;
}
.myfilter .wpf_reset_button:hover {
    background-color: #FFF3E0 !important; /* Light orange background on hover */
    color: #E65100 !important; /* Darker orange text */
    border-color: #FFA726 !important;
}

/* --- General Spacing & Structure --- */
.myfilter .wpf_item { /* Each filter group (e.g., price, category) */
    margin-bottom: 30px;
}
.myfilter .wpf_item:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}
.myfilter .wpf_item .wpf_item_name:last-child {
    border-bottom: none;
    margin-bottom: 0;
}/* End custom CSS */