/* Search Autocomplete Styles */

















/* Header search container - daha spesifik seçici */

















.main-header .search-container,

















.header-main .search-container {

















    position: relative !important;

















}

















.search-dropdown {

















    position: absolute;

















    top: calc(100% + 8px);

















    left: 0;

















    right: 0;

















    min-width: 100%;

















    width: 500px;

















    max-width: 90vw;

















    background: white;

















    border-radius: 16px;

















    box-shadow: 0 10px 50px rgba(0,0,0,0.2);

















    z-index: 9999;

















    display: none;

















    max-height: 500px;

















    overflow-y: auto;

















    border: 1px solid #e0e0e0;

















}

















.search-dropdown.active {

















    display: block;

















    animation: dropdownFade 0.25s ease;

















}

















@keyframes dropdownFade {

















    from { opacity: 0; transform: translateY(-10px); }

















    to { opacity: 1; transform: translateY(0); }

















}

















/* Scrollbar styling */

















.search-dropdown::-webkit-scrollbar {

















    width: 6px;

















}

















.search-dropdown::-webkit-scrollbar-track {

















    background: #f5f5f5;

















    border-radius: 0 16px 16px 0;

















}

















.search-dropdown::-webkit-scrollbar-thumb {

















    background: #ccc;

















    border-radius: 3px;

















}

















.search-dropdown::-webkit-scrollbar-thumb:hover {

















    background: #aaa;

















}

















/* Section titles */

















.dropdown-section-title {

















    font-size: 11px;

















    font-weight: 700;

















    color: #999;

















    text-transform: uppercase;

















    letter-spacing: 0.8px;

















    padding: 14px 16px 10px;

















    background: #fafafa;

















    border-bottom: 1px solid #eee;

















    position: sticky;

















    top: 0;

















    z-index: 1;

















}

















/* History Section */

















.search-history {

















    display: none;

















}

















.search-history.has-items {

















    display: block;

















}

















.history-items {

















    padding: 8px;

















}

















.history-item {

















    display: flex;

















    align-items: center;

















    gap: 12px;

















    padding: 12px 14px;

















    cursor: pointer;

















    border-radius: 10px;

















    transition: all 0.2s;

















    text-decoration: none;

















    color: inherit;

















}

















.history-item:hover {

















    background: #f0f7f0;

















}

















.history-item > svg {

















    color: #aaa;

















    flex-shrink: 0;

















    width: 18px;

















    height: 18px;

















}

















.history-item > span:not(.remove-history) {

















    flex: 1;

















    color: #333;

















    font-size: 14px;

















}

















.history-item .remove-history {

















    flex-shrink: 0;

















    width: 28px;

















    height: 28px;

















    color: #bbb;

















    background: #f5f5f5;

















    border-radius: 50%;

















    display: flex;

















    align-items: center;

















    justify-content: center;

















    transition: all 0.2s;

















    margin-left: auto;

















}

















.history-item .remove-history svg {

















    width: 14px;

















    height: 14px;

















}

















.history-item .remove-history:hover {

















    color: white;

















    background: #e74c3c;

















}

















/* Popular Section */

















.popular-items {

















    padding: 14px;

















    display: flex;

















    flex-wrap: wrap;

















    gap: 10px;

















}

















.popular-tag {

















    display: inline-flex;

















    align-items: center;

















    gap: 6px;

















    padding: 10px 16px;

















    background: #f0f7f0;

















    color: #1a5d1a;

















    border-radius: 25px;

















    font-size: 13px;

















    font-weight: 500;

















    cursor: pointer;

















    transition: all 0.2s;

















    border: 1px solid #d4e8d4;

















    text-decoration: none;

















}

















.popular-tag:hover {

















    background: #1a5d1a;

















    color: white;

















    border-color: #1a5d1a;

















    transform: translateY(-1px);

















}

















.popular-tag svg {

















    width: 14px;

















    height: 14px;

















}

















/* Suggestions Section */

















.search-suggestions {

















    display: none;

















}

















.search-suggestions.has-items {

















    display: block;

















}

















/* Suggestion Items */

















