/* ===== МОБИЛЬНАЯ АДАПТАЦИЯ ===== */

/* Базовые стили для мобильных */
@media (max-width: 768px) {
  /* Контейнеры */
  .container {
    padding: 0 16px;
  }

  /* Навигация */
  .nav-menu {
    flex-direction: column;
    gap: 8px;
  }

  .nav-menu a {
    width: 100%;
    text-align: center;
    padding: 12px;
  }

  /* Карточки туров на главной */
  .tour-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .tour-card {
    max-width: 100%;
  }

  /* Таблицы в админке — горизонтальная прокрутка */
  .admin-table {
    display: block;
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }

  .admin-table thead {
    display: table-header-group;
  }

  .admin-table tbody {
    display: table-row-group;
  }

  /* Формы в админке */
  .admin-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  .admin-form label {
    font-size: 0.9rem;
    margin-bottom: 4px;
  }

  .admin-form input,
  .admin-form select,
  .admin-form textarea {
    width: 100%;
    font-size: 16px; /* Предотвращает зум на iOS */
    padding: 12px;
  }

  /* Кнопки */
  .btn {
    width: 100%;
    padding: 14px 20px;
    font-size: 1rem;
  }

  .btn.secondary {
    width: auto;
  }

  .admin-shell {
    flex-direction: column;
  }

  /* Сайдбар админки */
  .admin-sidebar {
    position: fixed;
    left: -280px;
    top: 0;
    bottom: 0;
    width: 280px;
    z-index: 1000;
    transition: left 0.3s ease;
    box-shadow: 2px 0 8px rgba(0,0,0,0.1);
  }

  .admin-sidebar.open {
    left: 0;
    z-index: 9;
    padding-top: 70px;
  }

  .admin-sidebar-toggle {
    display: block;
    position: fixed;
    top: 16px;
    left: 16px;
    z-index: 1001;
    background: var(--accent, #FF6B35);
    color: white;
    border: none;
    padding: 10px 14px;
    border-radius: 8px;
    cursor: pointer;
    font-size: 1.2rem;
  }

  .admin-content {
    margin-left: 0;
    padding: 60px 16px 16px;
  }

  /* Фильтры в админке */
  .filter-bar,
  form[style*="display: flex"] {
    flex-direction: column;
    gap: 12px;
  }

  .filter-bar select,
  .filter-bar input {
    width: 100%;
  }

  /* Карточки админки */
  .admin-card {
    padding: 16px;
    margin-bottom: 16px;
  }

  .admin-card h3 {
    font-size: 1.2rem;
  }

  /* Схема автобуса */
  .bus-shell {
    transform: scale(0.85);
    transform-origin: top center;
    margin: 0 auto;
  }

  .seat {
    width: 36px;
    height: 36px;
    font-size: 0.75rem;
  }

  /* Блок калькуляции в редакторе тура */
  .expense-row {
    grid-template-columns: 1fr !important;
    gap: 8px;
  }

  .expense-row input,
  .expense-row textarea {
    width: 100%;
  }

  /* Таблица дат и калькуляции */
  table.admin-table {
    font-size: 0.85rem;
  }

  table.admin-table th,
  table.admin-table td {
    padding: 8px 6px;
  }

  .admin-main {
    padding-top: 70px;
    padding-left: 10px;
    padding-right: 10px;
  }

  .tour-list-container {
    margin-bottom: 10px;
  }

  .input-delet-img #remove_cover, .checkbox-tour-var input {
    width: 20%;
  }

  .form-date-tour .form-date-tour-block {
    flex-direction: column;
  }

  .kontragent-add-block, .form-add-promo .form-add-promo-block {
    display: flex !important;
    flex-direction: column;
  }

  .kontragent-add-block div, .form-add-promo .form-add-promo-block div {
    width: 100%;
  }

  .form-bron-filter div, .form-pay-filter div, .form-leads-filter div {
    width: 100%;
  }

  .form-bron-filter div select, .form-pay-filter div select, .form-leads-filter div select {
    width: 100% !important;
  }

  .form-bron-filter div input, .form-pay-filter div input, .form-leads-filter div input, .form-add-promo .form-add-promo-block div input {
    width: 100%;
  }

  .form-check-in .form-check-in-block {
    flex-direction: column;
    align-items: flex-start;
  }

  .form-add-user {
    display: flex !important;
    flex-direction: column;
  }

  .form-add-user div {
    width: 100%;
  }

  .check-add-user input {
    width: 20%;
  }

  .btn-add-tour {
    width: auto;
  }

  /* Статистика на дашборде */
  .stat-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .stat-card {
    padding: 16px;
  }

  /* Заголовки */
  h1 {
    font-size: 1.8rem;
  }

  h2 {
    font-size: 1.5rem;
  }

  h3 {
    font-size: 1.2rem;
  }

  /* Hero секция */
  .tour-hero {
    padding: 60px 0 40px;
  }

  .tour-hero h1 {
    font-size: 2rem;
  }

  .section-promo-code .block-promo-code {
    flex-direction: column;
  }

  .about-photos .photo:nth-child(2), .about-photos .photo:nth-child(4) {
    margin-top: 0;
  }

  /* Блок бронирования */
  .booking-panel {
    padding: 20px;
  }

  /* Промокод */
  #promo-code-input {
    width: 100%;
    margin-bottom: 8px;
  }

  #apply-promo-btn {
    width: 100%;
  }

  /* Чекбоксы */
  .checkbox-row {
    flex-direction: row;
    align-items: center;
    gap: 8px;
  }

  /* Изображения */
  img {
    max-width: 100%;
    height: auto;
  }

  .cover-image {
    height: 200px;
  }

  .card-image {
    height: 180px;
  }
}

/* Очень маленькие экраны */
@media (max-width: 480px) {
  .container {
    padding: 0 12px;
  }

  .tour-hero h1 {
    font-size: 1.6rem;
  }

  .seat {
    width: 32px;
    height: 32px;
    font-size: 0.7rem;
  }

  .bus-shell {
    transform: scale(0.75);
  }

  h1 {
    font-size: 1.5rem;
  }

  .admin-card {
    padding: 12px;
  }
}

/* Планшеты */
@media (min-width: 769px) and (max-width: 1024px) {
  .tour-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .admin-sidebar {
    width: 220px;
  }

  .admin-content {
    margin-left: 220px;
  }
}

/* ===== УТИЛИТЫ ДЛЯ МОБИЛЬНЫХ ===== */

/* Скрытие элементов на мобильных */
.hide-mobile {
  display: none;
}

@media (min-width: 769px) {
  .hide-mobile {
    display: block;
  }

  .admin-sidebar-toggle {
    display: none;
  }
}

/* Показ только на мобильных */
.show-mobile {
  display: none;
}

@media (max-width: 768px) {
  .show-mobile {
    display: block;
  }
}

/* Горизонтальная прокрутка для широких таблиц */
.table-wrapper {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin: 0 -16px;
  padding: 0 16px;
}

@media (min-width: 769px) {
  .table-wrapper {
    margin: 0;
    padding: 0;
  }
}