/* =====================================================================
 * TravelAgency.bg — Mobile-first поправки (зарежда се от mu-plugin-а)
 * Самостоятелен файл. НЕ пипа assets/css/main.css на темата.
 * Зарежда се СЛЕД ta-main, затова има предимство по ред (без !important
 * там, където не е нужно).
 * ===================================================================== */

/* ---------------------------------------------------------------------
 * 1. КРИТИЧНО за скоростта: спираме сваляне на промо-снимките на
 *    мега-менюто на мобилни ширини. Мега-менюто е скрито под 1000px,
 *    но панелите му са position:absolute (не display:none), затова
 *    браузърът сваля фоновите им снимки — ~190 KB напразно на телефон.
 *    Тук ги нулираме под breakpoint-а на мобилната навигация.
 * ------------------------------------------------------------------- */
@media (max-width: 1000px) {
	.mfeat,
	.mega .mfeat,
	.mega-wide .mfeat {
		background-image: none !important;
	}
	/* Самите мега-панели не трябва да заемат ресурс на телефон. */
	.nav .mega {
		display: none !important;
	}
}

/* ---------------------------------------------------------------------
 * 2. Четимост: вдигаме твърде дребните шрифтове на мобилни.
 *    Одитът намери: .tag 9px, .eyebrow 11.5px, .crumbs/navstrip 12.5px,
 *    някои h2/.sl 11–12px. Минимум 12.5–13px за служебен текст,
 *    16px за форми (виж т.4).
 * ------------------------------------------------------------------- */
@media (max-width: 768px) {
	.brand .tag {
		font-size: 10.5px;   /* таглайнът под логото — беше 9px */
		line-height: 1.25;
	}
	.eyebrow {
		font-size: 12.5px;   /* беше 11.5px */
	}
	.crumbs,
	.crumbs a,
	.crumbs .sep,
	.crumbs span {
		font-size: 13px;     /* хлебни трохи — беше 12.5px */
	}
	.navstrip a,
	.navstrip .menu-item a {
		font-size: 13.5px;   /* бързата лента с държави — беше 12.5px */
	}
	/* Дребни служебни етикети по картите/списъците. */
	.sl,
	.mc-h,
	figcaption,
	.card .meta,
	small {
		font-size: 12.5px;
	}
}

/* ---------------------------------------------------------------------
 * 3. Тап-таргети: служебните връзки в хедъра да са удобни за пръст.
 *    Бранд-логото беше 26px високо. Не пипаме inline връзките в текста
 *    (те са изключение по WCAG), само самостоятелните контроли.
 * ------------------------------------------------------------------- */
@media (max-width: 768px) {
	.head .brand {
		min-height: 44px;
		display: inline-flex;
		align-items: center;
	}
	/* Връзките в бързата лента — по-голяма зона за допир. */
	.navstrip a,
	.navstrip .menu-item a {
		display: inline-flex;
		align-items: center;
		min-height: 40px;
		padding-top: 6px;
		padding-bottom: 6px;
	}
	/* Самостоятелни (block) връзки в списъци/карти — поне 40px височина. */
	.az-list a,
	.linklist a,
	.cards a.card,
	.sidebar a {
		min-height: 40px;
		display: flex;
		align-items: center;
	}
}

/* ---------------------------------------------------------------------
 * 4. Форми: шрифт ≥16px, за да НЕ зумва iOS при фокус.
 *    Одитът на /contact/ намери input/textarea на 13.3px.
 * ------------------------------------------------------------------- */
@media (max-width: 768px) {
	input[type="text"],
	input[type="email"],
	input[type="search"],
	input[type="tel"],
	input[type="url"],
	input[type="number"],
	input[type="password"],
	textarea,
	select {
		font-size: 16px !important;   /* спира авто-зум на iOS */
	}
	/* Бутони на форми — удобни за допир. */
	button,
	.btn,
	input[type="submit"] {
		min-height: 44px;
	}
}

/* ---------------------------------------------------------------------
 * 5. Защита срещу хоризонтален скрол: дълги думи/URL-и да се пренасят,
 *    снимките в съдържанието да не излизат извън контейнера.
 * ------------------------------------------------------------------- */
@media (max-width: 768px) {
	.prose img,
	.entry-content img,
	figure img {
		max-width: 100%;
		height: auto;
	}
	.prose,
	.entry-content {
		overflow-wrap: break-word;
		word-wrap: break-word;
	}
	/* Дълги връзки/код да не разширяват оформлението. */
	.prose a,
	.entry-content a {
		overflow-wrap: anywhere;
	}
}

/* ---------------------------------------------------------------------
 * 6. CLS защита: запазваме съотношението на hero-снимките, докато
 *    се зареждат, за да няма изместване на оформлението.
 * ------------------------------------------------------------------- */
@media (max-width: 768px) {
	.hero img,
	.dest-hero img,
	.figure-hero img {
		aspect-ratio: 16 / 10;
		object-fit: cover;
		width: 100%;
		height: auto;
	}
}