.sector-text {
    user-select: none;
    pointer-events: none;
}

/* LOD подписей: при вписанном зале номер места рендерится меньше 5 px и
   всё равно нечитаем. Класс ставит panZoom.js по фактическому масштабу. */
#svgHall.hall-labels-hidden .seat-text {
    display: none;
}


svg#svgHall {
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
}

#svgHall foreignObject {
    user-select: none;
    pointer-events: none;
}

.seat-wrap span {
    color: #fff;
    text-align: center;
    display: block;
}

.stage span {
    color: #fff;
    font-size: 40px;
    text-align: center;
    display: block;
    line-height: 1;
}

.fanzone span {
    color: #444;
    font-size: 32px;
    text-align: center;
    display: block;
    line-height: 1;
}
.label span {
    white-space: nowrap;
    color: #4455;
}

/* Места шаблона circle теперь рисуются скруглённым квадратом (seatShape.js),
   поэтому правило больше не может опираться на имя тега.
   transform-box/origin — чтобы масштаб шёл от центра фигуры: у круга центр
   совпадал с началом координат группы, у прямоугольника — нет. */
.seat-wrap:hover .seat{
    fill: #FF6600;
    stroke: #252121;
    transform: scale(1.1);
    transform-box: fill-box;
    transform-origin: center;
    cursor: pointer;
}
.seat-wrap:hover text{
    fill: #252121;
    /*stroke: #252121;*/
    transform: scale(1.1);
    cursor: pointer;
}

rect:hover #svgHall span {
    color: #000;
}

circle:hover #svgHall span {
    color: #000;
}

.seat[data-available=false],
.fanzone-seat[data-available=false],
.seat[data-price="0"],
.fanzone-seat[data-price="0"] {
    fill: #A2A2A2;
    user-select: none;
    pointer-events: none;
}

.seat.seat-in-reserve {
    fill: #FF0000 !important;
    user-select: auto;
    pointer-events: auto;
}

.seat.seat-in-cart {
    fill: #FF6600 !important;
    user-select: auto;
    pointer-events: auto;
}

.seat.seat-in-reserve:hover {
    fill: #FF0000 !important;
    stroke: #FF0000 !important;
    transform: scale(1);
    cursor: default;
}

.seat.seat-in-cart:hover {
    fill: #FF6600 !important;
    stroke: #FF6600 !important;
    transform: scale(1);
    cursor: default;
}

.seat[data-available=false]:not(.seat-selected) {
    transform: scale(0.5);
    -webkit-transform: scale(0.5);
}

.seat[data-available=true] {
    transform: scale(1);
    -webkit-transform: scale(1);
}

.seat[data-available=false]:not(.seat-selected) + text,
.fanzone-seat[data-available=false]:not(.seat-selected) + text,
.seat[data-price="0"] + text{
    display: none;
}

.seat[data-row^=Tisch] + text {
    display: block !important;
    font-size: 18px !important;
}

.seat-selected {
    fill: #FF0000 !important;
    user-select: auto !important;
    pointer-events: auto !important;
}

.seat-selected:hover {
    stroke: #0f0;
}

.fanzone-seat:hover:not(.gift) {
    fill: #FF6600;
    stroke: #252121;
    transition: all .2s;
    cursor: pointer;
}


.seat[data-hide="true"], .fanzone-seat[data-hide="true"] {
    opacity: 0.3;
}


.tippy-box[data-theme~='afisha'][data-placement^='top'] > .tippy-arrow::before {
    border-top-color: #FF6600;
}
.tippy-box[data-theme~='afisha'][data-placement^='bottom'] > .tippy-arrow::before {
    border-bottom-color: #FF6600;
}
.tippy-box[data-theme~='afisha'][data-placement^='left'] > .tippy-arrow::before {
    border-left-color: #FF6600;
}
.tippy-box[data-theme~='afisha'][data-placement^='right'] > .tippy-arrow::before {
    border-right-color: #FF6600;
}


/*.tippy-box strong {*/
/*    color: #FF6600;*/
/*    font-size: 14px;*/
/*}*/

/*.tippy-box {*/
/*    background-color: #EEEEEE;*/
/*    padding: 4px;*/
/*    border: 2px solid #A6A6A6;*/
/*    border-radius: 2px;*/
/*}*/
/* Рамка выделения добавляла 2px со всех сторон, то есть меняла размер чипа:
   выделенный вырастал с 30px до 42px, ряд подпрыгивал, соседние чипы уезжали
   вниз. Компенсировать это пытались через padding-bottom: 2px у невыделенного —
   отступы стали несимметричными (10 сверху, 2 снизу), и содержимое сидело
   на 4px ниже центра таблетки.

   outline не участвует в раскладке, поэтому геометрия одинакова в обоих
   состояниях; offset рисует рамку внутрь, чтобы она не наезжала на соседей.
   Вертикальные отступы симметричны и держат прежнюю высоту чипа 30px. */
