/* ============================================================
   LuxSuggest — style dùng chung cho dropdown gợi ý tìm kiếm.
   Dùng ở: ô search header (PC/mobile/sidebar) + trang /search.
   ============================================================ */

.suggest-group-title {
    padding: 8px 16px 4px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #000;
}

.suggest-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 16px;
    text-decoration: none;
    color: #000;
    transition: background 0.15s ease;
}

#headerSticky .suggest-group-title, #headerSticky .suggest-item {
    padding: 8px 0px;
}
.suggest-item:hover {
    background: #f6f7f9;
    color: #000;
}

.suggest-item__img {
    width: 40px;
    height: 40px;
    object-fit: cover;
    border-radius: 6px;
    flex: 0 0 auto;
}

.suggest-item__title {
    flex: 1;
    font-size: 14px;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.suggest-item__meta {
    flex: 0 0 auto;
    font-size: 13px;
    color: #6c757d;
    white-space: nowrap;
}

/* ----- Container gợi ý trong header (ẩn mặc định; JS bật khi có gợi ý) ----- */
.lux-search-suggestions {
    display: none;
    max-height: 360px;
    overflow-y: auto;
}

.header-suggestions{
    display: none;
    max-height: 360px;
}

/* Hot/Recent searches đã bỏ toàn site — chỉ hiện gợi ý khi gõ text. */
.header-search-default,
.lux-search-default {
    display: none !important;
}

/* Dropdown gợi ý cho ô sidebar (không có popup sẵn) → position absolute dưới input. */
.mobile-search-suggestions {
    display: none;
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    z-index: 1200;
    background: #fff;
    border: 1px solid #e2e6ea;
    border-radius: 12px;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
    max-height: 340px;
    overflow-y: auto;
    padding: 6px 0;
}