/*
 * Module Tìm kiếm (tim-kiem) — phần CSS riêng của module. Các thành phần chung (mn-pagehead, mn-filter, mn-list,
 * mn-tabs__list, mn-badge, mn-notice, mn-btn...) dùng hệ thống mn-* của giao diện (css/mn.css), không định dạng lại.
 */

/* ----- Nhóm bộ lọc phụ (chuyên mục tin, khoảng ngày, sắp xếp) trong thanh lọc: <details> nguyên bản, không cần JS ----- */
.tim-kiem-more {
    flex: 0 0 100%;
    min-width: 0;
}

.tim-kiem-more__toggle {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    padding: 4px 6px 4px 0;
    border-radius: var(--mn-radius-sm);
    color: var(--mn-link);
    cursor: pointer;
    font-size: var(--mn-text-sm);
    font-weight: 700;
    list-style: none;
}

.tim-kiem-more__toggle::-webkit-details-marker {
    display: none;
}

.tim-kiem-more__toggle::before {
    content: '';
    flex: none;
    width: 9px;
    height: 9px;
    margin-left: 3px;
    border-right: 3px solid currentColor;
    border-bottom: 3px solid currentColor;
    transform: rotate(-45deg);
}

.tim-kiem-more[open] > .tim-kiem-more__toggle::before {
    transform: rotate(45deg) translate(-2px, -2px);
}

.tim-kiem-more__toggle:hover,
.tim-kiem-more__toggle:focus {
    color: var(--mn-link-hover);
}

.tim-kiem-more__body {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 12px 16px;
    padding-top: 8px;
}

.tim-kiem-note {
    margin: 4px 0 0;
    color: var(--mn-ink-600);
    font-size: var(--mn-text-xs);
    font-weight: 400;
}

/* ----- Thông báo (ngày sai dạng, từ khoá quá ngắn...): một khung, mỗi thông báo một dòng ----- */
.tim-kiem-messages .tim-kiem-msg + .tim-kiem-msg {
    margin-top: 6px;
}

/* ----- Kết quả ----- */
.tim-kiem-types {
    margin: 0 0 var(--mn-space-4);
}

.tim-kiem-types .mn-tabs__list {
    margin-bottom: 0;
}

.tim-kiem-count {
    color: var(--mn-ink-600);
    font-weight: 400;
}

/* Từ khoá được tô sáng: nền vàng nhạt VÀ chữ đậm (không chỉ dựa vào màu) */
.tim-kiem-hit {
    padding: 0 2px;
    background: var(--mn-yellow-100);
    border-radius: 4px;
    color: inherit;
    font-weight: 700;
}

.tim-kiem-list .mn-list__title,
.tim-kiem-list .mn-list__text {
    overflow-wrap: anywhere;
}

@media (max-width: 575.98px) {
    /*
     * Điện thoại: các thẻ loại nội dung nằm trên MỘT hàng cuộn ngang thay vì xếp thành nhiều hàng đẩy kết quả đầu
     * tiên xuống dưới. Khoảng đệm quanh hàng để vòng focus của thẻ không bị cắt.
     */
    .tim-kiem-types .mn-tabs__list {
        /* relative: phần chữ ẩn cho trình đọc màn hình (.sr-only, position: absolute) trong các thẻ phải cuộn cùng hàng
           thẻ; nếu không, chúng nằm ngoài vùng cắt của hàng và làm trang rộng hơn màn hình */
        position: relative;
        flex-wrap: nowrap;
        padding: 5px 5px 0;
        overflow-x: auto;
        overflow-y: hidden;
        overscroll-behavior-x: contain;
        scrollbar-width: thin;
        -webkit-overflow-scrolling: touch;
    }

    .tim-kiem-types .mn-tabs__list > li {
        flex: 0 0 auto;
    }

    .tim-kiem-types .mn-tabs__tab {
        margin-bottom: 0;
        padding-right: 12px;
        padding-left: 12px;
        white-space: nowrap;
    }

    /* Điện thoại: trích đoạn tối đa 5 dòng để danh sách không quá dài (chỗ khớp đầu tiên nằm ở những dòng đầu) */
    .tim-kiem-list .mn-list__text {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 5;
        line-clamp: 5;
        overflow: hidden;
    }
}

.tim-kiem-results .mn-empty {
    margin-bottom: var(--mn-space-4);
}

.tim-kiem-tips ul,
.tim-kiem-guide {
    margin: 0;
    padding-left: 1.35em;
    list-style: disc;
}

.tim-kiem-tips li + li,
.tim-kiem-guide li + li {
    margin-top: 6px;
}

.tim-kiem-guide {
    max-width: 78ch;
    color: var(--mn-ink-700);
}

/* ----- Block ô tìm kiếm (global.searchbox) ----- */
.tim-kiem-box {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 12px 16px;
    margin: 0;
}

.tim-kiem-box__field {
    flex: 1 1 180px;
    min-width: 0;
}

.tim-kiem-box__field--wide {
    flex: 2 1 240px;
}

.tim-kiem-box__field .form-control {
    width: 100%;
}

.tim-kiem-box__actions {
    flex: 0 0 auto;
}

@media print {
    /* Bản in: chỉ còn tiêu đề, dòng tóm tắt và danh sách kết quả */
    .tim-kiem-types,
    .tim-kiem-tips {
        display: none;
    }

    .tim-kiem-hit {
        background: none;
        text-decoration: underline;
    }
}