/* =========================================================================
   Teamfootball — оболонка: сервісна смуга, шапка (compact/wide), drawer,
   пошук, футер. Server-rendered; JS лише покращує drawer і підказки.
   ====================================================================== */

/* ---------- Сервісна смуга ---------- */
.tf-usp { background: var(--tf-inverse); color: var(--tf-on-inverse-muted); font-size: var(--tf-size-caption); }
.tf-usp__inner { display: flex; justify-content: space-between; align-items: center; gap: var(--tf-space-5); padding-block: var(--tf-space-2); }
.tf-usp__list { display: flex; flex-wrap: wrap; gap: var(--tf-space-2) var(--tf-space-6); list-style: none; margin: 0; padding: 0; }
.tf-usp__list li { display: flex; align-items: center; gap: var(--tf-space-2); }
.tf-usp__list li::before { content: ""; inline-size: 0.4rem; block-size: 0.4rem; border-radius: var(--tf-radius-dot); background: var(--tf-on-inverse-brand); flex: none; }
.tf-usp a { color: var(--tf-on-inverse); font-weight: 700; text-decoration: none; white-space: nowrap; }
.tf-usp a:hover { text-decoration: underline; text-underline-offset: 0.2em; }

/* ---------- Шапка ---------- */
.tf-site-header {
	position: sticky;
	inset-block-start: 0;
	z-index: var(--tf-layer-header);
	background: var(--tf-header-glass);
	backdrop-filter: blur(10px);
	border-block-end: var(--tf-bw-divider) solid var(--tf-border);
}
.tf-shell {
	inline-size: min(var(--tf-wide-max), calc(100% - var(--tf-gutter) * 2));
	margin-inline: auto;
	min-block-size: var(--tf-header-h);
	display: flex;
	align-items: center;
	gap: var(--tf-space-4);
}
.tf-shell-wide {
	/* tf-native-exception: none — на компактних ширинах семантичною заміною є compact-оболонка. */
	display: none;
}
.tf-wordmark { display: inline-flex; align-items: center; min-block-size: var(--tf-target); flex: 0 1 auto; }
/* Специфічність .tf-wordmark .tf-brand-logo перекриває `.woocommerce img { height:auto }` з WooCommerce. */
.tf-wordmark .tf-brand-logo { block-size: 1.875rem; inline-size: auto; max-inline-size: none; }
.tf-header-actions { display: flex; align-items: center; gap: var(--tf-space-2); margin-inline-start: auto; }
.tf-header-action { text-decoration: none; }
.tf-cart-link { position: relative; }
.tf-cart-count {
	position: absolute;
	inset-block-start: -0.25rem;
	inset-inline-end: -0.25rem;
	display: grid;
	place-items: center;
	min-inline-size: 1.125rem;
	block-size: 1.125rem;
	padding-inline: 0.3rem;
	border-radius: var(--tf-radius-pill);
	background: var(--tf-accent);
	color: var(--tf-on-accent);
	font-family: var(--tf-font-mono);
	font-size: var(--tf-size-label);
	font-weight: 700;
	line-height: 1;
}

/* Навігація (wide) */
.tf-primary-menu { display: flex; flex-wrap: wrap; gap: var(--tf-space-1); list-style: none; margin: 0; padding: 0; }
.tf-primary-menu a {
	display: inline-flex;
	align-items: center;
	min-block-size: var(--tf-control-compact);
	padding: var(--tf-space-2) var(--tf-space-3);
	border-radius: var(--tf-radius-pill);
	font-weight: 600;
	font-size: var(--tf-size-small);
	text-decoration: none;
	color: var(--tf-text);
	transition: background var(--tf-motion-fast) var(--tf-easing);
}
.tf-primary-menu a:hover { background: var(--tf-surface-subtle); }
.tf-primary-menu .current-menu-item > a,
.tf-primary-menu .current-menu-ancestor > a,
.tf-primary-menu a[aria-current="page"] { background: var(--tf-text); color: var(--tf-on-inverse); }

