/* Mobile Search Styles */

/* Search modal styling */
#mobileSearchModal .modal-content {
    background-color: #f8f9fa;
    border-radius: 0;
}

#mobileSearchModal .modal-header {
    background: linear-gradient(to right, #2e0854, #4b0082);
    color: white;
    border-bottom: none;
}

#mobileSearchModal .btn-close {
    filter: invert(1) brightness(200%);
}

#mobileSearchModal .form-control:focus {
    border-color: #4b0082;
    box-shadow: 0 0 0 0.25rem rgba(75, 0, 130, 0.25);
}

/* Search results styling */
.search-result-img {
    width: 40px;
    height: 40px;
    object-fit: contain;
}

.search-categories .btn-outline-primary {
    color: #4b0082;
    border-color: #4b0082;
}

.search-categories .btn-outline-primary:hover {
    background-color: #4b0082;
    color: white;
}

/* Mobile search button styling */
#mobile-search-btn {
    border-radius: 50%;
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    background-color: transparent;
    border-color: rgba(255, 255, 255, 0.5);
}

#mobile-search-btn:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

/* List group styling */
.list-group-item-action:hover {
    background-color: rgba(75, 0, 130, 0.05);
}

@media (max-width: 576px) {
    #mobileSearchModal .modal-dialog {
        margin: 0;
    }
}