/**
 * Global responsive — Medik theme
 * Loaded last; fixes overflow and small-screen layout gaps.
 */

html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

#page.site {
	overflow-x: clip;
	max-width: 100%;
}

img,
video,
canvas {
	max-width: 100%;
	height: auto;
}

iframe {
	max-width: 100%;
	border: 0;
}

/* Readable long strings (URLs, phones in narrow columns) */
a,
p,
li,
.bread_crumbs__body,
.contact-page__value,
.select_address__value {
	overflow-wrap: anywhere;
	word-wrap: break-word;
}

/* Rich text & legal content */
.content_box,
.legal-page__body,
.products_catalog__about-inner,
.article__body,
.card_tabs__panel {
	overflow-wrap: break-word;
}

.content_box img,
.legal-page__body img,
.article__body img,
.card_tabs__panel img {
	max-width: 100%;
	height: auto;
}

.content_box table,
.legal-page__body table,
.card_tabs__panel table {
	display: block;
	width: 100%;
	max-width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border-collapse: collapse;
}

/* Container — tighter on phones */
@media (max-width: 640px) {
	.container {
		width: min(100% - 24px, var(--medik-container));
	}

	.site-main {
		padding-top: 1.25rem;
		padding-bottom: 1.25rem;
	}

	.title_section {
		margin-bottom: 18px;
	}
}

@media (max-width: 380px) {
	.container {
		width: min(100% - 20px, var(--medik-container));
	}
}

/* ===== Footer CTA ===== */
@media (max-width: 640px) {
	.site-footer__cta {
		padding: 22px 0;
	}

	.site-footer__cta-inner {
		flex-direction: column;
		align-items: stretch;
		text-align: center;
	}

	.site-footer__cta-actions {
		flex-direction: column;
		width: 100%;
	}

	.site-footer__cta-phone,
	.site-footer__cta-btn {
		width: 100%;
		justify-content: center;
	}

	.site-footer__legal {
		flex-direction: column;
		align-items: center;
		gap: 8px;
		text-align: center;
	}
}

/* ===== Cookie bar ===== */
@media (max-width: 480px) {
	.cookie-notice__inner {
		flex-direction: column;
		align-items: stretch;
		text-align: center;
		gap: 10px;
	}

	.cookie-notice__text {
		flex: 0 0 auto;
		max-width: none;
	}

	.cookie-notice__btn {
		width: 100%;
	}
}

/* ===== Catalog banner ===== */
@media (max-width: 480px) {
	.products_catalog__banner.banner {
		padding: 16px;
	}

	.banner__bottom {
		flex-direction: column;
		align-items: stretch;
	}

	.banner__bottom .btn {
		width: 100%;
	}
}

/* ===== Product single ===== */
@media (max-width: 480px) {
	.card_product__images_main {
		max-width: none;
	}

	.card_product__thumbs {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 8px;
	}

	.card_product__price-block .price_new {
		font-size: clamp(22px, 6vw, 28px);
	}

	.medik-modal__dialog {
		width: min(100% - 24px, 420px);
		margin: 12px;
	}
}

/* ===== Contacts ===== */
@media (max-width: 480px) {
	.contact-gallery__slide {
		flex: 0 0 min(280px, 88vw);
	}

	.appeal__form .btn,
	.appeal__form input,
	.appeal__form textarea {
		width: 100%;
	}
}

/* ===== Legal ===== */
@media (max-width: 768px) {
	.legal-page {
		padding-bottom: 32px;
	}

	.legal-page__title {
		margin-bottom: 20px;
		font-size: clamp(18px, 5vw, 24px);
	}

	.legal-page__body {
		font-size: 14px;
	}

	.legal-page__body h2 {
		font-size: 16px;
	}
}

/* ===== Search / 404 ===== */
@media (max-width: 480px) {
	.search-page__products.products_catalog__grid {
		grid-template-columns: 1fr;
	}
}

/* ===== Accessibility FAB ===== */
@media (max-width: 480px) {
	.medik-a11y__fab {
		left: 12px;
		bottom: 12px;
	}

	body:has(.cookie-notice:not([hidden]):not(.is-hiding)) .medik-a11y__fab {
		bottom: 88px;
	}
}

/* Safe area for notched phones */
@supports (padding: max(0px)) {
	.cookie-notice__container {
		padding-bottom: max(16px, env(safe-area-inset-bottom));
	}

	.top_header__container,
	.bottom_header__container,
	.panel_header__container {
		padding-left: max(0px, env(safe-area-inset-left));
		padding-right: max(0px, env(safe-area-inset-right));
	}

	.floating-contact {
		right: max(var(--fc-offset-x, 14px), env(safe-area-inset-right));
		bottom: max(var(--fc-offset-y, 14px), env(safe-area-inset-bottom));
	}
}

/* Reduced motion — align with a11y simple layout */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}