/* Підменю другого рівня (D-02 B): нативне disclosure; посилання батьківського пункту лишається посиланням */
.tf-submenu__toggle { display: inline-grid; place-items: center; min-inline-size: var(--tf-control-compact); min-block-size: var(--tf-control-compact); border-radius: var(--tf-radius-pill); color: var(--tf-text); cursor: pointer; list-style: none; }
.tf-submenu__toggle::-webkit-details-marker { display: none; } /* tf-native-exception: none — шеврон є affordance розкриття. */
.tf-submenu__toggle:hover { background: var(--tf-surface-subtle); }
.tf-submenu__toggle .tf-icon { transition: transform var(--tf-motion-fast) var(--tf-easing); }
.tf-submenu[open] > .tf-submenu__toggle .tf-icon { transform: rotate(180deg); }
.tf-wide-navigation .menu-item-has-children { position: relative; display: inline-flex; align-items: center; }
.tf-wide-navigation .tf-submenu__list {
	position: absolute;
	inset-block-start: calc(100% + var(--tf-space-2));
	inset-inline-start: 0;
	z-index: var(--tf-layer-modal);
	display: grid;
	gap: var(--tf-space-1);
	min-inline-size: 14rem;
	margin: 0;
	padding: var(--tf-space-2);
	list-style: none;
	background: var(--tf-surface);
	border: var(--tf-bw) solid var(--tf-border);
	border-radius: var(--tf-radius-m);
	box-shadow: var(--tf-shadow-overlay);
}
.tf-wide-navigation .tf-submenu__list a { display: flex; inline-size: 100%; border-radius: var(--tf-radius-s); }

/* Пошук */
.tf-search {
	display: flex;
	align-items: center;
	gap: var(--tf-space-2);
	position: relative;
	min-block-size: var(--tf-control-compact);
	padding-inline: var(--tf-space-4) var(--tf-space-1);
	border: var(--tf-bw-control) solid var(--tf-border);
	border-radius: var(--tf-radius-pill);
	background: var(--tf-surface);
	color: var(--tf-text-muted);
	inline-size: 16.25rem;
	max-inline-size: 100%;
}
.tf-search:focus-within { border-color: var(--tf-control-border); }
.tf-search__input {
	flex: 1 1 auto;
	min-inline-size: 0;
	border: 0;
	background: transparent; /* tf-native-exception: transparent — поле вписане у pill-контейнер. */
	color: var(--tf-text);
	font-size: var(--tf-size-small);
	padding-block: var(--tf-space-2);
}
.tf-search__input::placeholder { color: var(--tf-text-muted); }
.tf-search__input:focus-visible { outline: none; } /* tf-native-exception: none — фокус показує контейнер .tf-search:focus-within. */
.tf-search:focus-within { outline: var(--tf-bw-focus) solid var(--tf-focus); outline-offset: var(--tf-space-1); }
.tf-search__input::-webkit-search-cancel-button { appearance: none; }
.tf-search__clear { border: 0; background: transparent; color: var(--tf-text-muted); font-size: var(--tf-size-lede); min-inline-size: var(--tf-target); min-block-size: var(--tf-control-compact); } /* tf-native-exception: transparent. */
.tf-search__submit {
	flex: none;
	min-block-size: 2.125rem;
	padding-inline: var(--tf-space-3);
	border: 0;
	border-radius: var(--tf-radius-pill);
	background: var(--tf-text);
	color: var(--tf-on-inverse);
	font-weight: 700;
	font-size: var(--tf-size-caption);
}
.tf-search__submit:hover { background: var(--tf-accent); color: var(--tf-on-accent); }
.tf-search__results {
	position: absolute;
	inset-block-start: calc(100% + var(--tf-space-2));
	inset-inline: 0;
	z-index: var(--tf-layer-modal);
	display: grid;
	gap: var(--tf-space-1);
	padding: var(--tf-space-2);
	background: var(--tf-surface);
	border: var(--tf-bw) solid var(--tf-border);
	border-radius: var(--tf-radius-m);
	box-shadow: var(--tf-shadow-overlay);
	color: var(--tf-text);
	font-size: var(--tf-size-small);
}
.tf-search__results a { display: flex; align-items: center; min-block-size: var(--tf-control); padding: var(--tf-space-2) var(--tf-space-3); border-radius: var(--tf-radius-s); text-decoration: none; }
.tf-search__results a:hover,
.tf-search__results a:focus-visible { background: var(--tf-surface-subtle); }
.tf-search-disclosure { position: relative; }
.tf-search-disclosure > summary { list-style: none; }
.tf-search-disclosure > summary::-webkit-details-marker {
	/* tf-native-exception: none — іконка є affordance розкриття. */
	display: none;
}
.tf-search-disclosure[open] > summary { background: var(--tf-surface-subtle); border-color: var(--tf-text); }
.tf-search-panel {
	position: absolute;
	inset-block-start: calc(100% + var(--tf-space-3));
	inset-inline-end: 0;
	z-index: var(--tf-layer-modal);
	inline-size: min(26rem, calc(100vw - var(--tf-gutter) * 2));
	padding: var(--tf-space-3);
	background: var(--tf-surface);
	border: var(--tf-bw) solid var(--tf-border);
	border-radius: var(--tf-radius-l);
	box-shadow: var(--tf-shadow-overlay);
}
.tf-search-panel .tf-search { inline-size: 100%; }

