/* ============================================================
 * TP V4 — Brand Explorer parts search (text + ref + suggest)
 * ============================================================ */

.tp4-parts-search {
    display: grid;
    grid-template-columns: 1.4fr 1fr auto;
    gap: 0.6rem;
    align-items: center;
    margin-bottom: 1rem;
    padding: 0.7rem;
    background: #fff;
    border: 1px solid var(--tp4-border);
    border-radius: var(--tp4-r-lg);
    box-shadow: var(--tp4-shadow-sm);
}

.tp4-parts-search__field {
    position: relative;
    display: flex; align-items: center;
    background: var(--tp4-c-gray-50);
    border: 1.5px solid var(--tp4-border);
    border-radius: var(--tp4-r-pill);
    padding: 0.45rem 0.85rem;
    transition: border-color var(--tp4-dur) var(--tp4-ease-out), background var(--tp4-dur) var(--tp4-ease-out), box-shadow var(--tp4-dur) var(--tp4-ease-out);
}
.tp4-parts-search__field:focus-within {
    background: #fff;
    border-color: var(--tp4-c-brand);
    box-shadow: 0 0 0 3px rgba(194, 84, 27, 0.18);
}
.tp4-parts-search__field--ref:focus-within {
    border-color: var(--tp4-c-accent);
    box-shadow: 0 0 0 3px rgba(90, 107, 72, 0.18);
}
.tp4-parts-search__icon { color: var(--tp4-text-muted); flex-shrink: 0; }
.tp4-parts-search__input {
    flex: 1 1 auto; min-width: 0;
    appearance: none; border: none; outline: none; background: transparent;
    padding: 0.35rem 0.7rem;
    font: inherit; font-size: var(--tp4-fs-sm); color: var(--tp4-text);
}
.tp4-parts-search__input::placeholder { color: var(--tp4-text-muted); }
.tp4-parts-search__input--mono {
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    letter-spacing: 0.04em; font-weight: var(--tp4-fw-semi);
    text-transform: uppercase;
}
.tp4-parts-search__clear {
    appearance: none; border: none; background: var(--tp4-c-gray-200); cursor: pointer;
    width: 1.5rem; height: 1.5rem; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    color: var(--tp4-text); transition: background var(--tp4-dur) var(--tp4-ease-out);
}
.tp4-parts-search__clear:hover { background: var(--tp4-c-gray-300); }

.tp4-parts-search__stats {
    font-size: var(--tp4-fs-xs);
    color: var(--tp4-text-muted);
    font-weight: var(--tp4-fw-semi);
    padding-right: 0.5rem; white-space: nowrap;
}

/* Suggest dropdown */
.tp4-parts-search__suggest {
    position: absolute; left: 0; right: 0; top: calc(100% + 6px);
    background: #fff; border: 1px solid var(--tp4-border);
    border-radius: var(--tp4-r-lg); box-shadow: var(--tp4-shadow-lg);
    overflow: hidden; z-index: 50;
    animation: tp4-fade-down 180ms var(--tp4-ease-out);
    max-height: 320px; overflow-y: auto;
}
.tp4-parts-search__suggest-item {
    display: flex; align-items: center; gap: 0.55rem;
    padding: 0.5rem 0.85rem; cursor: pointer;
    font-size: var(--tp4-fs-sm); color: var(--tp4-text);
    border-bottom: 1px solid var(--tp4-c-gray-50);
    transition: background var(--tp4-dur) var(--tp4-ease-out);
}
.tp4-parts-search__suggest-item:last-child { border-bottom: 0; }
.tp4-parts-search__suggest-item:hover, .tp4-parts-search__suggest-item.is-focus { background: var(--tp4-c-brand-soft); }
.tp4-parts-search__suggest-item mark { background: rgba(194, 84, 27, 0.25); color: inherit; padding: 0 2px; border-radius: 3px; }
.tp4-parts-search__suggest-cat {
    margin-left: auto; font-size: 0.7rem; color: var(--tp4-text-muted);
    background: var(--tp4-c-gray-100); padding: 0.1rem 0.4rem; border-radius: var(--tp4-r-pill);
    font-weight: var(--tp4-fw-semi);
}

/* Empty state */
.tp4-parts-panel.is-empty .tp4-parts-list { display: none; }
.tp4-parts-empty {
    text-align: center; padding: 2.5rem 1.5rem;
    color: var(--tp4-text-muted);
    background: var(--tp4-c-gray-50); border-radius: var(--tp4-r-lg);
    border: 1px dashed var(--tp4-border-strong);
}
.tp4-parts-empty__icon { color: var(--tp4-c-gray-300); margin-bottom: 0.5rem; }

/* Part row hidden states (filter by search OR by pagination/category) */
.tp4-part-row.is-hidden-by-search,
.tp4-part-row.is-hidden-by-page,
.tp4-part-row.is-hidden { display: none !important; }
.tp4-part-row__name mark, .tp4-part-row__ref mark { background: rgba(194, 84, 27, 0.25); color: inherit; padding: 0 2px; border-radius: 3px; }

@media (max-width: 768px) {
    .tp4-parts-search { grid-template-columns: 1fr; }
    .tp4-parts-search__stats { padding: 0; }
}