/* ==================================================
   SHARED FILTER PANEL
   Used by CVE reports + Vulnerable Vendors & Products
================================================== */

.btn-custom-reset,
.btn-custom-apply {
    width: auto !important;
    min-width: 148px;
    height: 38px !important;
    padding: 0 16px !important;
    opacity: 0.90;
    border-radius: 8px !important;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 12px !important;
    font-family: "Open Sans", sans-serif;
    font-weight: 700;
    line-height: 38px;
    cursor: pointer;
    white-space: nowrap;
    background: transparent;
}

.btn-custom-apply {
    border: 1px solid #7BD084;
    color: #7BD084;
}

.btn-custom-reset {
    border: 1px solid #525F7F;
    color: #525F7F;
}

.btn-custom-apply:hover {
    background-color: rgba(123, 208, 132, 0.10);
}

.btn-custom-reset:hover {
    background-color: rgba(82, 95, 127, 0.10);
}

.btn-custom-apply svg,
.btn-custom-apply svg *,
.btn-custom-reset svg,
.btn-custom-reset svg * {
    stroke: currentColor !important;
    fill: currentColor !important;
}

.filter-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 16px;
    border: 1px solid #2C5E7D;
    color: #2C5E7D;
    font-weight: 700;
    background-color: transparent;
    border-radius: 8px;
    font-size: 15px;
    min-width: 120px;
    height: 42px;
}

.filter-content {
    display: flex;
    align-items: center;
    gap: 8px;
}

.filter-button svg {
    width: 18px;
    height: 18px;
    fill: #2C5E7D;
    flex-shrink: 0;
}

.filter-count {
    font-size: 15px;
    font-weight: 700;
    color: #2C5E7D;
    margin-left: 4px;
    display: inline-block;
}

.dropdown-menu {
    backdrop-filter: blur(8px);
    background: rgba(255, 255, 255, 0.98);
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
    max-height: 70vh;
    overflow-y: auto;
    border: 2px solid #2C5E7D;
}

.dropdown-menu.show {
    position: absolute !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.dropdown-menu .form-label {
    font-weight: 700;
    color: #17254D !important;
}

.dropdown-menu .form-control,
.dropdown-menu .form-control::placeholder,
.dropdown-menu select {
    color: #6E7B9A !important;
    border-color: #6E7B9A !important;
}

.dropdown-menu .form-control {
    background-color: #ffffff !important;
    border-width: 1.5px !important;
}

.dropdown-menu .form-control:not(:placeholder-shown) {
    color: #17254D !important;
}

.dropdown-menu .form-control:focus {
    border-color: #2C5E7D !important;
    box-shadow: 0 0 4px rgba(44, 94, 125, 0.5) !important;
}

.dropdown-menu input[type="checkbox"],
.dropdown-menu input[type="radio"] {
    accent-color: #2C5E7D !important;
}

.dropdown-menu .d-flex.mb-2 {
    align-items: center !important;
}

.datepicker {
    text-align: left;
    padding-right: 35px;
    font-size: 14px;
}

.flatpickr-input {
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none"><path d="M11 3.33919V2.00586M5 3.33919V2.00586M2.16667 5.33919H13.8333M2 6.70186C2 5.29186 2 4.58653 2.29067 4.04786C2.5535 3.5674 2.96133 3.18219 3.456 2.94719C4.02667 2.67253 4.77333 2.67253 6.26667 2.67253H9.73333C11.2267 2.67253 11.9733 2.67253 12.544 2.94719C13.046 3.18853 13.4533 3.57386 13.7093 4.04719C14 4.58719 14 5.29253 14 6.70253V9.97719C14 11.3872 14 12.0925 13.7093 12.6312C13.4465 13.1117 13.0387 13.4969 12.544 13.7319C11.9733 14.0059 11.2267 14.0059 9.73333 14.0059H6.26667C4.77333 14.0059 4.02667 14.0059 3.456 13.7312C2.96143 13.4964 2.55361 13.1114 2.29067 12.6312C2 12.0912 2 11.3859 2 9.97586V6.70186Z" stroke="%232C5E7D" stroke-width="0.75" stroke-linecap="round" stroke-linejoin="round"/></svg>') no-repeat right 10px center;
    background-size: 16px 16px;
    cursor: pointer;
}

.switch {
    position: relative;
    display: inline-block;
    width: 45px;
    height: 20px;
    margin-right: 25px !important;
}

.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.checkbox-toggle {
    position: absolute;
    cursor: pointer;
    inset: 0;
    background-color: #ccc;
    transition: 0.4s;
    border-radius: 25px;
}

.checkbox-toggle::before {
    position: absolute;
    content: "";
    height: 15px;
    width: 15px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    transition: 0.4s;
    border-radius: 50%;
}

.switch input:checked + .checkbox-toggle {
    background-color: #2C5E7D;
}

.switch input:checked + .checkbox-toggle::before {
    transform: translateX(25px);
}

@media (max-width: 576px) {
    .button-panel .dropdown-menu,
    .vvp-cve-filter-dropdown {
        width: 90vw !important;
        left: 5vw !important;
        right: auto !important;
    }
}