/* ==========================================================================
   ДВМ — дополнения WordPress к вёрстке (style.css не правим).
   Токены — те же var(--…) из style.css.
   ========================================================================== */

/* ---------- Служебное ---------- */
.skip-link {
  position: absolute;
  top: -100px;
  left: 1rem;
  z-index: 1000;
  padding: 0.8rem 1.2rem;
  color: var(--color-white);
  background: var(--color-accent);
}
.skip-link:focus { top: 1rem; }

.admin-bar .header { top: 32px; }
@media (max-width: 782px) {
  .admin-bar .header { top: 46px; }
}
@media (max-width: 600px) {
  .admin-bar .header { top: 0; }
}

.form__honeypot {
  position: absolute !important;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* ---------- Формы: статус и загрузка ---------- */
.form-status {
  min-height: 1.2em;
  margin: 1.2rem 0 0;
  font-size: 1rem;
  line-height: 1.3;
  color: var(--color-muted);
}
.form-status:empty { display: none; }
.form-status.is-success { color: var(--color-stock); }
.form-status.is-error { color: var(--color-accent); }

form.is-loading [type="submit"] {
  opacity: 0.6;
  pointer-events: none;
}

.request-form__textarea {
  height: auto;
  min-height: 7.5rem;
  padding-block: 1rem;
  resize: vertical;
}

/* ---------- Модалка заявки ---------- */
.modal {
  width: min(52rem, calc(100% - 2 * var(--page-gutter)));
  max-height: calc(100dvh - 3rem);
  padding: 0;
  overflow: auto;
  color: var(--color-text);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
}
.modal::backdrop { background: rgba(10, 10, 10, 0.72); }
.modal[open] { animation: modal-in 0.2s ease; }
@keyframes modal-in {
  from { opacity: 0; transform: translateY(1rem); }
  to { opacity: 1; transform: none; }
}
.modal__box {
  position: relative;
  padding: 3.2rem 2.4rem 2.4rem;
}
@media (min-width: 768px) {
  .modal__box { padding: 3.6rem 3.6rem 3rem; }
}
.modal__close {
  position: absolute;
  top: 1.2rem;
  right: 1.2rem;
  display: grid;
  place-items: center;
  width: 3.2rem;
  height: 3.2rem;
  padding: 0;
  color: var(--color-muted);
  background: transparent;
  border: 0;
  transition: color var(--transition);
}
.modal__close:hover { color: var(--color-gold); }
.modal__title {
  margin-top: 1.2rem;
  font-size: var(--fs-card-title);
}
.modal__subject {
  margin: 1rem 0 0;
  font-size: 1.15rem;
  color: var(--color-gold);
}
.modal__form {
  display: grid;
  gap: 1.6rem;
  margin-top: 2rem;
}
.modal__form .request-form__submit { margin-top: 0.4rem; width: 100%; }
.modal__form .request-form__note { margin-top: 0; }
body.is-modal-open { overflow: hidden; }

/* ---------- Пустые состояния и пагинация ---------- */
.empty-state {
  padding: 3rem 0;
  font-size: 1.3rem;
  color: var(--color-muted);
}
.empty-state a { color: var(--color-gold); text-decoration: underline; text-underline-offset: 2px; }

.pagination {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
  margin-top: 3rem;
}
.pagination .page-numbers {
  display: inline-grid;
  place-items: center;
  min-width: 3.4rem;
  height: 3.4rem;
  padding-inline: 1rem;
  font-size: 1.05rem;
  border: 1px solid var(--color-border);
  transition: border-color var(--transition), color var(--transition);
}
.pagination a.page-numbers:hover { border-color: var(--color-gold); color: var(--color-gold); }
.pagination .page-numbers.current { color: var(--color-white); background: var(--color-accent); border-color: var(--color-accent); }

/* ---------- Текстовая страница и контент редактора ---------- */
.text-page { padding-block: var(--section-pt) var(--section-pb); }
.text-page .title { margin-top: 1.6rem; }
.entry-content {
  max-width: 72rem;
  margin-top: 2.4rem;
  font-size: 1.15rem;
  line-height: 1.6;
}
.entry-content > * + * { margin-top: 1em; }
.entry-content h2,
.entry-content h3 {
  margin-top: 1.8em;
  font-family: var(--font-heading);
  font-weight: 600;
  line-height: 1.15;
  text-transform: uppercase;
}
.entry-content h2 { font-size: 2rem; }
.entry-content h3 { font-size: 1.6rem; }
.entry-content a { color: var(--color-gold); text-decoration: underline; text-underline-offset: 2px; }
.entry-content ul,
.entry-content ol { padding-left: 1.4em; }
.entry-content ul { list-style: disc; }
.entry-content ol { list-style: decimal; }
.entry-content li + li { margin-top: 0.4em; }
.entry-content blockquote {
  margin-inline: 0;
  padding-left: 1.4rem;
  border-left: 2px solid var(--color-gold);
  color: var(--color-muted);
}
.entry-content table { width: 100%; border-collapse: collapse; }
.entry-content th,
.entry-content td { padding: 0.7rem 0.9rem; text-align: left; border: 1px solid var(--color-border); }
.entry-content img { max-width: 100%; height: auto; }
.alignleft { float: left; margin: 0 1.5rem 1rem 0; }
.alignright { float: right; margin: 0 0 1rem 1.5rem; }
.aligncenter { display: block; margin-inline: auto; }
.alignwide,
.alignfull { max-width: none; }
.wp-caption { max-width: 100%; }
.wp-caption-text { font-size: 0.95rem; color: var(--color-muted); }

/* ---------- 404 ---------- */
.not-found { padding-block: 8rem; }
.not-found .title { margin-top: 1.6rem; }
.not-found__text { margin-top: 1.8rem; font-size: 1.3rem; color: var(--color-muted); }
.not-found__actions { display: flex; flex-wrap: wrap; gap: 1.2rem; margin-top: 2.4rem; }

/* ---------- events (events.css) ---------- */
/* Кнопка заявки там, где в вёрстке .button — ссылка. */
button.ticket__button,
button.subscribe__button,
button.upcoming-row__button {
  cursor: pointer;
  appearance: none;
}

/* ---------- museum (museum.css) ---------- */
/* Музей и контакты: iframe карты. Картинка карты стилизуется в style.css. */

iframe.contacts__map {
  display: block;
  height: auto;
  border: 0;
}

/* ---------- shop (shop.css) ---------- */
/* Аппаратура и винил: то, чего нет в вёрстке (карточка товара, пустой фильтр, страница записи). */

.shop-buy {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  height: 3.57rem;
  padding-inline: 1.3rem;
  font-size: 1.15rem;
  line-height: 1;
  white-space: nowrap;
  color: #e6e2dc;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  transition: border-color var(--transition), color var(--transition);
}

.shop-buy:hover {
  border-color: var(--color-gold);
  color: var(--color-gold);
}

.shop-buy:active {
  border-color: var(--color-accent);
  color: var(--color-accent);
}

.gear-head .breadcrumbs + .section-head {
  margin-top: 1.4rem;
}

.filter__count,
.gear-filter__count {
  color: var(--color-muted);
}

/* Категория винила — radio, квадрат как чекбокс жанра. */
.filter__input[type="radio"] {
  appearance: none;
  border: 1px solid var(--color-border);
  background-color: var(--color-bg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 0.72rem 0.72rem;
}

.filter__input[type="radio"]:checked {
  border-color: var(--color-accent);
  background-color: var(--color-accent);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='1.8' d='M2.2 6.2 4.7 8.8 9.8 3.2'/%3E%3C/svg%3E");
}

/* Похожие на сингле: 1 → 2 (768) → 3 (1184). Сетка каталога без модификатора. */
.product-grid--related,
.gear-grid--related {
  grid-template-columns: 1fr;
}

@media (min-width: 768px) {
  .product-grid--related,
  .gear-grid--related {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1184px) {
  .product-grid--related,
  .gear-grid--related {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.gear-card__stock--sold,
.product__stock--sold {
  color: var(--color-muted);
}

.product__stock--sold::before {
  background: var(--color-muted);
}

.gear-card__stock--reserved {
  color: #e6e2dc;
}

.product__stock--reserved::before {
  background: #e6e2dc;
}

.gear-single__media,
.record-single__media {
  display: grid;
  gap: 0.8rem;
  align-content: start;
  min-width: 0;
}

.gear-single__img,
.record-single__img {
  width: 100%;
  aspect-ratio: 426 / 271;
  object-fit: cover;
  object-position: center;
  background: #dcd5c8;
}

.gear-single__img {
  object-fit: contain;
  background: #f5f2ef;
}

.gear-single__thumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
}

.gear-single__thumb {
  width: 7.2rem;
  height: 4.8rem;
  object-fit: contain;
  background: #f5f2ef;
  border: 1px solid var(--color-border);
}

.gear-single .schedule__row,
.record-single .schedule__row {
  grid-template-columns: minmax(8rem, 14rem) minmax(0, 1fr);
  align-items: baseline;
}

.gear-single .schedule__time,
.record-single .schedule__time {
  color: var(--color-muted);
  font-size: 1.15rem;
}

.gear-single .entry-content,
.record-single .entry-content {
  margin-top: 1.66rem;
  font-size: 1.47rem;
  line-height: 1.5;
  color: var(--color-muted);
}

.gear-single .concert__about:not(:has(.concert__text)),
.gear-single .concert__about:not(:has(.schedule)),
.record-single .concert__about:not(:has(.concert__text)),
.record-single .concert__about:not(:has(.schedule)) {
  grid-template-columns: minmax(0, 1fr);
}

.gear-related {
  padding-top: 3rem;
}

.record-related .title--section {
  margin-bottom: 0.4rem;
}

@media (max-width: 767px) {
  .shop-buy {
    height: var(--control-h);
    font-size: 1.2rem;
  }

  .gear-single .entry-content,
  .record-single .entry-content {
    font-size: 1.25rem;
  }

  .gear-single .schedule__row,
  .record-single .schedule__row {
    grid-template-columns: minmax(7rem, 40%) minmax(0, 1fr);
    font-size: 1.2rem;
  }
}

/* ---------- venue (venue.css) ---------- */
/* Ресторан и площадки. Токены и сетка — в style.css. */

/* JS ставит hidden неактивным панелям меню. */
.menu-section [data-tab-panel][hidden] {
	display: none;
}
