/* План на залата (редактор в планера и печат). Цветовете на заетите места са по страна (planner-seating-render.js). */
.sl-svg {
  width: 100%;
  height: 100%;
  display: block;
  font-family: 'Montserrat', 'Segoe UI', Arial, sans-serif;
  user-select: none;
}
.sl-floor {
  fill: #fff;
  stroke: #e1dcd3;
  stroke-width: 4;
}
.sl-grid-line {
  fill: none;
  stroke: #f0e9dc;
  stroke-width: 2;
}
.sl-element rect {
  fill: #f0e9dc;
  stroke: #8a8175;
  stroke-width: 3;
}
.sl-el-dance rect {
  fill: #faf8f0;
  stroke-dasharray: 16 10;
}
.sl-el-stage rect,
.sl-el-dj rect {
  fill: #ede0c5;
}
.sl-el-wall rect,
.sl-el-column rect {
  fill: #6c6760;
  stroke: #292725;
}
.sl-el-entrance rect {
  fill: #dfeae3;
  stroke: #7f9f8c;
}
.sl-element text {
  font-size: 24px;
  font-weight: 600;
  letter-spacing: 3px;
  fill: #6c6760;
}
.sl-top circle,
.sl-top rect,
.sl-top path {
  fill: #faf8f0;
  stroke: #d0c19e;
  stroke-width: 3;
}
.sl-chair circle {
  stroke: #8a8175;
  stroke-width: 2;
}
.sl-taken circle {
  stroke: #fff;
  stroke-width: 3;
}
.sl-badge {
  font-size: 20px;
  font-weight: 700;
  fill: #fff;
  pointer-events: none;
}
.sl-name {
  font-family: 'Lora', Georgia, serif;
  font-size: 34px;
  font-weight: 700;
  fill: #292725;
  pointer-events: none;
}
.sl-count {
  font-size: 20px;
  font-weight: 600;
  fill: #6c6760;
  pointer-events: none;
}
.sl-selected .sl-top circle,
.sl-selected .sl-top rect,
.sl-selected .sl-top path,
.sl-element.sl-selected rect {
  stroke: #8f6d23;
  stroke-width: 6;
}
.sl-over .sl-top circle,
.sl-over .sl-top rect,
.sl-over .sl-top path {
  stroke: #b42318;
  stroke-width: 6;
}
.sl-over .sl-count {
  fill: #b42318;
}
.sl-target .sl-top circle,
.sl-target .sl-top rect,
.sl-target .sl-top path,
.sl-dropping .sl-top circle,
.sl-dropping .sl-top rect,
.sl-dropping .sl-top path {
  stroke: #7f9f8c;
  stroke-width: 5;
  stroke-dasharray: 10 6;
}
/* Редактор в планера */
.sl-layout {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr) 280px;
  gap: 16px;
  align-items: start;
}
.sl-canvas-wrap {
  display: flex;
  flex-direction: column;
  gap: 8px;
  position: relative;
  min-width: 0;
}
.sl-canvas {
  height: min(72vh, 760px);
  background: #fff;
  border: 1px solid #e1dcd3;
  border-radius: 12px;
  overflow: hidden;
  touch-action: none;
  cursor: grab;
}
.sl-canvas [data-table],
.sl-canvas [data-element] {
  cursor: move;
}
.sl-readonly [data-table],
.sl-readonly [data-element] {
  cursor: pointer;
}
.sl-zoom {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 2;
  display: flex;
  gap: 6px;
}
#planner .sl-zoom button {
  min-height: 36px;
  min-width: 36px;
  padding: 4px 12px;
  background: #fff;
}
.sl-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
  font-size: 13px;
  color: var(--ink-muted);
}
.sl-legend i,
.sl-dot {
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  margin-right: 6px;
  vertical-align: -1px;
  flex: none;
}
.sl-free-dot {
  border: 2px solid var(--line-strong);
  background: #fff;
}
.sl-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 24px;
  align-items: center;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 12px 16px;
}
.sl-group {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.sl-group .pl-eyebrow {
  width: 100%;
}
#planner .sl-group button {
  min-height: 36px;
  padding: 6px 14px;
  font-weight: 500;
}
.sl-group select {
  width: auto;
  margin: 0;
}
.sl-group .check {
  margin: 0;
}
.sl-venue {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 12px 16px;
}
.sl-venue summary {
  cursor: pointer;
  font-weight: 600;
}
.sl-venue-body {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 8px;
}
.sl-venue-body label {
  max-width: 460px;
}
.sl-size {
  display: flex;
  gap: 12px;
}
.sl-size label {
  width: 160px;
}
.sl-lock {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  justify-content: flex-end;
}
.sl-lock .check {
  margin: 0;
}
.sl-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
  align-items: center;
  font-size: 14px;
}
.sl-stats strong {
  font-family: 'Lora', Georgia, serif;
  font-size: 22px;
}
.sl-guests,
.sl-panel {
  padding: 16px;
  gap: 10px;
  max-height: min(80vh, 860px);
  overflow: auto;
}
#planner .sl-guests h2,
#planner .sl-panel h2 {
  font-size: 20px;
  margin: 0;
}
.sl-guests input[type='search'] {
  margin: 0;
}
/* Филтър „Група“ над списъка без маса (етикет над менюто; шрифтът остава 16px – iPhone не увеличава при фокус). */
.sl-group-filter {
  font-size: 13px;
  color: var(--ink-muted);
}
.sl-group-filter select {
  margin-top: 4px;
  min-height: 40px;
  padding: 8px 10px;
}
.sl-sides {
  flex-wrap: wrap;
}
.sl-guest-list,
.sl-party-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.sl-party-list li {
  display: flex;
  align-items: center;
  gap: 4px;
}
#planner .sl-guest {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 8px;
  text-align: left;
  border-radius: 8px;
  padding: 8px 10px;
  min-height: 44px;
  font-weight: 400;
  background: #fff;
  border: 1px solid var(--line);
  cursor: grab;
  touch-action: none;
}
#planner .sl-guest.active {
  border: 2px solid var(--sage);
  background: var(--mint);
}
.sl-guest span {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.sl-guest strong {
  font-size: 14px;
  overflow-wrap: anywhere;
}
.sl-hint {
  font-size: 13px;
}
.sl-ghost {
  position: fixed;
  z-index: 1000;
  pointer-events: none;
  background: #292725;
  color: #fff;
  padding: 6px 12px;
  border-radius: 35px;
  font: 600 13px 'Montserrat', sans-serif;
}
.pl-warn-note {
  border-color: #e7b8b2 !important;
  background: #fbf0ee !important;
}
.sl-row-actions {
  gap: 6px !important;
}
#planner .sl-row-actions button {
  min-height: 36px;
  padding: 6px 12px;
}
.invite-table {
  font-weight: 700;
  font-size: 20px;
}
@media (max-width: 1100px) {
  .sl-layout {
    grid-template-columns: 1fr;
  }
  .sl-guests,
  .sl-panel {
    max-height: none;
  }
  .sl-canvas {
    height: 60vh;
  }
}
/* Печат */
.seating-print .sp-scheme {
  border: 1px solid #e1dcd3;
  margin-bottom: 18px;
}
.seating-print .sp-scheme .sl-svg {
  height: auto;
  max-height: 170mm;
}
.seating-print h2 {
  font-family: 'Lora', Georgia, serif;
  font-weight: 500;
  font-size: 18px;
}
@media print {
  .sp-page {
    break-before: page;
  }
}
.sl-sides {
  display: flex !important;
  flex-wrap: wrap;
  border: none !important;
  padding: 0 !important;
  background: none !important;
}
#planner .sl-sides button {
  border: 1px solid var(--line) !important;
  font-size: 13px;
  padding: 4px 10px !important;
  min-height: 32px !important;
}

/* ---------- Изчистен вид на редактора (28.09.2026) ----------
   Една лента с инструменти, план на залата като „лист“ върху мек фон, бутони за мащаба в ъгъла,
   панел за маса/елемент само когато има избор. */
.sl-svg {
  font-family: 'Montserrat', 'Segoe UI', Arial, sans-serif;
}
.sl-floor {
  fill: #fff;
  stroke: #d8d3ca;
  stroke-width: 3;
}
.sl-grid-line {
  stroke: #f1efeb;
  stroke-width: 1.5;
}
.sl-element rect {
  fill: #f1efeb;
  stroke: #cfc9bf;
  stroke-width: 2.5;
}
.sl-el-dance rect {
  fill: #faf9f7;
  stroke: #d0c19e;
  stroke-width: 3;
  stroke-dasharray: 14 10;
}
.sl-el-stage rect,
.sl-el-dj rect {
  fill: #f3ecdd;
  stroke: #d0c19e;
}
.sl-el-bar rect,
.sl-el-buffet rect {
  fill: #f4f1ec;
  stroke: #cfc9bf;
}
.sl-el-wall rect,
.sl-el-column rect {
  fill: #8a8175;
  stroke: #6c6760;
}
.sl-el-entrance rect {
  fill: #dfeae3;
  stroke: #7f9f8c;
}
.sl-element text {
  font-size: 22px;
  font-weight: 600;
  letter-spacing: 4px;
  fill: #8a8175;
}
.sl-top circle,
.sl-top rect,
.sl-top path {
  fill: #fff;
  stroke: #cdb98f;
  stroke-width: 3;
}
.sl-chair circle {
  stroke: #c9c2b6;
  stroke-width: 2;
}
.sl-name {
  font-size: 30px;
  font-weight: 600;
  fill: #292725;
}
.sl-count {
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 1px;
  fill: #8a8175;
}
.sl-table:hover .sl-top circle,
.sl-table:hover .sl-top rect,
.sl-table:hover .sl-top path {
  stroke: #8f6d23;
}
.sl-selected .sl-top circle,
.sl-selected .sl-top rect,
.sl-selected .sl-top path,
.sl-element.sl-selected rect {
  stroke: #8f6d23;
  stroke-width: 5;
  filter: drop-shadow(0 4px 10px rgba(143, 109, 35, 0.25));
}

/* Лента с инструменти: един ред, групите разделени с тънки линии. */
.sl-tools {
  gap: 0;
  padding: 10px 12px;
  align-items: stretch;
}
.sl-group {
  flex-wrap: nowrap;
  gap: 6px;
  padding: 0 14px;
}
.sl-group + .sl-group {
  border-left: 1px solid var(--line);
}
.sl-group:first-child {
  padding-left: 4px;
}
.sl-group .pl-eyebrow {
  width: auto;
  margin-right: 4px;
  white-space: nowrap;
}
.sl-group-end {
  margin-left: auto;
}
#planner .sl-group .sl-type {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 40px;
  padding: 6px 12px 6px 9px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
}
#planner .sl-group .sl-type svg {
  color: var(--gold);
  flex: none;
}
#planner .sl-group .sl-type:hover {
  border-color: var(--gold-line);
  background: var(--cream);
}
#planner .sl-group #sl-undo {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 40px;
  padding: 6px 14px;
}
.sl-group select {
  min-height: 40px;
  border-radius: 12px;
}
.sl-group .check {
  font-size: 13px;
  white-space: nowrap;
}
/* Предпазно: ако бутоните не се събират на един ред, „Елемент в залата“ минава на следващия (без излизане вдясно). */
.sl-tools {
  flex-wrap: wrap;
  row-gap: 10px;
}
@media (max-width: 1280px) {
  .sl-tools {
    flex-wrap: wrap;
    row-gap: 10px;
  }
  .sl-group-end {
    margin-left: 0;
  }
  .sl-group {
    flex-wrap: wrap;
  }
}

