/* Поиск в шапке — как у ozon.ru (28.10.2026): inc/shop-listing.php orgprint_header_search(), подсказки — assets/js/shop-printer.js.
   Компьютер (от 992 px): строка на месте «Время работы / Адрес», они — мелкой строкой под ней. Телефон: строка под шапкой,
   только на страницах магазина. Подсказки (фото у товаров, «Разделы каталога») — в shop-printer.css. */

.op-hs { position: relative; margin: 0; }
.op-hs__row {
	display: flex;
	align-items: stretch;
	height: 44px;
	border: 2px solid var(--color-theme);
	border-radius: 12px;
	background: #fff;
	overflow: hidden;
}
.op-hs__input {
	flex: 1 1 auto;
	min-width: 0;
	height: auto;
	margin: 0;
	padding: 0 14px;
	border: 0;
	border-radius: 0;
	background: #fff;
	font-size: 15px;
	color: #1d2733;
	outline: none;
	-webkit-appearance: none;
	appearance: none;
}
.op-hs__input::placeholder { color: #8a96a3; opacity: 1; }
.op-hs__input::-webkit-search-cancel-button { cursor: pointer; }
.op-hs__btn {
	flex: 0 0 56px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 0;
	background: var(--color-theme);
	color: #fff;
	cursor: pointer;
}
.op-hs__btn svg,
.op-hs__btn svg * { color: #fff; }
.op-hs__btn:hover { background: var(--color-theme-hover-bg, #005a8a); }
.op-hs .op-hs__list { top: 100%; margin-top: 6px; max-height: min(70vh, 520px); border-radius: 12px; }

/* компьютер: на месте «Время работы / Адрес» */
.op-hs-wrap { flex: 1 1 auto; min-width: 0; max-width: 780px; margin: 0 32px 0 24px; } /* с кнопкой «Каталог» (29.10.2026) — шире */
.op-hs-info {
	margin-top: 5px;
	font-size: 12.5px;
	line-height: 1.3;
	color: #6b7782;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
header .contacts--wrap.has-hs { flex: 1 1 auto; justify-content: flex-end; }
header .contacts--wrap.has-hs .schedule { display: none; }
.op-hs-line--m { display: none; }

@media (max-width: 991.98px) {
	.op-hs-wrap { display: none; }
	.header--middle .op-hs-line--m { display: flex; grid-column: 1 / -1; margin: 6px 0 2px; }
	.op-hs-line--m { gap: 8px; }
	.op-hs-line--m .op-hs-cat { width: 42px; height: 42px; padding: 0; justify-content: center; border-radius: 10px; }
	.op-hs-line--m .op-hs-cat span { display: none; }
	.op-hs--m .op-hs__row { height: 42px; border-radius: 10px; }
	.op-hs--m .op-hs__btn { flex-basis: 50px; }
}

/* кнопка «Каталог» слева от поиска — как у ozon.ru (29.10.2026, inc/shop-listing.php orgprint_catalog_button()):
   на странице /katalog/ — «× Каталог» (назад); от 992 до 1199 px и на телефоне — только значок. В теме правило * красит текст
   тёмным — белый задан явно. */
.op-hs-line { display: flex; align-items: flex-start; gap: 10px; }
.op-hs-line > .op-hs { flex: 1 1 auto; min-width: 0; }
.op-hs-cat {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	height: 44px;
	padding: 0 18px 0 16px;
	border-radius: 12px;
	background: var(--color-theme);
	font-size: 16px;
	font-weight: 600;
	line-height: 1;
	text-decoration: none;
	white-space: nowrap;
}
.op-hs-cat,
.op-hs-cat:hover,
.op-hs-cat:focus,
.op-hs-cat span,
.op-hs-cat svg { color: #fff; text-decoration: none; }
.op-hs-cat:hover,
.op-hs-cat.is-open { background: var(--color-theme-hover-bg, #005a8a); }
.op-hs-cat svg { flex: 0 0 20px; }
@media (min-width: 992px) and (max-width: 1199.98px) {
	.op-hs-line--d .op-hs-cat { width: 44px; padding: 0; justify-content: center; }
	.op-hs-line--d .op-hs-cat span { display: none; }
}
/* строка телефона (поиск + кнопка) — только до 992 px; правило .op-hs-line выше иначе показало бы её и на компьютере */
.op-hs-line.op-hs-line--m { display: none; }
@media (max-width: 991.98px) {
	.header--middle .op-hs-line.op-hs-line--m { display: flex; }
}