/* Arama formu + autocomplete — Figma 4:27 (header), 5:175 (Search/Large), 27:10774 (autocomplete). */
.eg-search { position: relative; display: flex; align-items: center; gap: 12px; background: var(--eg-color-surface-default); border: 1px solid var(--eg-color-border-default); }
.eg-search:focus-within { border-color: var(--eg-color-border-focus); box-shadow: var(--eg-focus-ring); }
.eg-search__icon { display: inline-flex; color: var(--eg-color-text-secondary); flex: none; }
.eg-search__input { flex: 1; min-width: 0; border: 0; background: transparent; padding: 0; color: var(--eg-color-text-primary); outline: none; }
.eg-search__input::placeholder { color: var(--eg-color-text-muted); opacity: 1; }
.eg-search__input::-webkit-search-cancel-button, .eg-search__input::-webkit-search-decoration { -webkit-appearance: none; appearance: none; }
.eg-search__clear { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; flex: none; border-radius: var(--eg-radius-pill); background: var(--eg-color-surface-muted); color: var(--eg-color-text-secondary); }
.eg-search__submit { flex: none; display: inline-flex; align-items: center; justify-content: center; }
.eg-search__submit--text { padding: 12px 20px; border-radius: var(--eg-radius-md); background: var(--eg-color-brand-primary); color: var(--eg-color-text-inverse); font: var(--eg-type-ui-button); }
.eg-search__submit--text:hover { background: var(--eg-color-brand-primary-hover); }
.eg-search__submit--icon { width: 48px; height: 48px; border-radius: 10px; background: var(--eg-color-brand-primary); color: var(--eg-color-text-inverse); }

/* Header: hap şekli, 300×44 */
.eg-search--header { height: 44px; padding: 0 6px 0 18px; border-radius: var(--eg-radius-pill); background: var(--eg-color-surface-muted); gap: 8px; }
.eg-search--header .eg-search__input { font: var(--eg-type-body-sm); }
.eg-search--header .eg-search__submit--icon { width: 32px; height: 32px; background: transparent; color: var(--eg-color-text-primary); border-radius: var(--eg-radius-pill); }
.eg-search--header .eg-search__clear { width: 28px; height: 28px; background: transparent; }
.eg-search--header .eg-ac { width: 480px; right: 0; left: auto; }

/* Üst çubuk (v0.3): geniş, 46 yükseklik, radius 10, ⌘K rozeti */
.eg-search--top { height: 46px; padding: 0 10px 0 16px; border-radius: 10px; gap: 12px; box-shadow: var(--eg-shadow-xs); }
.eg-search--top .eg-search__icon { color: var(--eg-color-text-primary); }
.eg-search--top .eg-search__input { font: 400 13.5px/20px var(--eg-font-family); }
.eg-search--top .eg-search__input::placeholder { color: var(--eg-color-text-secondary); }
.eg-search--top .eg-search__clear { width: 28px; height: 28px; background: transparent; }
.eg-search__kbd { flex: none; display: inline-flex; align-items: center; height: 26px; padding: 0 8px; border-radius: 6px; background: var(--eg-color-surface-muted); border: 1px solid var(--eg-color-border-default); font: 500 12px/1 var(--eg-font-family); color: var(--eg-color-text-secondary); white-space: nowrap; }
.eg-search--top:focus-within .eg-search__kbd { display: none; }

/* Büyük: 56 yükseklik, radius 16 */
.eg-search--large { height: 56px; padding: 0 6px 0 20px; border-radius: var(--eg-radius-lg); box-shadow: var(--eg-shadow-sm); }
.eg-search--large .eg-search__input { font: var(--eg-type-body-md); }
.eg-search--large:focus-within { border-width: 1px; box-shadow: var(--eg-focus-ring); }