.js-price-item > div {
    padding-top: 6px;
    padding-bottom: 6px;
}
.js-price-item[data-selected="true"] > div {
    outline: 2px solid #FF6600;
    outline-offset: -2px;
}

/* Плашка цены в легенде и фильтре.
   Раньше был кружок 15x15, вписанный в строку 18px: у круга размытый край,
   и лишние 2px снизу в глаза не бросались. У квадрата грани прямые, и он
   заметно свисал ниже цифр. 13px — высота цифр (cap height) шрифта Gilroy
   при 18px; сдвиг компенсирует то, что flex центрирует по line box, где
   снизу заложено место под выносные элементы, а глаз равняется по цифрам. */
.price-swatch {
    width: 13px;
    height: 13px;
    flex: none;
    position: relative;
    top: -1px;
}

/* Строка цены в легенде — она же кнопка фильтра.
   Список читается как справка, поэтому кликабельность приходится обозначать
   явно: курсор, ховер и заметное состояние выбора. Иначе фильтром просто
   не пользуются. */
.price-legend-item {
    padding: 4px 8px;
    margin-left: -8px;
    margin-right: -8px;
    width: calc(100% + 16px);
    border-radius: 8px;
    cursor: pointer;
    transition: background-color .12s ease, opacity .12s ease;
}

.price-legend-item:hover {
    background-color: rgba(255, 102, 0, .12);
}

.price-legend-item[data-selected="true"] {
    background-color: rgba(255, 102, 0, .18);
}

/* Пока фильтр включён, невыбранные цены приглушаем — видно, что показана
   только часть зала. Селектор :has поддерживают все целевые браузеры. */
.price-legend-list:has(.price-legend-item[data-selected="true"])
    .price-legend-item[data-selected="false"] {
    opacity: .45;
}

/* Статусы мест — справка, не кнопки. */
.price-legend-status {
    cursor: default;
}

/* Поверх открытой мобильной корзины всплывашек зала нет (продажи/просмотры,
   истёкшая бронь, ошибки добавления). Закрыта корзина — уведомление,
   если его 10 секунд ещё не истекли, снова видно. */
body:has(.mobile-cart:not(.hidden)) .hall-notification {
    display: none !important;
}

/* Открытая мобильная корзина: страница под ней не прокручивается. Иначе свайп по
   корзине уезжал в документ — название съезжало, в щель над корзиной выглядывала
   легенда цен, а на iOS срабатывал «потяните, чтобы обновить». */
html:has(.mobile-cart:not(.hidden)),
body:has(.mobile-cart:not(.hidden)) {
    overflow: hidden;
    overscroll-behavior: none;
}

.mobile-cart {
    overscroll-behavior: none;
}

/* Докрутили список до края — дальше не передаём (scroll chaining). */
.mobile-cart-scroll {
    overscroll-behavior: contain;
}

/* Ряд цен над мобильной схемой: затемнение у края, за которым есть ещё цены
   (классы ставит price_scroll_controller.js). Маска, а не градиент поверх —
   не надо знать цвет фона в светлой/тёмной теме. Полосу прокрутки прячем:
   на iOS её и так не видно, а в Android/десктопе она серой линией резала ряд. */
.hall-price-scroll {
    scrollbar-width: none;
    --fade-l: 0px;
    --fade-r: 0px;
    -webkit-mask-image: linear-gradient(to right, transparent, #000 var(--fade-l), #000 calc(100% - var(--fade-r)), transparent);
    mask-image: linear-gradient(to right, transparent, #000 var(--fade-l), #000 calc(100% - var(--fade-r)), transparent);
}
.hall-price-scroll::-webkit-scrollbar {
    display: none;
}
.hall-price-scroll.fade-left {
    --fade-l: 32px;
}
.hall-price-scroll.fade-right {
    --fade-r: 40px;
}

/* Заливка-таймер кнопки «Отменить» в мобильной шапке зала (timer_controller::renderProgress):
   последние 2 минуты брони — красная. */
[data-timer-target="progress"].timer-progress-urgent {
    background-color: rgba(239, 68, 68, .45);
}

/* Десктопная схема зала: пока корзина пуста, панель корзины (Hall:Cart, 400 px справа)
   уезжает за край, а её место отдаётся схеме. Первый билет — панель возвращается.
   Размер схемы под новую ширину пересчитывает hall_controller (ResizeObserver → panZoom.resize). */
#tickets.fixed {
    transition: transform .3s ease;
}
.hall-map-cont,
.hall-zoom-btns {
    transition: padding-right .3s ease, right .3s ease;
}
body:has(#tickets[data-cart-empty="1"]) #tickets.fixed {
    transform: translateX(100%);
}
body:has(#tickets[data-cart-empty="1"]) .hall-map-cont {
    padding-right: 90px !important;
}
@media (min-width: 1024px) {
    body:has(#tickets[data-cart-empty="1"]) .hall-zoom-btns {
        right: 24px;
    }
}