.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;
}