/* Сетка автобуса внутри аккордеона */
#busSchema {
    min-height: 400px;
    overflow-y: auto;
    /*padding: 10px;*/
    /*background: #f8f9fa;*/
    border-radius: 8px;
}


/* Основные стили для схемы автобуса */
.bus-scheme {
  /*width: 100%;*/
  /*width: 65%;*/
  padding: 10px;
  box-sizing: border-box;
  position: relative;
  /*margin-left: auto;
  margin-right: auto;*/
  margin: 0 auto 0 auto;
}

.bus-counter {
  width: 100%;
  height: auto;
  aspect-ratio: 2 / 1; /* Соотношение ширины к высоте 2:1 */
  border: 2px solid #000000;
  border-radius: 20px;
  padding: 10px;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
}

.bus-counter table {
  width: 100%;
  height: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 5px;
}

.bus-counter td {
  position: relative;
  text-align: center;
  vertical-align: middle;
  padding: 0;
}

.bus-counter img {
  height: 100%;
  width: auto;
  max-height: 100%;
  object-fit: contain;
  display: block;
}

.bus-counter span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  min-height: 75px;
  box-sizing: border-box;
  border-radius: 5px;
  font-size: clamp(10px, 1.5vw, 16px);
  font-weight: bold;
  cursor: pointer;
  transition: all 0.2s;
}

/* Состояния мест */
.bus-free-place {
  background: #DBE280;
}
.bus-free-place:hover {
  border: 3px solid #000000;
}
.bus-busy-place {
  background: #E62229;
  color: #ffffff;
  cursor: not-allowed;
  opacity: 0.7;
}
.bus-discount-place {
  background: #FDCB00;
}

/* Адаптация для разных экранов */
@media (max-width: 992px) {
  .bus-counter {
    aspect-ratio: 1.5 / 1;
  }
  .bus-counter span {
    font-size: clamp(8px, 2vw, 12px);
  }
}

@media (max-width: 768px) {
  .bus-counter {
    aspect-ratio: 1.2 / 1;
    border-radius: 15px;
    padding: 5px;
  }
  .bus-counter table {
    border-spacing: 3px;
  }
}


/*Маркеры*/
span.marker {
    padding: 8px 18px 8px 18px;
    border-radius: 5px;
}
span.bus-busy-place, .marker-busy-place {
    background: #E62229;
    color: #ffffff;
}
span.bus-free-place, .marker-free-place {
    background: #DBE280;
}
span.bus-selected-place, .marker-selected-place {
    background: #72d4e4;
}
span.bus-free-place.bus-discount-place, .marker-discount-place {
    background: #FDCB00;
}







/*VERTICAL*/
.offcanvas, .offcanvas-lg, .offcanvas-md, .offcanvas-sm, .offcanvas-xl, .offcanvas-xxl {
    /*--bs-offcanvas-width: 30%;*/
    /*--bs-offcanvas-width: 25% !important;*/
}
.offcanvas, .offcanvas-lg, .offcanvas-md, .offcanvas-sm, .offcanvas-xl, .offcanvas-xxl {
    /*--bs-offcanvas-zindex: 1045;*/
    --bs-offcanvas-zindex: 1065 !important;
}
.offcanvas-backdrop {
    /*z-index: 1040;*/
    z-index: 1060 !important;
}

/* Основные стили для вертикальной схемы автобуса */
/*.bus-scheme {
  width: 100%;
  padding: 10px;
  box-sizing: border-box;
}*/

.bus-scheme-vertical {
  /*width: 100%;*/
  /*width: 65%;*/
  /*padding: 10px;*/
  box-sizing: border-box;
  position: relative;
  /*margin-left: auto;
  margin-right: auto;*/
  margin: 0 auto 0 auto;
}

.bus-counter-vertical {
  width: auto;
  height: 100%;
  /*max-height: 70vh;*/ /* Ограничение по высоте */
  max-height: 65vh;
  /*aspect-ratio: 1 / 1.5;*/ /* Инвертируем соотношение для вертикального вида */
  border: 2px solid #000000;
  border-radius: 20px;
  padding: 10px;
  box-sizing: border-box;
  /*display: flex;*/
  justify-content: center;
  align-items: center;
  margin: 0 auto;
}

.bus-counter-vertical table {
  width: 100%;
  height: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 5px;
}

.bus-counter-vertical td {
  position: relative;
  text-align: center;
  vertical-align: middle;
  padding: 0;
  height: 30px; /* Фиксированная высота ячеек */
}

.bus-counter-vertical span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  min-height: 50px;
  box-sizing: border-box;
  border-radius: 5px;
  font-size: clamp(12px, 1.75vh, 18px) !important; /* Используем vh для вертикальной адаптации */
  font-weight: bold;
  cursor: pointer;
  transition: all 0.2s;
}

/* Состояния мест (оставляем как было) */
.bus-free-place {
  background: #DBE280;
}
.bus-free-place:hover {
  border: 3px solid #000000;
}
.bus-busy-place {
  background: #E62229;
  color: #ffffff;
  cursor: not-allowed;
  opacity: 0.7;
}
.bus-discount-place {
  background: #FDCB00;
}


/* Адаптация для разных экранов */
@media (max-width: 992px) {
  .bus-counter-vertical {
    /*aspect-ratio: 1 / 1.8;
    max-height: 80vh;*/
    display: table;
  }
  .bus-counter-vertical span {
    font-size: clamp(8px, 1.8vh, 14px);
  }
}

@media (max-width: 768px) {
  .bus-counter-vertical {
    /*aspect-ratio: 1 / 2;*/
    border-radius: 15px;
    padding: 5px;
    /*max-height: 85vh;*/
    display: table;
  }
  .bus-counter-vertical table {
    border-spacing: 3px;
  }
  .bus-counter-vertical td {
    height: 40px;
  }
}