/* Зала и размер + показване на масата/финализиране — на един ред. */
.sl-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: flex-start;
}
.sl-meta .sl-venue {
  flex: 1 1 360px;
  padding: 10px 16px;
}
.sl-meta .sl-venue summary {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 28px;
  font-size: 14px;
}
.sl-meta .sl-venue summary::-webkit-details-marker {
  display: none;
}
.sl-meta .sl-venue summary::after {
  content: '';
  width: 8px;
  height: 8px;
  margin-left: auto;
  border-right: 1.75px solid var(--ink-muted);
  border-bottom: 1.75px solid var(--ink-muted);
  transform: rotate(45deg) translateY(-2px);
  transition: transform 0.2s;
}
.sl-meta .sl-venue[open] summary::after {
  transform: rotate(-135deg) translateY(-2px);
}
.sl-meta .sl-lock {
  margin-left: auto;
  min-height: 50px;
}

/* Работно поле: гости | план (| панел при избор). */
.sl-layout {
  grid-template-columns: 280px minmax(0, 1fr);
  gap: 16px;
}
.sl-layout.has-panel {
  grid-template-columns: 280px minmax(0, 1fr) 300px;
}
.sl-panel[hidden] {
  display: none !important;
}
.sl-canvas-wrap {
  gap: 10px;
}
.sl-canvas {
  height: clamp(520px, calc(100vh - 240px), 880px);
  background-color: var(--bg);
  background-image: radial-gradient(circle, #dcd8d1 1px, transparent 1.2px);
  background-size: 22px 22px;
  border: 1px solid var(--line);
  border-radius: 16px;
  cursor: default;
}
.sl-canvas.sl-zoomed {
  cursor: grab;
}
.sl-canvas.sl-zoomed:active {
  cursor: grabbing;
}
.sl-canvas .sl-floor {
  filter: drop-shadow(0 6px 18px rgba(41, 39, 37, 0.08));
}
/* Мащаб: кръгли бутони в долния десен ъгъл на плана. */
.sl-zoom {
  top: auto;
  bottom: 52px;
  right: 14px;
  gap: 2px;
  padding: 4px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 35px;
  box-shadow: 0 6px 18px rgba(41, 39, 37, 0.1);
}
#planner .sl-zoom button {
  width: 36px;
  min-width: 36px;
  height: 36px;
  min-height: 36px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--ink);
}
#planner .sl-zoom button:hover:not(:disabled) {
  background: var(--paper-sunk);
}
#planner .sl-zoom button:disabled {
  opacity: 0.35;
}
.sl-legend {
  gap: 8px;
  font-size: 12px;
}
.sl-legend > span {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border: 1px solid var(--line);
  border-radius: 35px;
  background: #fff;
}
.sl-help {
  margin: 0;
  max-width: 900px;
  font-size: 13px;
  line-height: 1.6;
  color: var(--ink-muted);
}

/* Списък „Без маса“: редове с разделители вместо отделни рамки. */
.sl-guests {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-height: clamp(520px, calc(100vh - 200px), 920px);
}
#planner .sl-guests h2 {
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.sl-guest-list {
  gap: 0;
  margin: 0 -8px;
}
.sl-guest-list li + li {
  border-top: 1px solid var(--line);
}
#planner .sl-guest-list .sl-guest {
  min-height: 48px;
  padding: 8px;
  border: 0;
  border-radius: 10px;
  background: none;
  gap: 10px;
}
#planner .sl-guest-list .sl-guest:hover {
  background: var(--cream);
}
#planner .sl-guest-list .sl-guest.active {
  border: 0;
  background: var(--mint);
  box-shadow: inset 0 0 0 2px var(--sage);
}
.sl-guest small {
  font-size: 12px;
  color: var(--ink-muted);
}
.sl-guest-list li:hover + li,
.sl-guest-list li:hover {
  border-color: transparent;
}

/* Панел на избраната маса/елемент. */
.sl-panel {
  position: sticky;
  top: 72px;
}
.sl-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}
#planner .sl-panel-close {
  flex: none;
  width: 36px;
  min-width: 36px;
  height: 36px;
  min-height: 36px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--ink-muted);
}
#planner .sl-panel-close:hover {
  background: var(--paper-sunk);
  color: var(--ink);
}
@media (max-width: 1100px) {
  .sl-layout,
  .sl-layout.has-panel {
    grid-template-columns: 1fr;
  }
  .sl-panel {
    position: static;
  }
  .sl-canvas {
    height: 62vh;
  }
}
#planner .sl-group #sl-undo {
  width: 40px;
  min-width: 40px;
  padding: 0;
  justify-content: center;
  border-radius: 50%;
}
#planner .sl-zoom #sl-undo {
  width: 36px;
  min-width: 36px;
  border-radius: 50%;
}
.sl-zoom {
  align-items: center;
}
.sl-zoom-sep {
  width: 1px;
  height: 20px;
  margin: 0 4px;
  background: var(--line);
}
.sl-snap-toggle {
  position: relative;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--ink-muted);
  cursor: pointer;
  margin: 0;
}
.sl-snap-toggle input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
}
.sl-snap-toggle:has(input:checked) {
  background: var(--gold-soft);
  color: var(--gold-ink);
}
.sl-snap-toggle:has(input:focus-visible) {
  outline: 2px solid var(--gold-deep);
  outline-offset: 2px;
}
.sl-snap-toggle:hover {
  background: var(--paper-sunk);
}
/* Колоната вдясно е винаги на място: преглед на масите или избраната маса. */
.sl-layout,
.sl-layout.has-panel {
  grid-template-columns: 270px minmax(0, 1fr) 290px;
}
.sl-canvas {
  height: auto;
  max-height: calc(100vh - 150px);
  min-height: 360px;
  width: 100%;
}
.sl-canvas-wrap > .sl-zoom {
  top: 12px;
  right: 12px;
  bottom: auto;
}
.sl-count-chip {
  min-width: 26px;
  padding: 2px 8px;
  border-radius: 35px;
  background: var(--paper-sunk);
  color: var(--ink-muted);
  font-size: 12px;
  font-weight: 600;
  text-align: center;
}
.sl-panel-head {
  align-items: center;
}
.sl-panel-hint {
  margin: 0;
  font-size: 13px;
  line-height: 1.55;
}
.sl-table-list {
  list-style: none;
  margin: 4px -8px 0;
  padding: 0;
}
.sl-table-list li + li {
  border-top: 1px solid var(--line);
}
#planner .sl-table-item {
  width: 100%;
  min-height: 52px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px;
  border: 0;
  border-radius: 10px;
  background: none;
  text-align: left;
  font-weight: 400;
}
#planner .sl-table-item:hover {
  background: var(--cream);
}
.sl-table-icon {
  flex: none;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--paper-sunk);
  color: var(--gold);
}
.sl-table-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.sl-table-info strong {
  font-size: 14px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sl-meter {
  display: block;
  height: 4px;
  border-radius: 2px;
  background: var(--paper-sunk);
  overflow: hidden;
}
.sl-meter span {
  display: block;
  height: 100%;
  border-radius: 2px;
  background: var(--gold-line);
}
.sl-table-item.is-full .sl-meter span {
  background: var(--success);
}
.sl-table-item.is-over .sl-meter span {
  background: var(--danger);
}
.sl-table-item small {
  flex: none;
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-muted);
  font-variant-numeric: tabular-nums;
}
.sl-table-item.is-full small {
  color: var(--success);
}
.sl-table-item.is-over small {
  color: var(--danger);
}
/* Оркестър: като „Сцена“ и „DJ“ — светъл фон, тънки контури на инструментите в цветовете на масите. */
.sl-el-orchestra > rect {
  fill: #f3ecdd;
  stroke: #d0c19e;
  stroke-width: 2.5;
}
.sl-orch .sl-orch-icon path {
  fill: none;
  stroke: #b59a63;
  stroke-width: 1.1;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.sl-el-orchestra.sl-selected > rect {
  stroke: #8f6d23;
  stroke-width: 5;
}

/* Цял екран за „Маси“ (body.pl-wide от planner.js). */
body.pl-wide main.portal {
  max-width: 1600px;
  padding-left: clamp(16px, 3vw, 48px);
  padding-right: clamp(16px, 3vw, 48px);
}
body.pl-wide .sl-layout,
body.pl-wide .sl-layout.has-panel {
  grid-template-columns: 250px minmax(0, 1fr) 270px;
  gap: 14px;
}
body.pl-wide .sl-canvas {
  max-height: calc(100vh - 190px);
}
@media (max-width: 1100px) {
  body.pl-wide .sl-layout,
  body.pl-wide .sl-layout.has-panel {
    grid-template-columns: 1fr;
  }
}

/* Лявата колона: „Без маса“ | „Маси“ — планът стига до десния край. */
.sl-layout,
.sl-layout.has-panel,
body.pl-wide .sl-layout,
body.pl-wide .sl-layout.has-panel {
  grid-template-columns: 290px minmax(0, 1fr);
}
.sl-side {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
}
.sl-side > [hidden] {
  display: none !important;
}
.sl-side-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  padding: 4px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 35px;
}
#planner .sl-side-tabs button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 40px;
  padding: 6px 12px;
  border: 0;
  border-radius: 35px;
  background: none;
  color: var(--ink);
  font-size: 14px;
  font-weight: 500;
}
#planner .sl-side-tabs button:hover {
  background: var(--paper-sunk);
}
#planner .sl-side-tabs button[aria-selected='true'] {
  background: var(--gold-soft);
  color: var(--gold-ink);
  font-weight: 600;
}
.sl-side-tabs button span {
  min-width: 22px;
  padding: 1px 7px;
  border-radius: 35px;
  background: rgba(255, 255, 255, 0.7);
  font-size: 12px;
  font-weight: 600;
}
.sl-side .sl-panel {
  position: static;
  max-height: clamp(520px, calc(100vh - 200px), 920px);
  overflow: auto;
}
.sl-visually-hidden {
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
@media (max-width: 1100px) {
  .sl-layout,
  .sl-layout.has-panel,
  body.pl-wide .sl-layout,
  body.pl-wide .sl-layout.has-panel {
    grid-template-columns: 1fr;
  }
}
/* Столове: седалка и облегалка, с лице към масата. Заетите — в цвета на страната. */
.sl-chair-seat,
.sl-chair-back {
  stroke: #c9c2b6;
  stroke-width: 1.5;
}
.sl-chair-back {
  fill-opacity: 1;
}
.sl-chair:not(.sl-taken) .sl-chair-back {
  fill: #f1efeb;
}
.sl-taken .sl-chair-seat {
  fill-opacity: 0.82;
  stroke: #fff;
}
.sl-taken .sl-chair-back {
  stroke: #fff;
}
.sl-chair:hover .sl-chair-seat {
  stroke: #8f6d23;
}
/* Имена — етикет-лента от ръба на зоната през стола към центъра (бутон „Т“ при плана). */
.sl-tag {
  pointer-events: none;
  filter: drop-shadow(0 1px 1.5px rgba(41, 39, 37, 0.16));
}
.sl-tag rect {
  fill: rgba(255, 255, 255, 0.95);
  stroke-width: 1.2;
}
.sl-tag text {
  font-family: 'Montserrat', 'Segoe UI', Arial, sans-serif;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0;
  fill: #3a3632;
}
.sl-compact .sl-name {
  font-size: 22px;
}
.sl-compact .sl-count {
  font-size: 13px;
  transform: translateY(-9px);
}
#planner .sl-zoom .sl-toggle {
  width: 36px;
  min-width: 36px;
  border-radius: 50%;
}
#planner .sl-zoom .sl-toggle[aria-pressed='true'] {
  background: var(--gold-soft);
  color: var(--gold-ink);
}

