/**
 * Стили страницы «Выбор модели» (taxonomy-sc_device_type.php).
 * Подключается вместе с sc-homepage.css (шапка/подвал/переключатели —
 * оттуда, здесь только то, что специфично для этой страницы: ряд кнопок
 * типов устройств, поиск и сетка моделей). Переменные --sc-accent/--sc-text
 * и т.д. те же, что и во всём остальном модуле.
 */

/* ---------- Хлебные крошки + заголовок ---------- */
.sc-model-head{ padding:28px 0 8px; }
.sc-model-crumbs{ font-size:.84rem; color:var(--sc-muted); }
.sc-model-crumbs a{ color:var(--sc-muted); text-decoration:none; }
.sc-model-crumbs a:hover{ color:var(--sc-accent); }
.sc-model-crumbs span{ color:var(--sc-text); }
.sc-model-head h1{
	font-family:var(--sc-font-display,'Manrope',sans-serif);
	font-weight:800;
	font-size:clamp(1.6rem,3.6vw,2.3rem);
	line-height:1.15;
	margin:12px 0 0;
	color:var(--sc-text);
	text-wrap:balance;
}
.sc-model-lede{ margin-top:10px; font-size:1rem; color:var(--sc-muted); max-width:64ch; }

/* ---------- Кнопки типов устройств ---------- */
.sc-model-types{ padding:18px 0 4px; }
.sc-device-chips{ display:flex; gap:10px; overflow-x:auto; padding-bottom:6px; -webkit-overflow-scrolling:touch; }
.sc-device-chip{
	flex:none; white-space:nowrap; display:inline-flex; align-items:center; gap:6px;
	padding:10px 18px; border-radius:20px; font-size:.9rem; font-weight:700;
	text-decoration:none; cursor:pointer;
	border:1px solid var(--sc-border); background:var(--sc-surface); color:var(--sc-text);
	transition:border-color .15s ease, background .15s ease, color .15s ease;
}
.sc-device-chip:hover{ border-color:var(--sc-accent); color:var(--sc-accent); }
.sc-device-chip.is-active{ border-color:var(--sc-accent); background:var(--sc-accent); color:#fff; }
.sc-device-chip.is-active:hover{ color:#fff; }

/* ---------- Поиск ---------- */
.sc-model-search-section{ padding:14px 0 0; }
.sc-model-search-wrap{ position:relative; max-width:420px; }
.sc-model-search-icon{ position:absolute; left:12px; top:50%; transform:translateY(-50%); color:var(--sc-muted); font-size:.95rem; pointer-events:none; }
.sc-model-search{
	width:100%; padding:11px 14px 11px 44px; border:1px solid var(--sc-border); border-radius:8px;
	font:inherit; font-size:.94rem; color:var(--sc-text); background:var(--sc-surface);
}
.sc-model-search:focus{ outline:none; border-color:var(--sc-accent); }

/* ---------- Сетка моделей ---------- */
.sc-model-grid-section{ padding:26px 0 76px; }
.sc-model-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.sc-model-card{
	display:block; text-align:left; padding:16px; border:1px solid var(--sc-border);
	border-radius:var(--sc-radius,10px); background:var(--sc-surface); text-decoration:none;
	cursor:pointer; transition:border-color .15s ease, transform .15s ease;
}
.sc-model-card:hover{ border-color:var(--sc-accent); transform:translateY(-2px); }
.sc-model-photo{
	display:flex; align-items:center; justify-content:center; width:100%; aspect-ratio:1/1;
	border-radius:8px; overflow:hidden; background:var(--sc-bg-soft); margin-bottom:14px;
}
.sc-model-photo img{ width:100%; height:100%; object-fit:cover; }
.sc-model-photo-fallback{ font-size:2.4rem; }
.sc-model-name{ display:block; margin:0; font-size:.96rem; font-weight:700; color:var(--sc-text); }
.sc-model-price{ display:block; margin-top:6px; font-size:.86rem; color:var(--sc-muted); }
.sc-model-price b{ color:var(--sc-accent-dark); }
.sc-model-release{ display:block; margin-top:4px; font-size:.76rem; color:var(--sc-muted); }

.sc-model-card[hidden]{ display:none; }

.sc-model-no-match{ text-align:center; padding:60px 20px; color:var(--sc-muted); }

.sc-model-empty{ text-align:center; padding:60px 20px; color:var(--sc-muted); }
.sc-model-empty-icon{ font-size:36px; margin:0 0 12px; }
.sc-model-empty p{ margin:0 0 20px; max-width:52ch; margin-left:auto; margin-right:auto; }

/* ---------- Адаптив (те же точки, что у остального сайта) ---------- */
@media (max-width:960px){
	.sc-model-grid{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:760px){
	.sc-model-grid{ grid-template-columns:repeat(2,1fr); }
	.sc-model-head h1{ font-size:1.6rem; }
}