.suggestion-item {

















    display: flex;

















    align-items: center;

















    gap: 14px;

















    padding: 14px 16px;

















    cursor: pointer;

















    transition: all 0.2s;

















    border-bottom: 1px solid #f0f0f0;

















    text-decoration: none;

















    color: inherit;

















}

















.suggestion-item:last-child {

















    border-bottom: none;

















}

















.suggestion-item:hover {

















    background: #f8fdf8;

















}

















/* Product suggestion */

















.suggestion-item.product .item-image {

















    width: 56px;

















    height: 56px;

















    border-radius: 10px;

















    object-fit: contain;

















    background: #f5f5f5;

















    border: 1px solid #eee;

















    flex-shrink: 0;

















}

















.suggestion-item .item-info {

















    flex: 1;

















    min-width: 0;

















}

















.suggestion-item .item-name {

















    font-weight: 600;

















    color: #222;

















    font-size: 14px;

















    line-height: 1.4;

















    margin-bottom: 4px;

















    display: -webkit-box;

















    -webkit-line-clamp: 2;

















    -webkit-box-orient: vertical;

















    overflow: hidden;

















}

















.suggestion-item .item-name mark {

















    background: #fff59d;

















    color: inherit;

















    padding: 1px 3px;

















    border-radius: 3px;

















    font-weight: 700;

















}

















.suggestion-item .item-type {

















    font-size: 12px;

















    color: #888;

















    font-weight: 500;

















}

















.suggestion-item .item-price {

















    font-weight: 700;

















    color: #1a5d1a;

















    font-size: 16px;

















    white-space: nowrap;

















}

















/* Category & Brand suggestions */

















.suggestion-item.category,

















.suggestion-item.brand {

















    padding: 12px 16px;

















}

















.suggestion-item.category .item-icon,

















.suggestion-item.brand .item-icon {

















    width: 42px;

















    height: 42px;

















    border-radius: 10px;

















    display: flex;

















    align-items: center;

















    justify-content: center;

















    flex-shrink: 0;

















}

















.suggestion-item.category .item-icon {

















    background: linear-gradient(135deg, #e8f5e9, #c8e6c9);

















    color: #1a5d1a;

















}

















.suggestion-item.brand .item-icon {

















    background: linear-gradient(135deg, #e3f2fd, #bbdefb);

















    color: #1565c0;

















}

















.suggestion-item.category .item-icon svg,

















.suggestion-item.brand .item-icon svg {

















    width: 20px;

















    height: 20px;

















}

















/* View all results button */

















.view-all-results {

















    display: flex;

















    align-items: center;

















    justify-content: center;

















    gap: 10px;

















    padding: 16px;

















    background: linear-gradient(135deg, #f8fdf8, #f0f7f0);

















    color: #1a5d1a;

















    font-weight: 600;

















    font-size: 14px;

















    cursor: pointer;

















    transition: all 0.2s;

















    border-radius: 0 0 16px 16px;

















    border-top: 1px solid #e8f5e9;

















}

















.view-all-results:hover {

















    background: linear-gradient(135deg, #e8f5e9, #c8e6c9);

















}

















.view-all-results svg {

















    width: 18px;

















    height: 18px;

















}

















/* No results message */

















.no-results {

















    padding: 30px 20px;

















    text-align: center;

















    color: #888;

















}

















.no-results svg {

















    width: 48px;

















    height: 48px;

















    color: #ddd;

















    margin-bottom: 12px;

















}

















.no-results p {

















    font-size: 14px;

















    margin: 0;

















}

















/* Mobile adjustments */

















@media (max-width: 768px) {

















    .search-dropdown {

















        position: fixed;

















        top: auto;

















        left: 10px;

















        right: 10px;

















        width: auto;

















        max-width: none;

















        border-radius: 16px;

















        max-height: 70vh;

















    }

















    .suggestion-item {

















        padding: 12px 14px;

















    }

















    .suggestion-item.product .item-image {

















        width: 48px;

















        height: 48px;

















    }

















    .suggestion-item .item-name {

















        font-size: 13px;

















    }

















    .suggestion-item .item-price {

















        font-size: 14px;

















    }

















}