/* Безопасна зона около масите (бутон при плана; разстоянието — в „Зала и размер“). */
.sl-zones {
  pointer-events: none;
}
.sl-zone circle,
.sl-zone rect,
.sl-zone path {
  fill: rgba(208, 193, 158, 0.07);
  stroke: #cdb98f;
  stroke-width: 1.5;
  stroke-dasharray: 7 7;
  opacity: 0.75;
  transition:
    fill 0.2s,
    stroke 0.2s;
}
.sl-zone.sl-zone-bad circle,
.sl-zone.sl-zone-bad rect,
.sl-zone.sl-zone-bad path {
  fill: rgba(168, 71, 92, 0.07);
  stroke: #a8475c;
  stroke-width: 2;
  opacity: 1;
}
.sl-clear-warn {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 8px 14px;
  border: 1px solid #e7c3cb;
  border-radius: 35px;
  background: #fbf1f3;
  color: #8a3246;
  font-size: 13px;
  font-weight: 500;
}
.sl-clear-warn::before {
  content: '';
  flex: none;
  width: 12px;
  height: 12px;
  border: 1.5px dashed #a8475c;
  border-radius: 50%;
}
.sl-clear-warn[hidden] {
  display: none;
}
/* Детско столче: бебешко-син пръстен, малка седалка, бяла поставка и фигурка на дете. */
.sl-chair .sl-kid-ring,
.sl-taken .sl-kid-ring {
  fill: #e7f0f8;
  stroke: #5f8fbd;
  stroke-width: 3;
}
.sl-taken circle.sl-kid-glyph {
  stroke: none;
}
.sl-kid-tray {
  fill: #fff;
  stroke: #5f8fbd;
  stroke-width: 1.5;
}
.sl-taken .sl-kid .sl-chair-seat,
.sl-taken .sl-kid .sl-chair-back {
  fill-opacity: 1;
  stroke: #fff;
  stroke-width: 1;
}
.sl-kid-glyph {
  fill: #fff;
  pointer-events: none;
}
.sl-legend .sl-kid-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #e7f0f8;
  border: 2px solid #5f8fbd;
  margin-right: 6px;
}

/* Плъзгач за разстоянието между масите (до бутона за зоната). */
.sl-clear-ctl {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 4px 0 2px;
  padding: 0 10px 0 8px;
  height: 32px;
  border-radius: 35px;
  background: var(--paper-sunk);
}
.sl-clear-ctl[hidden] {
  display: none;
}
.sl-clear-ctl input[type='range'] {
  width: 110px;
  margin: 0;
  padding: 0;
  border: 0;
  box-shadow: none;
  background: none;
  accent-color: var(--gold);
  cursor: pointer;
}
.sl-clear-ctl output {
  min-width: 44px;
  font-size: 12px;
  font-weight: 600;
  color: var(--gold-ink);
  font-variant-numeric: tabular-nums;
  text-align: right;
}

/* Бутоните на плана са в лента над схемата (не плуват върху масите). */
.sl-canvas-wrap > .sl-zoom {
  position: static;
  align-self: flex-end;
  top: auto;
  right: auto;
  bottom: auto;
  z-index: auto;
  flex-wrap: wrap;
  justify-content: flex-end;
  box-shadow: none;
}

/* „Зала и размер“ на половин ширина, до него — настройките на визуализатора. */
.sl-meta {
  align-items: flex-start;
  flex-wrap: nowrap;
}
.sl-meta .sl-venue {
  flex: 0 1 50%;
  min-width: 0;
}
.sl-meta > .sl-zoom {
  position: static;
  margin-left: auto;
  flex-wrap: wrap;
  justify-content: flex-end;
  box-shadow: none;
}
.sl-show-table {
  margin-top: 6px;
  font-size: 14px;
}
@media (max-width: 900px) {
  .sl-meta {
    flex-wrap: wrap;
  }
  .sl-meta .sl-venue {
    flex-basis: 100%;
  }
}

/* Ред над плана: „Без маса | Маси“ (над колоната с гостите), „Зала и размер“ и бутоните на визуализатора —
   еднакви бели заоблени ленти с височина 52px и тънка рамка. */
.sl-meta {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  flex-wrap: nowrap;
}
.sl-meta > .sl-side-tabs {
  flex: 0 0 290px;
  box-sizing: border-box;
  height: 52px;
  padding: 5px;
  border-radius: 35px;
}
.sl-meta > .sl-venue {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 52px;
  box-sizing: border-box;
  padding: 0 22px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 26px;
}
.sl-meta > .sl-venue summary {
  min-height: 50px;
  font-size: 14px;
  font-weight: 600;
}
.sl-meta > .sl-venue[open] {
  border-radius: 20px;
  padding-bottom: 16px;
}
.sl-meta > .sl-zoom {
  flex: none;
  box-sizing: border-box;
  height: 52px;
  padding: 0 8px;
  margin-left: 0;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 35px;
  flex-wrap: nowrap;
}
.sl-meta > .sl-venue + .sl-zoom,
.sl-meta > .sl-side-tabs + .sl-zoom {
  margin-left: auto;
}
body.pl-wide .sl-layout,
body.pl-wide .sl-layout.has-panel,
.sl-layout {
  grid-template-columns: 290px minmax(0, 1fr);
}
@media (max-width: 1100px) {
  .sl-meta {
    flex-wrap: wrap;
  }
  .sl-meta > .sl-side-tabs,
  .sl-meta > .sl-venue {
    flex-basis: 100%;
  }
  body.pl-wide .sl-layout,
  .sl-layout {
    grid-template-columns: 1fr;
  }
}

/* Горна лента: масите вляво, елементите в залата вдясно — всички контроли в един стил. */
.sl-tools {
  flex-wrap: nowrap;
}
.sl-tools .sl-group-end {
  margin-left: auto;
}
.sl-tools .sl-group select {
  height: 40px;
  min-height: 40px;
  padding: 0 34px 0 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background-color: #fff;
  font-size: 13px;
  font-weight: 500;
  color: var(--ink);
  cursor: pointer;
}
.sl-tools .sl-group select:hover {
  border-color: var(--gold-line);
  background-color: var(--cream);
}
#planner .sl-tools #sl-add-el svg {
  color: var(--gold);
}
@media (max-width: 1280px) {
  .sl-tools {
    flex-wrap: wrap;
  }
}

/* BUG-11: на телефон лентата над плана (Без маса | Маси, зала, мащаб) се пренася, вместо да разпъва страницата. */
@media (max-width: 700px) {
  .sl-meta {
    flex-wrap: wrap;
  }
  .sl-meta > .sl-side-tabs {
    flex: 1 1 100%;
    max-width: 100%;
  }
  .sl-meta > .sl-zoom {
    flex: 1 1 100%;
    flex-wrap: wrap;
    height: auto;
    max-width: 100%;
    min-height: 52px;
    padding: 4px 8px;
    justify-content: center;
    border-radius: 26px;
  }
  .sl-meta > .sl-venue + .sl-zoom,
  .sl-meta > .sl-side-tabs + .sl-zoom {
    margin-left: 0;
  }
}
/* Размер на масата (072): дължина/ширина, диаметър, страна; дъговидна – радиус, ширина, ъгъл. */
.sl-size-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 10px;
}
.sl-size-fields:has([data-size-key='sweep']) {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.sl-size-field {
  display: flex;
  flex-direction: column;
  /* Надпис на два реда („Вътрешен радиус“) – полетата в реда остават на една линия. */
  justify-content: space-between;
  gap: 4px;
  margin: 0;
  font-size: 13px;
  color: var(--ink-muted);
}
.sl-size-wide {
  grid-column: 1 / -1;
}
/* 16px – iPhone не увеличава при фокус. */
#planner .sl-size-field input {
  min-height: 40px;
  font-size: 16px;
  margin: 0;
}
.sl-size-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
#planner .sl-size-chip {
  min-height: 36px;
  padding: 4px 14px;
  font-size: 13px;
  background: var(--paper);
  border: 1px solid var(--line);
  color: var(--ink);
}
#planner .sl-size-chip[aria-pressed='true'] {
  background: var(--gold-soft);
  border-color: var(--gold);
  color: var(--gold-ink);
}
.sl-size-both {
  margin-top: 10px;
  font-size: 14px;
}
.sl-size-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 10px;
}
.sl-size-note {
  flex: 1 1 140px;
  margin: 0;
  font-size: 13px;
  line-height: 18px;
}
.sl-size-warn {
  padding: 6px 8px;
  border: 1px solid #e7b8b2;
  border-radius: 8px;
  background: #fbf0ee;
  color: var(--danger);
}
#planner #sl-t-auto {
  min-height: 36px;
  padding: 6px 14px;
  font-size: 13px;
}
/* Фугите между сегментите на дъговидната маса: тънка линия в цвета на плота, без пълнеж. */
.sl-table .sl-top path.sl-seam {
  fill: none;
  stroke: #d0c19e;
  stroke-width: 1.5;
  stroke-linecap: round;
  pointer-events: none;
}
/* Снадени маси (fix/rect-join): снадките са .sl-seam (горе); „3×180“ до заетостта в надписа на масата; в панела – чип
   „3 маси × 180 см · общо 540 см“ с „×“ (махни последната) и „+ Продължи“ (бутоните са тези на сегментите на дъгата). */
/* „· 3×180“ – tspan в заетостта (tableSvg); резервният цвят е за печата (там style.css с токените не се зарежда). */
.sl-count .sl-join {
  fill: var(--gold, #8f6d23);
}
/* При четен брой маси средната снадка минава под надписа – бял ореол около буквите (цветът на плота), само при снадени. */
.sl-joined .sl-name,
.sl-joined .sl-count {
  paint-order: stroke;
  stroke: #fff;
  stroke-width: 8px;
  stroke-linejoin: round;
}
.sl-join-row {
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 0 0 6px;
}
.sl-join-chip {
  flex: 1 1 auto;
  min-width: 0;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--cream);
  font-size: 13px;
  font-weight: 600;
  color: var(--gold-ink);
  font-variant-numeric: tabular-nums;
}
.sl-join-total {
  display: block;
  font-size: 12px;
  font-weight: 500;
  color: var(--ink-muted);
}
/* „−“ (махни последната) и „+ Продължи“ – двойка; „−“ е неутрален (не е изтриване на данни), като „−“ на „Места“. */
.sl-join-acts {
  display: flex;
  gap: 6px;
  margin: 0;
}
#planner .sl-join-del {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  min-width: 44px;
  min-height: 44px;
  padding: 0;
}
#planner .sl-join-del:disabled {
  opacity: 0.4;
}
#planner .sl-fpanel .sl-join-del {
  width: 30px;
  min-width: 30px;
  min-height: 30px;
}
.sl-fpanel .sl-join-del svg {
  width: 14px;
  height: 14px;
}
@media (min-width: 900px) and (pointer: fine) {
  #planner .sl-join-del {
    width: 36px;
    min-width: 36px;
    min-height: 34px;
  }
}
@media (pointer: coarse) {
  #planner .sl-fpanel .sl-join-del {
    width: 44px;
    min-width: 44px;
    min-height: 44px;
  }
}
.sl-join-hint {
  margin: 6px 0 0;
  font-size: 12px;
  line-height: 1.4;
}
.sl-fpanel .sl-join-row {
  margin-bottom: 4px;
}
.sl-fpanel .sl-join-chip {
  padding: 4px 8px;
  font-size: 12px;
}
/* QA-SD-03: невидима зона по плота на дъговидната маса – само при тъч (с мишка празното място до масата пак мести плана).
   Ширината (--sl-hit-w, plsArcHits): ~40 px на екрана, 82–160 см; под столовете на масата, които остават свои цели. */