/* Drawer (compact) */
.tf-nav-disclosure { flex: none; }
.tf-nav-toggle { list-style: none; }
.tf-nav-toggle::-webkit-details-marker {
	/* tf-native-exception: none — позначена іконка меню є affordance розкриття. */
	display: none;
}
.tf-navigation-panel {
	display: grid;
	gap: var(--tf-space-5);
	align-content: start;
	inline-size: 100%;
}
.tf-nav-disclosure[open] .tf-navigation-panel {
	position: fixed;
	inset-block: 0;
	inset-inline-start: 0;
	z-index: var(--tf-layer-drawer);
	inline-size: min(24rem, calc(100vw - var(--tf-space-6)));
	block-size: 100dvh;
	overflow: auto;
	overscroll-behavior: contain;
	padding: max(var(--tf-gutter), env(safe-area-inset-top)) max(var(--tf-gutter), env(safe-area-inset-right)) max(var(--tf-gutter), env(safe-area-inset-bottom)) max(var(--tf-gutter), env(safe-area-inset-left));
	background: var(--tf-canvas);
	box-shadow: var(--tf-shadow-overlay);
}
[data-tf-nav][data-open]::after {
	content: "";
	position: fixed;
	inset: 0;
	z-index: calc(var(--tf-layer-drawer) - 1);
	background: var(--tf-ink-scrim);
}
html:has([data-tf-nav][data-open]) { overflow: hidden; }
.tf-navigation-panel__head { display: flex; align-items: center; justify-content: space-between; gap: var(--tf-space-3); }
.tf-nav-disclosure:not([open]) .tf-navigation-panel__head { display: none; } /* tf-native-exception: none — шапка панелі потрібна лише у відкритому drawer. */
.tf-primary-menu--drawer { display: grid; gap: 0; }
.tf-primary-menu--drawer a { min-block-size: var(--tf-control); padding-inline: var(--tf-space-1); border-radius: 0; border-block-end: var(--tf-bw-divider) solid var(--tf-border); font-size: var(--tf-size-body); }
.tf-primary-menu--drawer .current-menu-item > a,
.tf-primary-menu--drawer a[aria-current="page"] { background: transparent; color: var(--tf-brand); text-decoration: underline; text-underline-offset: 0.25em; } /* tf-native-exception: transparent. */
/* Підменю у drawer: шеврон на рядку батьківського пункту, вкладений список під ним */
.tf-primary-menu--drawer .menu-item-has-children { position: relative; }
.tf-primary-menu--drawer .menu-item-has-children > a { padding-inline-end: var(--tf-control); }
.tf-primary-menu--drawer .tf-submenu__toggle { position: absolute; inset-block-start: 0; inset-inline-end: 0; min-inline-size: var(--tf-control); min-block-size: var(--tf-control); border-radius: 0; }
.tf-primary-menu--drawer .tf-submenu__list { display: grid; margin: 0; padding: 0 0 0 var(--tf-space-4); list-style: none; }
.tf-primary-menu--drawer .tf-submenu__list a { font-size: var(--tf-size-small); }
.tf-drawer-heading { margin: 0 0 var(--tf-space-2); font-family: var(--tf-font-mono); font-size: var(--tf-size-label); letter-spacing: var(--tf-ls-label); text-transform: uppercase; color: var(--tf-text-muted); }
.tf-drawer-list { display: flex; flex-wrap: wrap; gap: var(--tf-space-2); list-style: none; margin: 0; padding: 0; }
.tf-drawer-list a { display: inline-flex; align-items: center; min-block-size: var(--tf-control-compact); padding: var(--tf-space-2) var(--tf-space-3); border: var(--tf-bw-control) solid var(--tf-border); border-radius: var(--tf-radius-pill); background: var(--tf-surface); font-size: var(--tf-size-small); font-weight: 600; text-decoration: none; }
.tf-drawer-list a:hover { border-color: var(--tf-text); }
.tf-drawer-account-link { display: inline-flex; align-items: center; gap: var(--tf-space-3); min-block-size: var(--tf-control); text-decoration: none; font-weight: 700; }
.tf-drawer-account-label { display: none; } /* tf-native-exception: none — підпис показується лише у drawer. */
.tf-drawer-account-link .tf-drawer-account-label { display: inline; }

