/**
 * Custom styles for 404 and Search pages
 */

/* Common styles for both pages */
.bg-light-purple {
    background-color: #f6eaf5 !important;
}

.text-magenta {
    color: #8509B9 !important;
}

/* 404 Page Styles */
.error-404 {
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

.hover-bg-light-purple:hover {
    background-color: #f6eaf5;
    transition: background-color 0.3s ease;
}

/* Search Page Styles */
.search-header {
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
}

.search-result-item {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    border-color: #e9ecef !important;
}

.search-result-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);
}

.search-highlight {
    background-color: rgba(255, 126, 11, 0.2);
    padding: 0 2px;
    border-radius: 2px;
}

/* Search form styling */
.search-form .form-control {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    height: 48px;
    border-color: #ced4da;
}

.search-form .form-control:focus {
    border-color: #411A50;
    box-shadow: 0 0 0 0.25rem rgba(65, 26, 80, 0.25);
}

.search-form .btn {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    height: 48px;
}

/* Pagination styling */
.pagination .page-link {
    color: var(--primary-color, #411A50);
    border-color: #dee2e6;
    margin: 0 3px;
    border-radius: 4px;
}

.pagination .page-item.active .page-link {
    background-color: var(--primary-color, #411A50);
    border-color: var(--primary-color, #411A50);
}

.pagination .page-link:hover {
    background-color: #f6eaf5;
    color: var(--primary-color, #411A50);
}

/* Post type badges */
.post-type-badge {
    display: inline-flex;
    align-items: center;
    font-size: 0.75rem;
    font-weight: 600;
}

/* Responsive adjustments */
@media (max-width: 767.98px) {
    .search-header {
        padding: 1.5rem !important;
    }
    
    .search-result-item {
        padding: 1rem !important;
    }
    
    .pagination .page-link {
        padding: 0.375rem 0.5rem;
        font-size: 0.875rem;
    }
}