.sl-table .sl-hit path {
  fill: none;
  stroke: none;
  pointer-events: none;
}
@media (pointer: coarse) {
  .sl-table .sl-hit path {
    stroke-width: var(--sl-hit-w, 82);
    stroke-linejoin: round;
    pointer-events: stroke;
  }
}

/* Секциите на панела на масата (Маса, Размер и форма, Места, Положение, Гости на масата). */
.sl-sec {
  margin: 0 0 8px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}
.sl-sec-sum {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 44px;
  padding: 0 14px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold-ink);
  cursor: pointer;
  list-style: none;
}
.sl-sec-sum::-webkit-details-marker {
  display: none;
}
.sl-sec-sum::after {
  content: '';
  width: 7px;
  height: 7px;
  margin-right: 2px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg);
  transition: transform 0.15s ease;
}
.sl-sec[open] > .sl-sec-sum::after {
  transform: rotate(-135deg);
}
.sl-sec-sum:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: -2px;
  border-radius: 12px;
}
.sl-sec-body {
  padding: 2px 12px 10px;
}
.sl-sec-body .pl-actions {
  margin-top: 8px;
}
.sl-stepper {
  display: flex;
  align-items: center;
  gap: 6px;
}
.sl-stepper input {
  min-width: 0;
  text-align: center;
}
#planner .sl-stepper button {
  flex: none;
  width: 44px;
  min-height: 44px;
  padding: 0;
}
.sl-angle-field {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: 13px;
  color: var(--ink-muted);
}
.sl-angle-field input {
  width: 84px;
}
.sl-danger-zone {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px dashed var(--line);
}
#planner .sl-danger-zone button {
  min-height: 44px;
  color: var(--danger);
  border-color: #e7b8b2;
}
.sl-seg-box {
  margin-top: 8px;
}
.sl-seg-title {
  margin: 0 0 4px;
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-muted);
}
.sl-seg-list {
  display: grid;
  gap: 4px;
  margin: 0 0 6px;
  padding: 0;
  list-style: none;
}
.sl-seg-row {
  display: grid;
  grid-template-columns: 24px auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 4px;
  padding: 2px 4px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--cream);
}
.sl-seg-row-first {
  grid-template-columns: 24px minmax(0, 1fr) auto;
  min-height: 32px;
}
.sl-seg-no {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--gold-soft);
  font-size: 13px;
  font-weight: 600;
  color: var(--gold-ink);
}
.sl-seg-first {
  font-size: 13px;
}
.sl-seg-kinds {
  display: flex;
  gap: 2px;
}
#planner .sl-seg-kind {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  padding: 4px 8px;
}
#planner .sl-seg-row .sl-seg-sweep {
  width: 100%;
  min-width: 0;
  padding: 4px 8px;
  min-height: 44px;
  margin: 0;
  font-size: 16px;
}
#planner .sl-seg-row .sl-seg-sweep::-webkit-inner-spin-button,
#planner .sl-seg-row .sl-seg-sweep::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
#planner .sl-seg-row .sl-seg-sweep {
  -moz-appearance: textfield;
  appearance: textfield;
}
#planner .sl-seg-del {
  min-height: 44px;
  width: 44px;
  padding: 0;
  font-size: 20px;
  line-height: 1;
  color: var(--danger);
  border: 1px solid #e7b8b2;
  background: var(--paper);
}
#planner .sl-seg-add {
  min-height: 44px;
}
.sl-seg-acts {
  display: inline-flex;
  gap: 2px;
}
/* Скрий / покажи маса от веригата (073). */
#planner .sl-seg-eye {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  width: 44px;
  padding: 0;
  border: 1px solid var(--line);
  background: var(--paper);
  color: var(--ink);
}
#planner .sl-seg-eye[aria-pressed='true'] {
  background: var(--gold-soft);
  color: var(--gold-ink);
}
#planner .sl-seg-eye:disabled {
  opacity: 0.4;
}
.sl-seg-gone .sl-seg-no,
.sl-seg-gone .sl-seg-first {
  opacity: 0.55;
}
@media (min-width: 900px) and (pointer: fine) {
  #planner .sl-seg-kind,
  #planner .sl-seg-row .sl-seg-sweep,
  #planner .sl-seg-del,
  #planner .sl-seg-eye,
  #planner .sl-seg-add {
    min-height: 34px;
  }
  #planner .sl-seg-kind {
    min-width: 32px;
    padding: 4px;
  }
  .sl-seg-row {
    grid-template-columns: 24px auto minmax(0, 1fr) auto;
  }
  #planner .sl-seg-del,
  #planner .sl-seg-eye {
    width: 36px;
  }
}
/* Махнати столове (072): едва видимо прекъснато очертание само в редактора (в печата и изгледите го няма); при посочване
   и фокус – малко по-видимо, за да се разбере, че столът може да се върне. Цветът на линията е --line-strong при 0.18 –
   на екрана изглежда като --line (самото --line при тази прозрачност изчезва на белия фон). */
.sl-gap {
  opacity: 0.18;
  cursor: pointer;
}
.sl-gap:hover,
.sl-gap:focus-visible {
  opacity: 0.45;
}
.sl-gap-seat,
.sl-gap-back {
  fill: none;
  stroke: var(--line-strong);
  stroke-width: 1.5;
  stroke-dasharray: 4 3;
}
/* Махнат сегмент на дъговидна маса (073): като махнатия стол – едва видимо прекъснато очертание само в редактора; на
   избраната маса – бутон (посочване / фокус го правят по-видим). Видимият сегмент има само невидима зона за докосване. */
.sl-seg-off {
  fill: none;
  stroke: var(--line-strong);
  stroke-width: 2;
  stroke-dasharray: 6 4;
  opacity: 0.18;
  cursor: pointer;
}
.sl-seg-off:focus,
.sl-seg-hit:focus {
  outline: none;
}
.sl-seg-off:hover,
.sl-seg-off:focus-visible {
  opacity: 0.45;
}
.sl-seg-off:focus-visible {
  outline: none;
  stroke: var(--gold);
  stroke-width: 4;
}
.sl-seg-hit {
  fill: transparent;
  stroke: none;
  cursor: pointer;
}
.sl-seg-hit:focus-visible {
  outline: none;
  stroke: var(--gold);
  stroke-width: 3;
}
/* Невидимата зона за докосване на столовете на избраната маса (радиусът – plsChairHits, поне 44 px, ако има място). */
.sl-chair .sl-chair-hit {
  fill: transparent;
  stroke: none;
}
.sl-chair[tabindex] {
  cursor: pointer;
  outline: none;
}
.sl-chair[tabindex]:focus-visible .sl-chair-seat,
.sl-gap:focus-visible .sl-gap-seat {
  stroke: var(--gold);
  stroke-width: 4;
}
/* Менюто на стола: малка карта до стола, над плана. */
.sl-chair-menu {
  position: absolute;
  z-index: 6;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 180px;
  max-width: 240px;
  padding: 10px 12px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: 0 6px 18px rgba(41, 39, 37, 0.12);
  font-size: 0.875rem;
}
.sl-chair-menu:focus {
  outline: none;
}
.sl-chair-menu p {
  margin: 0;
}
.sl-chair-menu-title {
  font-family: 'Lora', Georgia, serif;
  font-weight: 600;
  color: var(--ink);
}
.sl-chair-menu button {
  min-height: 44px;
}
/* fix/seat-shrink (б): празен стол – два малки кръгли бутона до него („×“ махни и подреди, „Скрий“ – празно място). */
.sl-chair-menu.sl-chair-pair {
  flex-direction: row;
  gap: 8px;
  min-width: 0;
  padding: 0;
  background: none;
  border: 0;
  box-shadow: none;
}
#planner .sl-chair-menu .sl-chair-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  min-width: 40px;
  height: 40px;
  min-height: 40px;
  padding: 0;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  background: var(--paper);
  color: var(--ink);
  box-shadow: 0 4px 12px rgba(41, 39, 37, 0.14);
  cursor: pointer;
}
#planner .sl-chair-menu .sl-chair-btn svg {
  width: 18px;
  height: 18px;
}
#planner .sl-chair-menu .sl-chair-btn:hover {
  border-color: var(--gold);
  color: var(--gold-ink);
}
#planner .sl-chair-menu .sl-chair-btn:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 2px;
}
@media (pointer: coarse) {
  #planner .sl-chair-menu .sl-chair-btn {
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
  }
}
.sl-gaps-note {
  margin: 8px 0 0;
  font-size: 0.8125rem;
}
.sl-gaps-note button {
  min-height: 0;
  padding: 0;
  border: 0;
  background: none;
  color: var(--gold-ink);
  font: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}

/* ===== Чертежът на цял екран (feature/seating-fullscreen, 14.10.2026) =====
   Тънък ред (заглавие, статистика, „Печат / PDF“) и под него сцената – платното от край до край. Върху него: плаваща лента
   (z 20), издърпващ се панел „Гости“ вляво и панел на масата вдясно (z 30), менютата на лентата (z 40), бързото меню и менюто
   на стола (z 50). Форми: управляващите елементи – „хапче“ (35px), плаващите повърхности – 16px, редовете в менютата – 10px.
   Движение: само transform/opacity, 140 ms (бутони) / 220 ms (панели, менюта) / 280 ms (долният лист), една крива; без
   движение при prefers-reduced-motion. */
.sl-editor {
  --sl-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --sl-fast: 140ms;
  --sl-panel: 220ms;
  --sl-sheet: 280ms;
  --sl-shadow: 0 12px 32px rgba(41, 39, 37, 0.14);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.sl-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 20px;
  min-height: 44px;
}
#planner .sl-head .sl-title {
  margin: 0;
  font-family: 'Lora', Georgia, serif;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0;
}
.sl-head-venue {
  font-size: 13px;
  color: var(--ink-muted);
}
.sl-head .sl-stats {
  gap: 4px 16px;
  font-size: 13px;
  color: var(--ink-muted);
}
.sl-head .sl-stats strong {
  font-size: 18px;
  color: var(--ink);
}
.sl-head-actions {
  display: flex;
  gap: 8px;
  margin-left: auto;
}
#planner .sl-head-actions .button,
#planner .sl-head-actions button {
  min-height: 40px;
  padding: 6px 18px;
  font-size: 14px;
}
.sl-editor > .pl-note {
  margin: 0;
}
/* В „Маси“ без голямия отстъп над заглавието – редът е тънък, чертежът започва веднага под него. */
body.pl-wide main.portal {
  padding-top: 14px;
  padding-bottom: 12px;
}
/* Без долния отстъп на планера: сцената стига до края на прозореца и страницата не се превърта. */
body.pl-wide #planner {
  padding-bottom: 0;
}
body.pl-wide #portal-status:empty {
  display: none;
}

/* Сцената: до долния край на прозореца (--sl-top / --sl-bottom се мерят в plsStageSize). */
.sl-stage {
  position: relative;
  isolation: isolate;
  container: slstage / inline-size;
  height: max(360px, calc(100dvh - var(--sl-top, 220px) - var(--sl-bottom, 0px) - 12px));
  overflow: hidden;
  /* clip: фокусът в чертежа (стол, меню) не може да превърти сцената и да измести плана. */
  overflow: clip;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--bg);
}
/* body.pl-wide – и срещу старото body.pl-wide .sl-canvas { max-height } (иначе платното е по-ниско от сцената). */
.sl-stage .sl-canvas,
body.pl-wide .sl-stage .sl-canvas {
  position: absolute;
  inset: 0;
  width: auto;
  height: auto;
  min-height: 0;
  max-height: none;
  border: 0;
  border-radius: 0;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
}
.sl-stage.sl-fs-anim {
  animation: sl-fs-in var(--sl-panel) var(--sl-ease);
}
@keyframes sl-fs-in {
  from {
    opacity: 0.6;
    transform: scale(0.992);
  }
}

