/* Shop filter sidebar (desktop)
   Moved out of the inline <style> in resources/views/front/filter_category/filter_category.blade.php
   Shared partial: included by shop-left-sidebar. */

/* .widget and .widget_title are also used by the footer, product detail and
   the my-account sidebar, so every rule below is scoped to .cat_sidebar.
   Unscoped rules here would silently restyle those pages.

   Soft rounded cards on the warm ivory/gold palette from _nav.blade.php -
   shadow instead of border, sentence-case headings, gold accents. */

.cat_sidebar {
    --flt-muted: #7d7468;
    --flt-shadow: 0 2px 10px rgba(21, 43, 57, .06), 0 1px 3px rgba(21, 43, 57, .04);
}

.filter_price .ui-slider .ui-slider-range {
    background-color: var(--gold, #B58A46);
}

/* The grid/list toggle sits outside the sidebar - leave it unscoped. */
.shorting_icon.active {
    background-color: #152B39;
    border-color: #152B39;
}

.cat_sidebar .widget {
    background: #fff;
    border: 0;
    border-radius: 14px;
    box-shadow: var(--flt-shadow);
    padding: 24px;
    margin-bottom: 18px;
}

/* The button block is the last widget - no panel behind it, so the page
   does not end on yet another box. */
.cat_sidebar .widget:last-child {
    margin-bottom: 0;
    background: transparent;
    box-shadow: none;
    padding: 0;
}

/* Sentence case with a short gold rule, not an uppercase micro-label. */
.cat_sidebar .widget_title {
    font-size: 18px;
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
    color: var(--ink, #152B39);
    margin-bottom: 18px;
    padding-bottom: 12px;
    position: relative;
}

.cat_sidebar .widget_title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 34px;
    height: 2px;
    background: var(--gold, #B58A46);
}

/* Long category lists were pushing the price slider and Apply button off
   the bottom of the page. */
.cat_sidebar .widget_categories {
    margin-bottom: 0;
    padding-left: 0;
    max-height: 320px;
    overflow-y: auto;
}

.cat_sidebar .custom-control-label {
    font-size: 15px;
    color: #55606a;
    cursor: pointer;
    padding-top: 1px;
}

.cat_sidebar .custom-control-label:hover {
    color: var(--ink, #152B39);
}

.cat_sidebar .custom-control-input:checked ~ .custom-control-label {
    color: var(--ink, #152B39);
    font-weight: 500;
}

.cat_sidebar .custom-control-input:checked ~ .custom-control-label::before {
    background-color: var(--gold, #B58A46);
    border-color: var(--gold, #B58A46);
}

.cat_sidebar .filter_price {
    padding-top: 4px;
}

.cat_sidebar .price_range {
    margin-top: 18px;
    font-size: 15px;
    color: var(--flt-muted);
}

/* .btn-fill-out animates two sliding halves via ::before/::after;
   overflow:hidden clips them to the rounded corners. */
.cat_sidebar .btn_filter.btn-fill-out {
    border-radius: 14px;
    border-color: var(--ink, #152B39);
    padding: 13px 20px;
    font-size: 15px;
    font-weight: 500;
    text-transform: none;
}

.cat_sidebar .btn-fill-out::before,
.cat_sidebar .btn-fill-out::after {
    background-color: var(--ink, #152B39);
}

.cat_sidebar .btn_filter.btn-fill-out:hover {
    border-color: var(--gold, #B58A46);
}

.cat_sidebar .btn_filter.btn-fill-out:hover::before,
.cat_sidebar .btn_filter.btn-fill-out:hover::after {
    background-color: var(--gold, #B58A46);
}

.cat_sidebar .resetfilter {
    margin-top: 12px !important;
    font-size: 15px;
    color: var(--flt-muted) !important;
    padding: 4px;
}

.cat_sidebar .resetfilter:hover {
    color: var(--gold, #B58A46) !important;
}

.cat_sidebar .resetfilter i {
    margin-right: 6px;
}