/* Глобальний статус (без JS порожній) */
.tf-global-status:empty { display: none; } /* tf-native-exception: none — порожній live-region не займає місця. */
.tf-global-status { position: sticky; inset-block-start: var(--tf-header-h); z-index: var(--tf-layer-toast); inline-size: min(var(--tf-wide-max), calc(100% - var(--tf-gutter) * 2)); margin-inline: auto; padding-block-start: var(--tf-space-3); }

/* ---------- Футер ---------- */
/* Темна «газонна» поверхня з тією самою розміткою поля, що в хіро. Ряд — пропорції сітки концепту (1.6 : 1 : 1 : 1.2):
   бренд ширший, групи — рівні колонки, контакти трохи ширші під номер телефону; частки рахуються від усієї ширини
   (basis 0), тож бренд не забирає весь вільний простір, а слоган під логотипом заповнює свою колонку (власник
   2026-09-23: «перша колонка відірвана від другої»). Скільки груп відрендерив сервер (меню й контакти можуть бути
   порожні) — стільки й колонок, порожніх місць немає. */
.tf-site-footer { position: relative; background: var(--tf-inverse); color: var(--tf-on-inverse-muted); padding-block: var(--tf-space-8) var(--tf-space-5); }
.tf-site-footer::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: repeating-linear-gradient(90deg, var(--tf-field-line) 0 1px, transparent 1px 120px); } /* tf-native-exception: transparent — декоративна розмітка поля, як у хіро. */
.tf-footer-inner { inline-size: min(var(--tf-wide-max), calc(100% - var(--tf-gutter) * 2)); margin-inline: auto; }
.tf-footer-grid { display: flex; gap: var(--tf-space-6) var(--tf-space-7); padding-block-end: var(--tf-space-7); }
.tf-footer-brand { flex: 1.6 1 0; min-inline-size: 0; }
.tf-footer-group { flex: 1 1 0; min-inline-size: 0; }
.tf-footer-group.tf-footer-contacts { flex-grow: 1.2; }
.tf-footer-heading { margin: 0 0 var(--tf-space-3); font-family: var(--tf-font-mono); font-size: var(--tf-size-label); font-weight: 700; line-height: var(--tf-lh-heading); letter-spacing: var(--tf-ls-label); text-transform: uppercase; color: var(--tf-on-inverse-subtle); }
.tf-footer-menu,
.tf-footer-legal { list-style: none; margin: 0; padding: 0; }
.tf-footer-menu { display: grid; font-size: var(--tf-size-small); }
.tf-footer-legal { display: flex; flex-wrap: wrap; gap: 0 var(--tf-space-5); font-size: var(--tf-size-caption); }
.tf-site-footer a { color: inherit; text-decoration: none; transition: color var(--tf-motion-fast) var(--tf-easing); }
.tf-site-footer a:hover { color: var(--tf-on-inverse); text-decoration: underline; text-underline-offset: 0.2em; }
.tf-footer-menu a,
.tf-footer-legal a { display: inline-flex; align-items: center; min-block-size: var(--tf-control-compact); }
.tf-footer-menu [aria-current="page"] { color: var(--tf-on-inverse); font-weight: 600; }
.tf-footer-plate { display: inline-block; padding: var(--tf-space-1) var(--tf-space-3); background: var(--tf-canvas); border-radius: var(--tf-radius-s); }
.tf-wordmark--footer .tf-brand-logo { block-size: 1.625rem; }
.tf-wordmark--drawer .tf-brand-logo { block-size: 1.625rem; }
/* Слоган — базовий кегль на всю колонку бренду; межа 30rem (≈ 58 знаків у рядку) — щоб у широкій колонці рядок лишався читабельним. */
.tf-footer-tagline { margin: var(--tf-space-4) 0 0; max-inline-size: 30rem; font-size: var(--tf-size-body); text-wrap: pretty; }