/* Плаващата лента с инструментите: една, тънка, горе в средата; ако не се събира – превърта се хоризонтално. */
.sl-bar-wrap {
  position: absolute;
  z-index: 20;
  top: 10px;
  left: 10px;
  right: 10px;
  display: flex;
  justify-content: center;
  pointer-events: none;
}
.sl-bar {
  display: flex;
  align-items: center;
  gap: 0;
  max-width: 100%;
  padding: 4px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  pointer-events: auto;
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid var(--line);
  border-radius: 35px;
  box-shadow: 0 6px 20px rgba(41, 39, 37, 0.1);
}
.sl-bar::-webkit-scrollbar {
  display: none;
}
/* Таблет: лентата се превърта – краят, зад който има още инструменти, избледнява (plsBarEdges). */
.sl-bar.is-more-right {
  -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 48px), transparent);
  mask-image: linear-gradient(to right, #000 calc(100% - 48px), transparent);
}
.sl-bar.is-more-left {
  -webkit-mask-image: linear-gradient(to right, transparent, #000 48px);
  mask-image: linear-gradient(to right, transparent, #000 48px);
}
.sl-bar.is-more-left.is-more-right {
  -webkit-mask-image: linear-gradient(to right, transparent, #000 48px, #000 calc(100% - 48px), transparent);
  mask-image: linear-gradient(to right, transparent, #000 48px, #000 calc(100% - 48px), transparent);
}
/* fix/seat-toolbar (тест с булка 19.10: „лентата с икони е трудна за разчитане“): всеки инструмент – иконка и под нея
   кратък видим надпис (12 px, --ink-muted); пълното име е в title и aria-label. Височина 44 px (и цел за докосване на
   таблет). На 1280 px лентата е на един ред; по-тясно (таблет) се превърта хоризонтално, надписите остават. На телефон
   (само преглед, .sl-phone) – само иконките. „Гости“ – с бройката до иконката. */
#planner .sl-bar-btn {
  flex: none;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 3px;
  height: 44px;
  min-height: 44px;
  min-width: 44px;
  margin: 0;
  padding: 3px 4px 6px;
  border: 0;
  border-radius: 14px;
  background: none;
  box-shadow: none;
  color: var(--ink);
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  transition:
    background-color var(--sl-fast) ease,
    color var(--sl-fast) ease,
    transform var(--sl-fast) var(--sl-ease);
}
#planner .sl-bar-btn svg {
  flex: none;
  color: var(--gold);
}
/* Иконките (различна височина – схемите на масите са по-ниски) – в средата на мястото над надписа; надписите са на
   една линия. */
#planner .sl-bar-btn > svg,
#planner .sl-bar-btn > .sl-bar-ico {
  margin-block: auto;
}
.sl-bar .sl-bar-text {
  font-size: var(--ws-fs-min, 12px);
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0;
  color: var(--ink-muted);
}
#planner .sl-bar-icon {
  width: 40px;
  min-width: 40px;
  padding: 0;
}
#planner .sl-bar-icon svg,
#planner .sl-bar-btn:not([data-add-table]) svg {
  color: var(--ink);
}
#planner #sl-drawer-btn {
  padding: 3px 6px 6px;
}
#planner #sl-drawer-btn svg {
  color: var(--gold);
}
.sl-bar-ico {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
/* „Мащаб“: − и + са два бутона на цялата височина (иконката горе), общият надпис е под тях. „Разстояние“: бутонът за
   зоните (на цялата височина), до него плъзгачът, под двата – надписът със стойността. */
.sl-bar-group {
  position: relative;
  flex: none;
  display: inline-flex;
}
.sl-bar-pair {
  display: flex;
}
.sl-bar-zones {
  margin: 0 2px;
  display: inline-grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: 1fr auto;
  height: 44px;
}
#planner .sl-bar-zones #sl-zones {
  grid-row: 1 / 3;
  grid-column: 1;
}
.sl-bar .sl-bar-zones .sl-bar-cap {
  position: static;
  grid-row: 2;
  grid-column: 1 / 3;
  z-index: 1;
  margin: 0 0 6px;
  padding: 0 6px;
  white-space: nowrap;
}
/* Включената зона: цялата група е „натисната“ (надписът и плъзгачът са върху същия фон). */
.sl-bar-zones:has(#sl-zones[aria-pressed='true']) {
  border-radius: 14px;
  background: var(--gold-soft);
}
#planner .sl-bar-zones #sl-zones[aria-pressed='true'] {
  background: none;
}
.sl-bar .sl-bar-zones:has(#sl-zones[aria-pressed='true']) .sl-bar-cap {
  color: var(--gold-ink);
}
.sl-bar-zones .sl-clear-ctl {
  grid-row: 1;
  grid-column: 2;
  align-self: end;
}
.sl-bar-zones .sl-clear-ctl[hidden] + .sl-bar-cap {
  padding-left: 0;
}
#planner .sl-bar-group .sl-bar-icon {
  width: 34px;
  min-width: 34px;
  padding: 3px 0 21px;
}
.sl-bar .sl-bar-cap {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 6px;
  text-align: center;
  pointer-events: none;
}
#planner .sl-bar-btn:hover:not(:disabled) {
  background: var(--paper-sunk);
}
#planner .sl-bar-btn:active:not(:disabled) {
  transform: scale(0.96);
}
#planner .sl-bar-btn:disabled {
  opacity: 0.35;
  cursor: default;
}
#planner .sl-bar-btn[aria-pressed='true'],
#planner .sl-bar-btn[aria-expanded='true'] {
  background: var(--gold-soft);
  color: var(--gold-ink);
}
#planner .sl-bar-btn[aria-pressed='true'] svg,
#planner .sl-bar-btn[aria-expanded='true'] svg,
.sl-bar .sl-bar-btn[aria-pressed='true'] .sl-bar-text,
.sl-bar .sl-bar-btn[aria-expanded='true'] .sl-bar-text {
  color: var(--gold-ink);
}
#planner .sl-bar-btn:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: -2px;
}
.sl-bar-sep {
  flex: none;
  width: 1px;
  height: 28px;
  margin: 0 2px;
  background: var(--line);
}
.sl-bar-count {
  min-width: 20px;
  padding: 0 6px;
  border-radius: 35px;
  background: var(--gold-soft);
  color: var(--gold-ink);
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
#planner #sl-drawer-btn[aria-expanded='true'] .sl-bar-count {
  background: var(--paper);
}
.sl-bar .sl-clear-ctl {
  flex: none;
  display: flex;
  align-items: center;
  height: 26px;
  margin: 0 4px 0 0;
  padding: 0 2px;
  background: none;
}
.sl-bar .sl-clear-ctl[hidden] {
  display: none;
}
.sl-bar .sl-clear-ctl input[type='range'] {
  width: 64px;
}
.sl-bar .sl-bar-cap output {
  color: var(--gold-ink);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
/* Телефон (само преглед): само иконките, „Гости“ – иконка с бройката; имената са в aria-label и title. */
.sl-phone .sl-bar .sl-bar-text {
  display: none;
}
#planner .sl-phone .sl-bar .sl-bar-group .sl-bar-icon {
  padding: 0;
}
.sl-phone .sl-bar .sl-bar-sep {
  height: 22px;
  margin: 0 2px;
}

/* Менютата на лентата („Елемент“, „Зала и размер“): под бутона, извън превъртащата се лента. */
.sl-pop {
  position: absolute;
  z-index: 40;
  min-width: 200px;
  max-width: min(360px, calc(100% - 16px));
  max-height: calc(100% - 80px);
  overflow: auto;
  overscroll-behavior: contain;
  padding: 6px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: var(--sl-shadow);
  opacity: 0;
  transform: translateY(-4px) scale(0.98);
  transform-origin: top left;
  transition:
    opacity 160ms var(--sl-ease),
    transform var(--sl-panel) var(--sl-ease);
}
.sl-pop.is-shown {
  opacity: 1;
  transform: none;
}
.sl-pop[hidden] {
  display: none;
}
#planner .sl-pop [role='menuitem'] {
  display: flex;
  width: 100%;
  min-height: 40px;
  margin: 0;
  padding: 0 12px;
  justify-content: flex-start;
  border: 0;
  border-radius: 10px;
  background: none;
  color: var(--ink);
  font-size: 14px;
  font-weight: 500;
}
#planner .sl-pop [role='menuitem']:hover,
#planner .sl-pop [role='menuitem']:focus-visible {
  background: var(--paper-sunk);
  outline: none;
}
.sl-stage .sl-pop.sl-venue {
  width: 360px;
  padding: 14px 16px 16px;
  border-radius: 16px;
}
.sl-pop-title {
  margin: 0 0 8px;
  font-family: 'Lora', Georgia, serif;
  font-size: 17px;
  font-weight: 600;
  color: var(--ink);
}
.sl-pop .sl-venue-body {
  margin-top: 0;
}
.sl-pop .sl-size label {
  width: auto;
  flex: 1;
}

/* Издърпващият се панел „Гости“ (Без маса | Маси): вляво, под лентата; влаченето към маса работи както преди. */
.sl-drawer {
  position: absolute;
  z-index: 31;
  top: 68px;
  left: 10px;
  bottom: 10px;
  width: min(320px, calc(100% - 20px));
  display: flex;
  flex-direction: column;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: var(--sl-shadow);
  opacity: 0;
  transform: translateX(calc(-100% - 16px));
  visibility: hidden;
  transition:
    transform var(--sl-panel) var(--sl-ease),
    opacity var(--sl-panel) var(--sl-ease),
    visibility 0s linear var(--sl-panel);
}
.sl-drawer.is-open {
  opacity: 1;
  transform: none;
  visibility: visible;
  transition:
    transform var(--sl-panel) var(--sl-ease),
    opacity var(--sl-panel) var(--sl-ease),
    visibility 0s;
}
.sl-drawer-head {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px;
  border-bottom: 1px solid var(--line);
}
.sl-drawer-head .sl-side-tabs {
  flex: 1;
  min-width: 0;
  border: 0;
  padding: 0;
}
.sl-drawer-body {
  flex: 1;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 12px 14px 14px;
}
.sl-drawer .sl-guests {
  max-height: none;
  padding: 0;
  overflow: visible;
}
.sl-drawer .sl-guests[hidden],
.sl-drawer .sl-tables[hidden] {
  display: none;
}
#planner .sl-table-item[aria-current='true'] {
  background: var(--gold-soft);
}

