/**
 * Hayder Voice — Search Results Styles
 */

@layer components {

	/* ============================================================
	 * SEARCH HERO
	 * ============================================================ */

	.search-hero {
		padding: calc(var(--header-height) + 3rem) var(--container-pad) 3rem;
		background: var(--c-abyss);
		border-bottom: 1px solid var(--c-border);
	}

	.search-hero__title {
		font-size: clamp(2rem, 5vw, 4rem);
		font-weight: 300;
		color: var(--c-heading);
		margin-bottom: 0.75rem;
	}

	.search-hero__title mark {
		background: var(--c-amber-overlay);
		color: var(--c-amber);
		padding: 0.05em 0.15em;
		border-radius: var(--radius-sm);
		font-style: normal;
	}

	.search-hero__count {
		display: block;
		font-family: var(--font-sans);
		font-size: var(--text-sm);
		color: var(--c-muted);
		margin-bottom: 2rem;
	}

	.search-hero__form {
		max-width: var(--container-sm);
	}

	/* ============================================================
	 * SEARCH RESULTS
	 * ============================================================ */

	.search-results {
		padding: clamp(3rem, 6vw, 5rem) var(--container-pad);
		max-width: var(--container-lg);
		margin-inline: auto;
	}

	.post-grid--search {
		display: flex;
		flex-direction: column;
		gap: 2rem;
	}

	.search-pagination {
		padding-top: 3rem;
	}

	.search-no-results {
		text-align: center;
		padding: 5rem 0;
	}

	/* ============================================================
	 * SEARCH FORM
	 * ============================================================ */

	.search-form__inner {
		display: flex;
		align-items: center;
		gap: 0.5rem;
		border: 1px solid var(--c-border);
		border-radius: var(--radius-full);
		padding: 0.5rem 0.5rem 0.5rem 1.25rem;
		background: var(--c-surface);
		transition: var(--transition-base);
	}

	.search-form__inner:focus-within {
		border-color: var(--c-amber-border);
		background: var(--c-amber-surface);
	}

	.search-form__input {
		flex: 1;
		background: none;
		border: none;
		outline: none;
		font-family: var(--font-sans);
		font-size: var(--text-sm);
		color: var(--c-heading);
		caret-color: var(--c-amber);
	}

	.search-form__input::placeholder { color: var(--c-dust); }

	.search-form__btn {
		flex-shrink: 0;
		width: 36px;
		height: 36px;
		border-radius: var(--radius-full);
		border: none;
		background: var(--c-amber);
		color: var(--c-void);
		cursor: pointer;
		transition: var(--transition-base);
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.search-form__btn:hover {
		background: var(--c-amber-bright);
	}

	/* AJAX search result items */
	.search-result-item {
		display: flex;
		align-items: flex-start;
		gap: 1rem;
		padding: 1rem;
		border-radius: var(--radius-md);
		text-decoration: none;
		transition: var(--transition-base);
		border: 1px solid transparent;
	}

	.search-result-item:hover {
		background: var(--c-surface);
		border-color: var(--c-border);
	}

	.search-result-thumb {
		width: 64px;
		height: 64px;
		border-radius: var(--radius-md);
		object-fit: cover;
		flex-shrink: 0;
		background: var(--c-surface);
	}

	.search-result-body { flex: 1; min-width: 0; }

	.search-result-cat {
		font-family: var(--font-sans);
		font-size: var(--text-2xs);
		color: var(--c-amber);
		letter-spacing: var(--ls-wider);
		text-transform: uppercase;
		margin-bottom: 0.25rem;
	}

	.search-result-title {
		font-family: var(--font-serif);
		font-size: var(--text-md);
		color: var(--c-heading);
		line-height: var(--lh-snug);
		margin-bottom: 0.25rem;
	}

	.search-result-excerpt {
		font-family: var(--font-sans);
		font-size: var(--text-xs);
		color: var(--c-muted);
		line-height: var(--lh-relaxed);
	}

} /* @layer components */