/* Контакти — редагована template part (core-блоки): телефон, email, графік роботи, соцмережі; порожнє не рендериться. */
.tf-footer-contacts { container-type: inline-size; font-size: var(--tf-size-small); }
.tf-footer-contacts p { margin: 0; }
/* Номер — один рядок: у вузькій колонці кегль зменшується за її шириною (cqi), а не переноситься посеред номера.
   Світлий колір — лише у футері: у Site Editor частина редагується окремо на світлому полотні, і текст має лишатися видимим. */
.tf-footer-phone { font-family: var(--tf-font-display); font-size: min(var(--tf-size-lede), 7.6cqi); font-weight: 700; }
.tf-site-footer .tf-footer-phone { color: var(--tf-on-inverse); }
/* Telegram-підтримка (SupportChat) — першою в групі, телефон частини під нею дрібніше (власник 2026-10-26). */
.tf-footer-telegram { font-size: var(--tf-size-body); font-weight: 700; }
.tf-site-footer .tf-footer-telegram + .wp-block-template-part .tf-footer-phone { font-family: var(--tf-font-body); font-size: var(--tf-size-small); font-weight: 400; }
.tf-footer-telegram a,
.tf-footer-phone a,
.tf-footer-email a { display: inline-flex; align-items: center; min-block-size: var(--tf-control-compact); }
.tf-footer-phone a { white-space: nowrap; }
.tf-footer-email a { overflow-wrap: anywhere; }
.tf-footer-contacts .tf-footer-hours { margin-block-start: var(--tf-space-3); padding: var(--tf-space-3) var(--tf-space-4); border: var(--tf-bw) solid var(--tf-inverse-line); border-radius: var(--tf-radius-m); background: var(--tf-inverse-raised); }
.tf-footer-contacts .tf-footer-hours:first-child { margin-block-start: 0; }
.tf-footer-contacts .tf-footer-subheading { display: flex; align-items: center; gap: var(--tf-space-2); margin: 0 0 var(--tf-space-1); font-family: var(--tf-font-mono); font-size: var(--tf-size-label); font-weight: 700; line-height: var(--tf-lh-heading); letter-spacing: var(--tf-ls-label); text-transform: uppercase; color: var(--tf-on-inverse-subtle); }
/* Циферблат без окремого файлу: коло з рамки + дві стрілки градієнтами кольору тексту. */
.tf-footer-contacts .tf-footer-subheading::before { content: ""; flex: none; box-sizing: border-box; inline-size: 0.875rem; block-size: 0.875rem; border: var(--tf-bw-control) solid currentColor; border-radius: var(--tf-radius-dot); background: linear-gradient(currentColor, currentColor) 50% 28% / 1.5px 36% no-repeat, linear-gradient(currentColor, currentColor) 78% 50% / 36% 1.5px no-repeat; } /* tf-native-exception: currentColor — декоративна іконка успадковує колір підпису. */
.tf-footer-contacts .tf-footer-hours p { color: var(--tf-on-inverse); font-size: var(--tf-size-body); font-weight: 600; text-wrap: balance; }
/* Соцмережі: core/social-links як контурні круглі кнопки 44 px; фірмові кольори core не потрапляють на темну поверхню. */
.tf-site-footer .tf-footer-socials.wp-block-social-links { display: flex; flex-wrap: wrap; gap: var(--tf-space-2); margin: var(--tf-space-4) 0 0; padding: 0; list-style: none; }
.tf-site-footer .tf-footer-socials.wp-block-social-links .wp-social-link { display: flex; inline-size: var(--tf-target); block-size: var(--tf-target); margin: 0; padding: 0; border: var(--tf-bw) solid var(--tf-inverse-line-strong); border-radius: var(--tf-radius-pill); background: transparent; color: var(--tf-on-inverse); transform: none; transition: background-color var(--tf-motion-fast) var(--tf-easing), color var(--tf-motion-fast) var(--tf-easing); } /* tf-native-exception: transparent, none — контурна кнопка на темній поверхні; без масштабування core на hover. */
.tf-site-footer .tf-footer-socials.wp-block-social-links .wp-social-link a { display: grid; place-items: center; inline-size: 100%; block-size: 100%; padding: 0; color: inherit; border-radius: inherit; } /* tf-native-exception: inherit — іконка бере колір і форму кнопки. */
.tf-site-footer .tf-footer-socials.wp-block-social-links .wp-social-link svg { inline-size: 1.25rem; block-size: 1.25rem; fill: currentColor; } /* tf-native-exception: currentColor — іконка успадковує колір кнопки. */
.tf-site-footer .tf-footer-socials.wp-block-social-links .wp-social-link:hover { background: var(--tf-on-inverse); color: var(--tf-inverse); }