/* Панелът на масата: плаващ вдясно, само при избор; свива се до тясна лента с името. */
.sl-fpanel {
  position: absolute;
  z-index: 30;
  top: 68px;
  right: 10px;
  width: 340px;
  max-height: calc(100% - 74px);
  display: flex;
  flex-direction: column;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: var(--sl-shadow);
  opacity: 0;
  transform: translateX(12px);
  transition:
    opacity var(--sl-panel) var(--sl-ease),
    transform var(--sl-panel) var(--sl-ease);
}
.sl-fpanel.is-shown {
  opacity: 1;
  transform: none;
}
.sl-fpanel[hidden] {
  display: none;
}
.sl-fpanel .sl-panel-head {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 6px;
  border-bottom: 1px solid var(--line);
}
#planner .sl-fpanel .sl-panel-head h2 {
  flex: 1;
  min-width: 0;
  margin: 0 4px;
  overflow: hidden;
  font-size: 18px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#planner .sl-panel-min {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  min-width: 40px;
  height: 40px;
  min-height: 40px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: none;
  color: var(--ink-muted);
}
#planner .sl-panel-min:hover {
  background: var(--paper-sunk);
  color: var(--ink);
}
#planner .sl-fpanel .sl-panel-close {
  width: 40px;
  min-width: 40px;
  height: 40px;
  min-height: 40px;
}
.sl-panel-min svg {
  transition: transform var(--sl-panel) var(--sl-ease);
}
.sl-fpanel.is-min .sl-panel-min svg {
  transform: rotate(180deg);
}
.sl-panel-body {
  flex: 1;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 10px 12px 12px;
}
.sl-panel-body[hidden] {
  display: none;
}
.sl-panel-occ {
  margin: 0 0 8px;
  font-size: 13px;
}
.sl-fpanel.is-min {
  width: 52px;
}
.sl-fpanel.is-min .sl-panel-head {
  flex-direction: column;
  gap: 8px;
  padding: 6px;
  border-bottom: 0;
}
#planner .sl-fpanel.is-min .sl-panel-head h2 {
  order: 3;
  flex: none;
  max-height: 220px;
  margin: 0;
  font-size: 15px;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
}
.sl-mirror-row button span {
  margin-left: 6px;
}
#planner .sl-mirror-row button[aria-pressed='true'] {
  background: var(--gold-soft);
  border-color: var(--gold);
  color: var(--gold-ink);
}
.sl-mirror-row button svg {
  vertical-align: -4px;
}

/* Бързото меню (десен клик / дълго задържане / Shift+F10): отваря се от точката на клика. */
.sl-ctx {
  position: absolute;
  z-index: 50;
  min-width: 220px;
  max-width: 280px;
  padding: 6px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: 0 14px 36px rgba(41, 39, 37, 0.18);
  opacity: 0;
  transform: scale(0.96);
  transition:
    opacity 150ms var(--sl-ease),
    transform var(--sl-panel) var(--sl-ease);
}
.sl-ctx.is-shown {
  opacity: 1;
  transform: none;
}
.sl-ctx:focus {
  outline: none;
}
#planner .sl-ctx button {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  width: 100%;
  min-height: 40px;
  margin: 0;
  padding: 0 12px;
  border: 0;
  border-radius: 10px;
  background: none;
  color: var(--ink);
  font-size: 14px;
  font-weight: 500;
  text-align: left;
}
#planner .sl-ctx button svg {
  flex: none;
  color: var(--gold);
}
#planner .sl-ctx button:hover,
#planner .sl-ctx button:focus-visible {
  background: var(--paper-sunk);
  outline: none;
}
#planner .sl-ctx button:focus-visible {
  box-shadow: inset 0 0 0 2px var(--gold);
}
#planner .sl-ctx button[aria-checked='true'] {
  background: var(--gold-soft);
  color: var(--gold-ink);
}
#planner .sl-ctx .is-danger,
#planner .sl-ctx .is-danger svg {
  color: var(--danger);
}
#planner .sl-ctx .is-armed {
  background: #fbf0ee;
}
.sl-ctx-head {
  margin: 6px 12px 6px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--gold-ink);
}
.sl-ctx-note {
  margin: 8px 12px;
  font-size: 13px;
  color: var(--ink-muted);
}
@media (pointer: coarse) {
  #planner .sl-ctx button,
  #planner .sl-pop [role='menuitem'] {
    min-height: 48px;
  }
}
.sl-stage .sl-chair-menu {
  z-index: 50;
}

/* Долу върху платното: мащабната линийка вляво и предупреждението за близките маси. */
.sl-foot {
  position: absolute;
  z-index: 10;
  left: 14px;
  right: 14px;
  bottom: 10px;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 6px 10px;
  pointer-events: none;
}
.sl-foot .sl-clear-warn {
  order: -1;
  flex: 1 0 100%;
}
.sl-foot .sl-legend {
  flex: 0 1 auto;
  gap: 4px 6px;
  font-size: 11px;
  min-width: 0;
}
.sl-foot .sl-legend > span {
  padding: 2px 8px;
  background: rgba(255, 255, 255, 0.9);
}
.sl-scale {
  flex: none;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 4px 8px 5px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.85);
  font-size: 11px;
  font-weight: 600;
  color: var(--ink-muted);
  font-variant-numeric: tabular-nums;
}
.sl-scale i {
  display: block;
  height: 5px;
  border: 1.5px solid var(--ink-muted);
  border-top: 0;
}
.sl-foot .sl-clear-warn {
  margin: 0 auto;
  max-width: min(640px, 70%);
  pointer-events: auto;
  box-shadow: 0 6px 18px rgba(41, 39, 37, 0.08);
}
.sl-help-pop {
  width: min(340px, calc(100% - 16px));
}
.sl-help-pop .sl-help-text {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.55;
  color: var(--ink);
}

/* „Цял екран“: без горната лента, менюто и долните раздели на портала; сцената заема целия прозорец под тънкия ред. */
body.sl-fs > header,
body.sl-fs #main-menu,
body.sl-fs #lux-subnav,
body.sl-fs #lux-tabbar,
body.sl-fs #planner .pl-top,
body.sl-fs #planner .pl-nav {
  display: none !important;
}
body.sl-fs main.portal {
  max-width: none;
  margin: 0;
  padding: 8px 12px 0;
}

/* Телефон: лентата е превъртаема, само иконки; панелът на масата е долен лист; панелът „Гости“ – почти на цял екран. */
@media (max-width: 700px) {
  .sl-head {
    gap: 4px 12px;
    min-height: 0;
  }
  #planner .sl-head .sl-title {
    font-size: 20px;
  }
  .sl-head-actions {
    margin-left: 0;
  }
  #planner .sl-head-actions .button,
  #planner .sl-head-actions button {
    min-height: 44px;
    padding: 6px 14px;
  }
  .sl-stage {
    height: max(360px, calc(100dvh - var(--sl-top, 200px) - var(--sl-bottom, 0px) - 8px));
    border-radius: 12px;
  }
  .sl-bar-wrap {
    top: 6px;
    left: 6px;
    right: 6px;
    justify-content: flex-start;
  }
  #planner .sl-bar-btn,
  #planner .sl-bar-icon {
    height: 44px;
    min-height: 44px;
  }
  #planner .sl-bar .sl-bar-btn:not(#sl-drawer-btn) {
    width: 44px;
    min-width: 44px;
  }
  .sl-drawer {
    top: 62px;
    left: 6px;
    bottom: 6px;
    width: calc(100% - 12px);
  }
  .sl-fpanel {
    top: auto;
    left: 0;
    right: 0;
    bottom: 0;
    width: auto;
    max-height: 56%;
    border-bottom: 0;
    border-radius: 16px 16px 0 0;
    transform: translateY(24px);
    transition-duration: var(--sl-sheet);
  }
  .sl-fpanel::before {
    content: '';
    flex: none;
    width: 36px;
    height: 4px;
    margin: 6px auto 0;
    border-radius: 2px;
    background: var(--line);
  }
  .sl-fpanel.is-min {
    width: auto;
  }
  .sl-fpanel.is-min .sl-panel-head {
    flex-direction: row;
  }
  #planner .sl-fpanel.is-min .sl-panel-head h2 {
    order: 0;
    flex: 1;
    margin: 0 4px;
    font-size: 18px;
    writing-mode: horizontal-tb;
    transform: none;
  }
  .sl-panel-min svg {
    transform: rotate(90deg);
  }
  .sl-fpanel.is-min .sl-panel-min svg {
    transform: rotate(-90deg);
  }
  .sl-foot {
    left: 8px;
    right: 8px;
    bottom: 8px;
  }
  .sl-foot .sl-legend {
    font-size: 10px;
  }
  .sl-foot .sl-clear-warn {
    max-width: none;
    font-size: 12px;
  }
  body.sl-fs main.portal {
    padding: 6px 6px 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  .sl-drawer,
  .sl-drawer.is-open,
  .sl-fpanel,
  .sl-pop,
  .sl-ctx,
  .sl-panel-min svg,
  #planner .sl-bar-btn {
    transition: none;
  }
  .sl-stage.sl-fs-anim {
    animation: none;
  }
}

/* ===== „Ключ“ за редакция (074, planner-seating-lock.js, 14.10.2026) =====
   Лентата „… редактира масите в момента“ над плана (само при преглед) и неблокиращото прозорче „Предай / Остани“ при
   притежателя, горе в сцената под лентата с инструментите. Движение: само opacity/transform, 220 ms (лентата) и 240 ms
   (прозорчето), кривата на редактора; без движение при prefers-reduced-motion. */
.plk-bar {
  display: flex;
  align-items: center;
  gap: 10px 14px;
  padding: 10px 12px 10px 14px;
  border: 1px solid var(--gold-line);
  border-radius: 16px;
  background: var(--cream);
  color: var(--ink);
  animation: plk-in 220ms var(--sl-ease, ease-out);
}
.plk-bar p {
  flex: 1;
  margin: 0;
  font-size: 14px;
  line-height: 1.4;
}
.plk-icon {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--gold-soft);
  color: var(--gold-ink);
}
.plk-icon svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.plk-spin {
  animation: plk-spin 1s linear infinite;
}
#planner .plk-bar button {
  flex: none;
  white-space: nowrap;
}
.plk-ask {
  position: absolute;
  z-index: 45;
  top: 62px;
  left: 50%;
  width: min(360px, calc(100% - 24px));
  padding: 16px 16px 14px;
  border: 1px solid var(--gold-line);
  border-radius: 16px;
  background: var(--paper);
  box-shadow: var(--sl-shadow, 0 12px 32px rgba(41, 39, 37, 0.14));
  transform: translateX(-50%);
  animation: plk-ask-in 240ms var(--sl-ease, ease-out);
}
.plk-ask-title {
  margin: 0 0 4px;
  font-family: 'Lora', Georgia, serif;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--ink);
}
.plk-ask-left {
  margin: 0 0 12px;
  font-size: 13px;
  line-height: 1.4;
  color: var(--ink-muted);
}
.plk-ask-actions {
  display: flex;
  gap: 8px;
}
#planner .plk-ask-actions button {
  flex: 1;
}
@keyframes plk-in {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
}
@keyframes plk-ask-in {
  from {
    opacity: 0;
    transform: translate(-50%, -8px);
  }
}
@keyframes plk-spin {
  to {
    transform: rotate(360deg);
  }
}
/* Телефон: лентата е компактна (иконка + текст, бутонът под текста вдясно); прозорчето – по цялата ширина. */
@media (max-width: 700px) {
  .plk-bar {
    flex-wrap: wrap;
    gap: 8px 10px;
    padding: 8px 10px;
    border-radius: 12px;
  }
  .plk-bar p {
    flex: 1 1 calc(100% - 42px);
    font-size: 13px;
  }
  .plk-icon {
    width: 28px;
    height: 28px;
  }
  #planner .plk-bar button {
    margin-left: auto;
  }
  .plk-ask {
    top: 56px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .plk-bar,
  .plk-ask {
    animation: none;
  }
  .plk-spin {
    animation-duration: 3s;
  }
}
/* Влачене на гост от стола (fix/seat-drag): „ръка“ върху заетия стол, стола под показалеца – със златен ръб,
   столовете, от които тръгва гостът – бледи. Само в редактора (не при „само за преглед“). */
.sl-canvas:not(.sl-readonly) .sl-chair.sl-taken {
  cursor: grab;
}
.sl-canvas.sl-seat-drag,
.sl-canvas.sl-seat-drag * {
  cursor: grabbing;
}
.sl-chair.sl-drag-src {
  opacity: 0.4;
}
.sl-chair.sl-drop-on .sl-chair-seat {
  stroke: var(--gold);
  stroke-width: 4;
}
/* Въртене с дръжка (fix/seat-drag; от fix/seat-simple – иконка без линия, виж края на файла): ъгълът – до показалеца.
   Размерите на иконката и зоната за посочване са в пиксели на екрана (plsRotHandle). */