/* Arama sayfası / katman: 60 yükseklik, radius 12 */
.eg-search--inline, .eg-search--layer { height: 60px; padding: 0 6px 0 18px; border-radius: var(--eg-radius-md); }
.eg-search--inline .eg-search__input, .eg-search--layer .eg-search__input { font: var(--eg-type-body-md); }
.eg-search--layer { height: 52px; }
.eg-search--layer .eg-search__submit--icon { width: 40px; height: 40px; }
.eg-search--layer .eg-ac { position: fixed; top: 69px; left: 0; right: 0; bottom: 0; border-radius: 0; border: 0; box-shadow: none; max-height: none; overflow-y: auto; }

/* Öneri paneli */
.eg-ac {
	position: absolute; top: calc(100% + 8px); left: 0; right: 0; z-index: 150;
	background: var(--eg-color-surface-default); border: 1px solid var(--eg-color-border-default); border-radius: var(--eg-radius-lg);
	box-shadow: var(--eg-shadow-md); overflow: hidden; max-height: min(70vh, 560px); overflow-y: auto;
}
.eg-ac__list { display: flex; flex-direction: column; gap: 4px; padding: 10px 10px 0; }
.eg-ac__group { display: flex; align-items: center; gap: 8px; padding: 10px 14px 6px; font: var(--eg-type-label-xs); letter-spacing: var(--eg-tracking-label-xs); color: var(--eg-color-text-muted); }
.eg-ac__row { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border-radius: 10px; color: var(--eg-color-text-primary); }
.eg-ac__row:hover, .eg-ac__row[aria-selected="true"] { background: var(--eg-color-surface-brand-soft); color: var(--eg-color-text-primary); }
.eg-ac__ic { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; flex: none; border-radius: var(--eg-radius-sm); background: var(--eg-color-surface-muted); color: var(--eg-color-text-secondary); }
.eg-ac__row[aria-selected="true"] .eg-ac__ic { background: var(--eg-color-surface-default); color: var(--eg-color-brand-primary); }
.eg-ac__ic.has-img { background: var(--eg-color-surface-default); border: 1px solid var(--eg-color-border-default); }
.eg-ac__ic.has-img img { width: 22px; height: 22px; object-fit: contain; }
.eg-ac__text { flex: 1; min-width: 0; display: grid; gap: 2px; }
.eg-ac__title { font: var(--eg-type-body-sm); overflow: hidden; text-overflow: ellipsis; }
.eg-ac__title mark { background: none; color: inherit; font-weight: 700; }
.eg-ac__meta { font: var(--eg-type-body-xs); color: var(--eg-color-text-muted); }
.eg-ac__arrow { color: var(--eg-color-text-muted); flex: none; }
.eg-ac__go { display: none; align-items: center; gap: 4px; padding: 4px 8px; border-radius: var(--eg-radius-xs); border: 1px solid var(--eg-color-border-default); background: var(--eg-color-surface-default); font: var(--eg-type-label-xs); letter-spacing: var(--eg-tracking-label-xs); color: var(--eg-color-brand-primary); }
.eg-ac__row[aria-selected="true"] .eg-ac__go { display: inline-flex; }
.eg-ac__row[aria-selected="true"] .eg-ac__arrow { display: none; }
.eg-ac__empty { padding: 14px; font: var(--eg-type-body-sm); color: var(--eg-color-text-secondary); }
.eg-ac__foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 4px; padding: 12px 14px; background: var(--eg-color-surface-muted); }
.eg-ac__keys { display: flex; gap: 14px; font: var(--eg-type-body-xs); color: var(--eg-color-text-muted); }
.eg-ac__keys span { display: inline-flex; gap: 6px; align-items: center; }
.eg-ac__keys kbd { padding: 2px 6px; border-radius: 5px; border: 1px solid var(--eg-color-border-default); background: var(--eg-color-surface-default); font: var(--eg-type-label-xs); letter-spacing: var(--eg-tracking-label-xs); color: var(--eg-color-text-secondary); }
.eg-ac__all { display: inline-flex; align-items: center; gap: 6px; font: var(--eg-type-label-sm); color: var(--eg-color-brand-primary); }
@media (max-width: 1023px) { .eg-ac__keys { display: none; } }