/* Нижня смуга — один рядок: «Способи оплати» (погоджені марки на однакових світлих плашках, PaymentMarks) ліворуч,
   далі правові посилання, копірайт і «На початок» біля правого краю. Вільне місце забирає оплата (flex-grow 999 проти 1),
   тож на спільній лінії копірайт стоїть упритул до кнопки; коли не вміщується, кінцівка переходить на власну лінію
   цілою, тягнеться на всю ширину — копірайт ліворуч, кнопка праворуч; у вузькій смузі марки стають під підписом. */
.tf-footer-bottom { display: flex; flex-wrap: wrap; align-items: center; gap: var(--tf-space-3) var(--tf-space-6); padding-block-start: var(--tf-space-5); border-block-start: var(--tf-bw-divider) solid var(--tf-inverse-line); font-size: var(--tf-size-caption); }
.tf-footer-pay { flex: 999 1 auto; display: flex; flex-wrap: wrap; align-items: center; gap: var(--tf-space-3) var(--tf-space-4); }
.tf-footer-pay .tf-footer-heading { margin: 0; }
.tf-footer-pay__list { display: flex; flex-wrap: wrap; gap: var(--tf-space-2); list-style: none; margin: 0; padding: 0; }
.tf-footer-pay__item { display: flex; }
.tf-footer-pay .tf-footer-pay__mark { display: block; inline-size: 3rem; block-size: 2rem; max-inline-size: none; }
.tf-footer-end { flex: 1 1 auto; display: flex; flex-wrap: wrap; align-items: center; gap: var(--tf-space-2) var(--tf-space-5); }
.tf-footer-top { display: inline-flex; align-items: center; gap: var(--tf-space-2); min-block-size: var(--tf-target); margin-inline-start: auto; padding-inline: var(--tf-space-4); border: var(--tf-bw) solid var(--tf-inverse-line-strong); border-radius: var(--tf-radius-pill); font-weight: 600; }
.tf-site-footer .tf-footer-top { color: var(--tf-on-inverse); }
.tf-site-footer .tf-footer-top:hover { background: var(--tf-inverse-raised); text-decoration: none; } /* tf-native-exception: none — hover кнопки показує тло, а не підкреслення. */
.tf-footer-top .tf-icon { inline-size: 1rem; block-size: 1rem; }

/* ---------- Responsive ---------- */
@media (min-width: 64rem) {
	.tf-shell-compact {
		/* tf-native-exception: none — на широких екранах семантичною заміною є wide-оболонка. */
		display: none;
	}
	.tf-shell-wide { display: flex; gap: var(--tf-space-6); }
	.tf-wide-navigation { flex: 1 1 auto; min-inline-size: 0; }
}
@media (min-width: 64rem) and (max-width: 79.99rem) {
	.tf-search { inline-size: 12.5rem; }
	.tf-primary-menu a { padding-inline: var(--tf-space-2); }
	.tf-footer-grid { column-gap: var(--tf-space-6); }
}
@media (max-width: 63.99rem) {
	.tf-shell { min-block-size: var(--tf-header-h-compact); gap: var(--tf-space-3); }
	.tf-global-status { inset-block-start: var(--tf-header-h-compact); }
	.tf-footer-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: var(--tf-space-6); }
	.tf-footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 47.99rem) {
	.tf-usp__list li:not(:first-child) { display: none; } /* tf-native-exception: none — на компактних екранах лишається перша перевага; решта у редагованій частині. */
	.tf-wordmark .tf-brand-logo { block-size: 1.625rem; }
	.tf-site-footer { padding-block-start: var(--tf-space-7); }
	.tf-footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--tf-space-6) var(--tf-space-5); padding-block-end: var(--tf-space-6); }
	.tf-footer-contacts,
	.tf-footer-grid > nav:only-of-type { grid-column: 1 / -1; }
}