.sl-rot {
  cursor: url('icons/cursor-rotate.svg') 12 12, grab;
}
.sl-rot-hit {
  fill: transparent;
}
.sl-rot-knob {
  fill: #fff;
  stroke: var(--gold);
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
  filter: drop-shadow(0 1px 2px rgba(41, 39, 37, 0.25));
}
.sl-rot:hover .sl-rot-knob,
.sl-rotating .sl-rot-knob {
  fill: var(--gold);
}
.sl-canvas.sl-rotating,
.sl-canvas.sl-rotating * {
  cursor: url('icons/cursor-rotate.svg') 12 12, grabbing;
}
.sl-rot-tip {
  position: fixed;
  z-index: 1000;
  pointer-events: none;
  background: var(--ink);
  color: #fff;
  padding: 4px 10px;
  border-radius: 35px;
  font: 600 12px 'Montserrat', sans-serif;
  font-variant-numeric: tabular-nums;
}

/* ===== Компактни странични панели (fix/seat-drag, 14.10.2026) =====
   Панелът на масата/елемента, менютата на лентата („Елемент“, „Зала“), чекмеджето и бързото меню заемат по-малко от чертежа:
   ~290 px ширина, 12 px етикети, 32–34 px полета и бутони за мишка. На тъч (pointer: coarse) – 44 px и 16 px, както преди. */
.sl-fpanel {
  width: 292px;
  max-height: calc(100% - 70px);
  border-radius: 14px;
}
.sl-fpanel .sl-panel-head {
  gap: 2px;
  padding: 4px 6px;
}
#planner .sl-fpanel .sl-panel-head h2 {
  margin: 0 2px;
  font-size: 15px;
  line-height: 20px;
}
#planner .sl-fpanel .sl-panel-min,
#planner .sl-fpanel .sl-panel-close {
  width: 32px;
  min-width: 32px;
  height: 32px;
  min-height: 32px;
  padding: 0;
}
.sl-fpanel.is-min {
  width: 44px;
}
#planner .sl-fpanel.is-min .sl-panel-head h2 {
  font-size: 14px;
}
.sl-fpanel .sl-panel-body {
  padding: 6px 8px 8px;
  font-size: 13px;
}
.sl-fpanel .sl-panel-occ {
  margin: 0 0 6px;
  font-size: 12px;
}
.sl-fpanel .sl-sec {
  margin: 0 0 6px;
  border-radius: 10px;
}
.sl-fpanel .sl-sec-sum {
  min-height: 30px;
  padding: 0 10px;
  font-size: 11px;
  letter-spacing: 0.1em;
}
.sl-fpanel .sl-sec-sum::after {
  width: 6px;
  height: 6px;
}
.sl-fpanel .sl-sec-sum:focus-visible {
  border-radius: 10px;
}
.sl-fpanel .sl-sec-body {
  padding: 2px 10px 8px;
}
.sl-fpanel .sl-sec-body .pl-actions {
  margin-top: 6px;
}
/* Полета: етикет 12 px над поле от 32 px. */
.sl-fpanel label {
  font-size: 12px;
  font-weight: 500;
  color: var(--ink-muted);
}
.sl-fpanel input,
.sl-fpanel select {
  min-height: 32px;
  margin-top: 3px;
  padding: 4px 8px;
  font-size: 14px;
}
.sl-fpanel .check {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--ink);
}
.sl-fpanel .check input {
  flex: none;
  width: 16px;
  min-height: 0;
  margin: 0;
}
.sl-fpanel .pl-form-grid {
  gap: 0 8px;
}
.sl-fpanel .pl-form-grid label {
  margin: 4px 0;
}
/* Маса: името на цял ред, „Места“ (със стъпките) и „Вид“ – на един ред. */
.sl-fpanel .sl-table-form {
  grid-template-columns: auto minmax(0, 1fr);
}
.sl-fpanel .sl-table-form .pl-span {
  grid-column: auto;
}
.sl-fpanel .sl-table-form label:first-child {
  grid-column: 1 / -1;
}
.sl-fpanel .sl-stepper {
  gap: 3px;
  margin-top: 3px;
}
.sl-fpanel .sl-stepper input {
  width: 44px;
  margin: 0;
  padding: 4px 2px;
}
#planner .sl-fpanel .sl-stepper button {
  width: 30px;
  min-width: 30px;
  min-height: 32px;
  padding: 0;
}
.sl-fpanel .sl-stepper svg {
  width: 14px;
  height: 14px;
}
/* Размер и форма. */
.sl-fpanel .sl-size-fields {
  gap: 2px 8px;
}
.sl-fpanel .sl-size-field {
  gap: 0;
  font-size: 12px;
}
#planner .sl-fpanel .sl-size-field input {
  min-height: 32px;
  font-size: 14px;
}
.sl-fpanel .sl-size-chips {
  gap: 4px;
  margin-top: 3px;
}
#planner .sl-fpanel .sl-size-chip {
  min-height: 28px;
  padding: 2px 10px;
  font-size: 12px;
}
.sl-fpanel .sl-size-both {
  margin-top: 6px;
  font-size: 13px;
}
/* Дъговидната: от коя страна седят гостите – сегментен избор „Отвън · Отвътре · От двете“ (≥ 32 px за мишка, 44 px на тъч). */
.sl-arc-side {
  display: grid;
  gap: 4px;
  margin-top: 8px;
}
.sl-arc-side-label {
  font-size: 12px;
  color: var(--ink-muted);
}
.sl-arc-side-opts {
  display: flex;
}
#planner .sl-fpanel .sl-arc-side-opt {
  flex: 1 1 0;
  min-width: 0;
  min-height: 32px;
  padding: 2px 6px;
  border-radius: 0;
  white-space: nowrap;
}
#planner .sl-fpanel .sl-arc-side-opt + .sl-arc-side-opt {
  margin-left: -1px;
}
#planner .sl-fpanel .sl-arc-side-opt:first-child {
  border-radius: 999px 0 0 999px;
}
#planner .sl-fpanel .sl-arc-side-opt:last-child {
  border-radius: 0 999px 999px 0;
}
#planner .sl-fpanel .sl-arc-side-opt[aria-pressed='true'] {
  position: relative;
  z-index: 1;
}
/* Правоъгълната: „Чело: Без · Ляво · Дясно · Двете“ (fix/rect-join-even) – същият сегментен избор, най-горе в „Размер и форма“. */
.sl-head-pick {
  margin: 0 0 10px;
}
@media (pointer: coarse) {
  #planner .sl-fpanel .sl-arc-side-opt {
    min-height: 44px;
  }
}
.sl-fpanel .sl-size-foot {
  gap: 6px;
  margin-top: 6px;
}
.sl-fpanel .sl-size-note {
  flex-basis: 110px;
  font-size: 12px;
  line-height: 16px;
}
#planner .sl-fpanel #sl-t-auto {
  min-height: 30px;
  padding: 2px 12px;
  font-size: 12px;
}
.sl-fpanel .sl-size-warn {
  padding: 4px 6px;
}
/* Сегменти. */
.sl-fpanel .sl-seg-box {
  margin-top: 6px;
}
.sl-fpanel .sl-seg-title {
  margin-bottom: 3px;
  font-size: 12px;
}
.sl-fpanel .sl-seg-list {
  gap: 3px;
  margin-bottom: 4px;
}
.sl-fpanel .sl-seg-row {
  gap: 3px;
  padding: 2px 3px;
  border-radius: 8px;
}
.sl-fpanel .sl-seg-no {
  width: 20px;
  height: 20px;
  font-size: 12px;
}
.sl-fpanel .sl-seg-row {
  grid-template-columns: 20px auto minmax(0, 1fr) auto;
}
.sl-fpanel .sl-seg-row-first {
  grid-template-columns: 20px minmax(0, 1fr) auto;
  min-height: 28px;
}
.sl-fpanel .sl-seg-first {
  font-size: 12px;
}
#planner .sl-fpanel .sl-seg-kind,
#planner .sl-fpanel .sl-seg-row .sl-seg-sweep,
#planner .sl-fpanel .sl-seg-del,
#planner .sl-fpanel .sl-seg-eye,
#planner .sl-fpanel .sl-seg-add {
  min-height: 30px;
}
#planner .sl-fpanel .sl-seg-kind {
  min-width: 30px;
  padding: 2px 4px;
}
#planner .sl-fpanel .sl-seg-row .sl-seg-sweep {
  margin: 0;
  padding: 2px 6px;
  font-size: 14px;
}
#planner .sl-fpanel .sl-seg-del,
#planner .sl-fpanel .sl-seg-eye {
  width: 30px;
  min-width: 30px;
  padding: 0;
}
#planner .sl-fpanel .sl-seg-add {
  padding: 2px 12px;
  font-size: 12px;
}
/* Положение: ъгълът и огледалните бутони (само икони) – на един ред. */
.sl-fpanel .sl-pos-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 6px 8px;
}
.sl-fpanel .sl-pos-row .pl-actions {
  gap: 6px;
  margin: 0;
}
.sl-fpanel .sl-pos-row .sl-angle-field {
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
}
.sl-fpanel .sl-angle-field input {
  width: 76px;
}
.sl-fpanel .sl-pos-row .sl-mirror-row {
  margin-left: auto;
}
#planner .sl-fpanel .sl-mirror-row button {
  width: 34px;
  min-width: 34px;
  min-height: 32px;
  padding: 0;
}
.sl-fpanel .sl-mirror-row button span {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.sl-fpanel .sl-mirror-row button svg {
  vertical-align: middle;
}
.sl-fpanel .sl-pos-row .sl-mirror-note {
  flex-basis: 100%;
  margin: 0;
}
.sl-fpanel .sl-mirror-note,
.sl-fpanel .sl-gaps-note {
  margin: 4px 0 0;
  font-size: 12px;
  line-height: 16px;
  color: var(--ink-muted);
}
.sl-fpanel .sl-row-actions {
  gap: 6px !important;
  margin-top: 6px;
}
#planner .sl-fpanel .sl-row-actions button,
#planner .sl-fpanel .sl-danger-zone button {
  min-height: 30px;
  padding: 2px 14px;
  font-size: 13px;
}
.sl-fpanel .sl-danger-zone {
  margin-top: 8px;
  padding-top: 8px;
}
/* Гости на масата. */
.sl-fpanel .sl-party-list {
  gap: 3px;
}
#planner .sl-fpanel .sl-guest {
  min-height: 34px;
  gap: 6px;
  padding: 4px 8px;
}
.sl-fpanel .sl-guest strong {
  font-size: 13px;
}
.sl-fpanel .sl-guest small {
  font-size: 11px;
  line-height: 14px;
}
.sl-fpanel .sl-party-list .pl-icon-button {
  min-width: 30px;
  min-height: 30px;
}

