/*
 * Главная: hero на всю высоту экрана (минус шапка) + CTA-плитка
 * «See all New Arrivals» в сетке товаров.
 * Перенесено 1:1 из FSE-шаблона Blog Home (P2-1).
 * Логика — header-height.js и cta-tile.js.
 */

:root {
  --header-h: 0px;
}
.uc-hero {
  min-height: calc(100svh - var(--header-h));
  transition: padding-bottom 380ms cubic-bezier(.2, .8, .2, 1);
  will-change: padding-bottom;
}

.uc-cta-tile .woocommerce-loop-product__link {
  display: block;
  height: 100%;
  text-decoration: none;
}
.uc-cta-tile__inner {
  height: 100%;
  min-height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 1rem;
  box-sizing: border-box;
  background-color: var(--wp--preset--color--base-2) !important;
}
.uc-cta-tile__title {
  text-align: center;
}
.uc-cta-tile__sub {
  margin-top: .5rem;
  color: var(--wp--preset--color--contrast-3) !important;
  text-align: center;
}

/* ---------- Переключатель New Arrivals ↔ Back in Stock ---------- */

/*
 * Вкладки живут внутри тега заголовка карусели (inc/home-arrivals.php
 * подменяет им заголовок), поэтому размер, начертание и место в строке
 * достаются им от темы — подбирать на глаз ничего не пришлось.
 */
.mit-arrivals__tabs {
  display: flex;
  align-items: baseline;
  gap: 1rem;
  margin: 0;
}

.mit-arrivals__tabs .mit-arrivals__tab {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  opacity: 0.35;
  transition: opacity 0.2s ease;
}

.mit-arrivals__tabs .mit-arrivals__tab[aria-current="true"] {
  cursor: default;
  opacity: 1;
}

.mit-arrivals__tabs .mit-arrivals__tab:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}

/*
 * Скрытая вкладка убирается атрибутом `hidden`, а не классом: так она не
 * попадает ни в поиск по странице, ни в дерево доступности. Правило нужно
 * явно — авторские стили каруселей перебивают браузерное `[hidden]`.
 */
.mit-arrivals__panel[hidden] {
  display: none;
}