/* Обране й порівняння в шапці (іконки з лічильником, як кошик) і в drawer. «Порівняння» з'являється, коли в ньому є
   товари; на найвужчих екранах іконок немає — лише пункти в drawer. */
.tf-saved-link { position: relative; }
@media (max-width: 29.99rem) {
	.tf-shell-compact .tf-saved-link--compare { display: none; } /* tf-native-exception: none — до 480 px іконка порівняння витісняє кошик; порівняння — у drawer і на PDP. */
}
@media (max-width: 23.99rem) {
	.tf-shell-compact .tf-saved-link { display: none; } /* tf-native-exception: none — на 320–383 px у шапці місця лише для пошуку й кошика; обране й порівняння — у drawer. */
}
.tf-drawer-saved { display: grid; gap: var(--tf-space-1); }
.tf-drawer-saved-link { display: inline-flex; align-items: center; gap: var(--tf-space-3); min-block-size: var(--tf-control); text-decoration: none; font-weight: 700; }

/* ---------- Плаваюча плитка Telegram (SupportChat::float_html, 3.1.89) ----------
   Квадрат розміру, кольору й обвідки плитки «12» помічника (assistant.css), без підпису й «хвостика» репліки; стоїть над нею,
   а де помічника немає (оформлення, без JS) — на її місці. Ховається разом із «12»: смужка згоди, шторка меню,
   відкрите вікно помічника; так само піднімається над липкою панеллю покупки й кнопкою кошика. */
.tf-telegram-float { position: fixed; inset-inline-end: var(--tf-space-4); inset-block-end: calc(var(--tf-space-4) + var(--tf-telegram-lift, 0px) + var(--tf-telegram-stack, 0px) + env(safe-area-inset-bottom, 0px)); z-index: calc(var(--tf-layer-sticky) + 1); display: grid; place-items: center; inline-size: 3.25rem; block-size: 3.25rem; background: var(--tf-inverse); color: var(--tf-on-inverse); box-shadow: 0 0 0 2px var(--tf-surface), var(--tf-shadow-overlay); text-decoration: none; }
.tf-telegram-float .tf-icon { inline-size: 1.75rem; block-size: 1.75rem; }
html.tf-js body:has(.tf-assistant-launch[aria-expanded="false"]) .tf-telegram-float { --tf-telegram-stack: calc(3.25rem + var(--tf-space-3)); }
body:has(.tf-sticky-buy:not([hidden])) .tf-telegram-float { --tf-telegram-lift: 4.5rem; }
@media (max-width: 782px) { body:has(.wc-block-cart__submit-container--sticky) .tf-telegram-float { --tf-telegram-lift: 5.25rem; } }
body:has(#tf-analytics-consent:not([hidden])) .tf-telegram-float, body:has(.tf-nav-disclosure[open]) .tf-telegram-float, body:has(.tf-assistant-launch[aria-expanded="true"]) .tf-telegram-float { display: none; } /* tf-native-exception: none — не сперечається зі смужкою згоди, шторкою меню й вікном помічника */
/* Кінець сторінки: плитки не накривають «На початок» і копірайт нижньої смуги футера. */
body:has(.tf-telegram-float) .tf-footer-bottom { padding-block-end: calc(3.25rem + var(--tf-space-5)); }
html.tf-js body:has(.tf-telegram-float):has(.tf-assistant-launch) .tf-footer-bottom { padding-block-end: calc(6.5rem + var(--tf-space-3) + var(--tf-space-5)); }
@media (min-width: 64rem) {
	.tf-telegram-float { inset-inline-end: var(--tf-space-6); inset-block-end: calc(var(--tf-space-6) + var(--tf-telegram-lift, 0px) + var(--tf-telegram-stack, 0px)); }
	body:has(.tf-telegram-float) .tf-footer-bottom { padding-block-end: calc(3.25rem + var(--tf-space-6) + var(--tf-space-3)); }
	html.tf-js body:has(.tf-telegram-float):has(.tf-assistant-launch) .tf-footer-bottom { padding-block-end: calc(6.5rem + var(--tf-space-6) + var(--tf-space-3) * 2); }
}