/* Менютата на лентата и чекмеджето. */
.sl-pop {
  min-width: 180px;
  padding: 4px;
  border-radius: 12px;
}
#planner .sl-pop [role='menuitem'] {
  min-height: 34px;
  padding: 0 10px;
  border-radius: 8px;
  font-size: 13px;
}
.sl-stage .sl-pop.sl-venue {
  width: 290px;
  padding: 8px 10px 10px;
  border-radius: 12px;
}
.sl-pop-title {
  margin: 0 0 4px;
  font-size: 15px;
}
.sl-pop .sl-venue-body {
  gap: 6px;
  margin-top: 0;
}
.sl-pop .sl-venue-body label {
  font-size: 12px;
  color: var(--ink-muted);
}
.sl-pop .sl-venue-body input,
.sl-pop .sl-venue-body select {
  min-height: 32px;
  margin-top: 3px;
  padding: 4px 8px;
  font-size: 14px;
}
.sl-pop .sl-venue-body .check {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--ink);
}
.sl-pop .sl-venue-body .check input {
  flex: none;
  width: 16px;
  min-height: 0;
  margin: 0;
}
.sl-pop .sl-venue-body .muted {
  margin: 0;
  font-size: 12px;
  line-height: 16px;
}
.sl-pop .sl-size {
  gap: 8px;
}
#planner .sl-pop .sl-venue-body button {
  min-height: 32px;
  padding: 2px 14px;
  font-size: 13px;
}
.sl-pop .sl-venue-body .pl-actions {
  gap: 6px;
}
.sl-help-pop {
  width: min(300px, calc(100% - 16px));
}
.sl-drawer {
  width: min(280px, calc(100% - 20px));
}
.sl-drawer-body {
  padding: 8px 10px 10px;
}
.sl-drawer .sl-guest-list {
  gap: 3px;
}
.sl-drawer #sl-q {
  min-height: 32px;
  margin: 4px 0;
  padding: 4px 8px;
  font-size: 14px;
}
.sl-drawer .check {
  font-size: 13px;
}
#planner .sl-drawer .sl-guest {
  min-height: 36px;
  padding: 4px 8px;
}
.sl-drawer .sl-panel-hint {
  margin: 0 0 6px;
  font-size: 12px;
}
.sl-drawer .sl-group-filter {
  font-size: 12px;
}
.sl-drawer .sl-group-filter select {
  min-height: 32px;
  padding: 4px 8px;
  font-size: 14px;
}

/* Бързото меню. */
.sl-ctx {
  min-width: 190px;
  max-width: 240px;
  padding: 4px;
  border-radius: 12px;
}
#planner .sl-ctx button {
  min-height: 34px;
  gap: 8px;
  padding: 0 10px;
  border-radius: 8px;
  font-size: 13px;
}
.sl-ctx-head {
  margin: 4px 10px;
  font-size: 11px;
}
.sl-ctx-note {
  margin: 6px 10px;
  font-size: 12px;
}

/* Тъч: стъпките и целите за натискане – както преди (≥ 44 px, 16 px в полетата). */
@media (pointer: coarse) {
  .sl-fpanel input,
  .sl-fpanel select,
  .sl-pop .sl-venue-body input,
  .sl-pop .sl-venue-body select,
  .sl-drawer #sl-q,
  .sl-drawer .sl-group-filter select,
  #planner .sl-fpanel .sl-size-field input,
  #planner .sl-fpanel .sl-seg-row .sl-seg-sweep {
    min-height: 44px;
    font-size: 16px;
  }
  .sl-fpanel .sl-sec-sum {
    min-height: 44px;
  }
  #planner .sl-fpanel .sl-panel-min,
  #planner .sl-fpanel .sl-panel-close,
  #planner .sl-fpanel .sl-stepper button,
  #planner .sl-fpanel .sl-mirror-row button,
  #planner .sl-fpanel .sl-size-chip,
  #planner .sl-fpanel .sl-seg-kind,
  #planner .sl-fpanel .sl-seg-del,
  #planner .sl-fpanel .sl-seg-eye,
  #planner .sl-fpanel .sl-seg-add,
  #planner .sl-fpanel #sl-t-auto,
  #planner .sl-fpanel .sl-row-actions button,
  #planner .sl-fpanel .sl-danger-zone button,
  #planner .sl-pop .sl-venue-body button,
  #planner .sl-pop [role='menuitem'],
  #planner .sl-ctx button {
    min-height: 44px;
  }
  #planner .sl-fpanel .sl-panel-min,
  #planner .sl-fpanel .sl-panel-close,
  #planner .sl-fpanel .sl-stepper button,
  #planner .sl-fpanel .sl-mirror-row button,
  #planner .sl-fpanel .sl-seg-kind,
  #planner .sl-fpanel .sl-seg-del,
  #planner .sl-fpanel .sl-seg-eye {
    min-width: 44px;
    width: 44px;
  }
  #planner .sl-fpanel .sl-seg-kind {
    width: auto;
  }
  #planner .sl-fpanel .sl-guest,
  #planner .sl-drawer .sl-guest {
    min-height: 44px;
  }
}
@media (max-width: 700px) {
  .sl-fpanel,
  .sl-fpanel.is-min {
    width: auto;
    max-height: 56%;
    border-radius: 16px 16px 0 0;
  }
  .sl-drawer {
    width: calc(100% - 12px);
  }
  .sl-pop,
  .sl-stage .sl-pop.sl-venue {
    max-width: calc(100% - 16px);
  }
  .sl-stage .sl-pop.sl-venue {
    width: min(290px, calc(100% - 16px));
  }
}

/* „Гости на масата“ в панела – с мишка гостите се виждат на столовете и се местят с влачене (собственикът, 14.10).
   На тъч екрани (без влачене от стол) списъкът остава – там е начинът да махнете или смените гост. */
@media (pointer: fine) {
  .sl-sec[data-sec='guests'] { display: none; }
}

/* Горен ред на панела (собственикът, 14.10): ‹ · име + молив · дублирай · изтрий · ×. */
#planner .sl-fpanel .sl-panel-head h2.sl-title {
  display: flex;
  align-items: center;
  gap: 2px;
  flex: 1;
  min-width: 0;
  font-family: 'Lora', serif;
}
#planner .sl-title-name {
  flex: 0 1 auto;
  min-width: 0;
  min-height: 32px;
  padding: 0 4px;
  border: 0;
  border-radius: 8px;
  background: none;
  color: inherit;
  font: inherit;
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: text;
}
#planner .sl-title-name:hover { background: var(--paper-sunk); }
#planner .sl-panel-head .sl-title-pen,
#planner .sl-panel-head .sl-head-btn {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  min-width: 32px;
  height: 32px;
  min-height: 32px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: none;
  color: var(--ink-muted);
}
#planner .sl-panel-head .sl-title-pen:hover,
#planner .sl-panel-head .sl-head-btn:hover { background: var(--paper-sunk); color: var(--ink); }
#planner .sl-panel-head .sl-head-btn.is-danger { color: var(--danger); }
#planner .sl-panel-head .sl-head-btn.is-confirm { background: var(--danger); color: #fff; }
#planner .sl-panel-head .sl-head-btn[aria-pressed='true'] { background: var(--cream); color: var(--gold-ink); }
#planner .sl-panel-head .sl-head-btn:disabled { opacity: 0.4; cursor: default; }
.sl-title svg, .sl-head-btn svg { width: 18px; height: 18px; }
#planner .sl-title input {
  flex: 1;
  min-width: 0;
  height: 32px;
  min-height: 32px;
  padding: 0 8px;
  font: inherit;
  font-size: 15px;
}
.sl-del-ask { margin: 0; padding: 6px 10px; font-size: 12px; color: var(--danger); border-bottom: 1px solid var(--line); }
@media (pointer: coarse) {
  #planner .sl-title-name, #planner .sl-title input,
  #planner .sl-panel-head .sl-title-pen,
  #planner .sl-panel-head .sl-head-btn { min-height: 44px; height: 44px; }
  #planner .sl-panel-head .sl-title-pen,
  #planner .sl-panel-head .sl-head-btn { min-width: 44px; width: 44px; }
  #planner .sl-title input { font-size: 16px; }
}

/* UT-RD-12: празната зала казва откъде да се започне (изчезва с първата маса). */
.sl-empty-hint {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  display: grid;
  gap: 6px;
  width: min(360px, calc(100% - 48px));
  margin: 0;
  padding: 16px 20px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--paper);
  box-shadow: var(--shadow-chip);
  color: var(--ink-muted);
  font-size: 14px;
  line-height: 1.5;
  text-align: center;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.sl-empty-hint strong {
  color: var(--ink);
  font: 500 18px/1.3 var(--font-display, 'Lora', serif);
}
.sl-stage:has(#sl-canvas [data-table]) .sl-empty-hint {
  display: none;
}

/* ===== fix/seat-simple (19.10.2026): по-просто завъртане, видимо име, предложения, телефон само за преглед ===== */
/* Завъртане: една малка иконка (кръгова стрелка в бяло кръгче) над избраната маса/елемент, без линия. Размерите са в
   пиксели на екрана (plsRotHandle мащабира групата с 1/мащаба); при посочване и въртене кръгчето става златно. */
.sl-rot-knob {
  fill: var(--paper);
  stroke: var(--gold);
  stroke-width: 1.5;
  vector-effect: none;
  filter: drop-shadow(0 1px 3px rgba(41, 39, 37, 0.28));
  transition: fill var(--sl-fast, 140ms) ease;
}
.sl-rot-icon {
  fill: none;
  stroke: var(--gold-ink);
  stroke-width: 2.6;
  stroke-linecap: round;
  stroke-linejoin: round;
  pointer-events: none;
  transition: stroke var(--sl-fast, 140ms) ease;
}
.sl-rot:hover .sl-rot-knob,
.sl-rotating .sl-rot-knob {
  fill: var(--gold);
}
.sl-rot:hover .sl-rot-icon,
.sl-rotating .sl-rot-icon {
  stroke: var(--paper);
}
@media (prefers-reduced-motion: reduce) {
  .sl-rot-knob,
  .sl-rot-icon {
    transition: none;
  }
}

/* „Име на масата“ / „Надпис“: винаги видимо поле най-горе в панела; под него – чипове с предложения след добавяне. */
.sl-name-box {
  display: grid;
  gap: 4px;
  margin: 2px 0 10px;
}
.sl-fpanel .sl-name-field {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--ink);
}
#planner .sl-fpanel #sl-name-in {
  min-height: 40px;
  margin: 0;
  padding: 6px 10px;
  font: 500 16px/1.3 var(--font-display, 'Lora', serif);
  color: var(--ink);
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--paper);
}
#planner .sl-fpanel #sl-name-in:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 1px;
  border-color: var(--gold);
}
.sl-name-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 4px;
}
#planner .sl-fpanel .sl-name-chip {
  min-height: 28px;
  padding: 2px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--cream);
  color: var(--ink);
  font: 500 12px/1.2 'Montserrat', sans-serif;
}
#planner .sl-fpanel .sl-name-chip:hover {
  border-color: var(--gold-line);
  background: var(--paper);
}
#planner .sl-fpanel .sl-name-chip[aria-pressed='true'] {
  border-color: var(--gold);
  background: var(--gold-soft);
  color: var(--gold-ink);
}
@media (pointer: coarse) {
  #planner .sl-fpanel #sl-name-in,
  #planner .sl-fpanel .sl-name-chip {
    min-height: 44px;
  }
  #planner .sl-fpanel .sl-name-chip {
    padding: 4px 14px;
    font-size: 14px;
  }
}

/* Телефон – само преглед: кратка бележка над плана и листът отдолу с гостите на масата по места. */
.sl-phone-note {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 6px;
  padding: 6px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--cream);
  color: var(--ink-muted);
  font-size: 12px;
  line-height: 1.4;
}
.sl-phone-note svg {
  flex: none;
  color: var(--gold);
}
#planner .sl-fpanel .sl-sheet-sub {
  margin: 4px 0 6px;
  font: 600 11px/1.3 'Montserrat', sans-serif;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-muted);
}
.sl-phone .sl-fpanel .sl-party-list .sl-guest[disabled] {
  opacity: 1;
  cursor: default;
  color: var(--ink);
}
.sl-phone .sl-canvas {
  cursor: default;
}
