/* БАЗОВАЯ ФОРМА */
    .application-form {
      max-width: 700px;
      margin: 40px auto;
      padding: 20px;
      background: #f5f5f5;
      border-radius: 8px;
      box-sizing: border-box;
    }
    .application-form h2 { margin-bottom: 20px; }
    .application-form label { display: block; margin-bottom: 15px; }
    .application-form input,
    .application-form textarea {
      width: 100%;
      padding: 8px;
      margin-top: 5px;
      box-sizing: border-box;
    }
    .application-form button {
      background: #0056b3;
      color: white;
      padding: 10px 20px;
      border: none;
      border-radius: 5px;
      cursor: pointer;
    }
    .application-form button:hover { background: #003d80; }

    /* === ВЫБОР ФАЙЛОВ === */
    .file-upload-wrapper {
      display: flex;
      align-items: center;
      background: white;
      border: 1px solid #ccc;
      border-radius: 5px;
      padding: 6px;
      box-sizing: border-box;
      width: 100%;
      overflow: hidden;           /* важное: контейнер не раздвигает страницу */
      gap: 8px;
    }

    .file-display {
      flex: 1 1 auto;             /* может сжиматься внутри flex */
      min-width: 0;               /* критично: разрешает сжиматься по ширине */
      min-height: 24px;
      font-size: 14px;
      padding: 4px;
      box-sizing: border-box;

      /* по умолчанию можно оставить auto,
         на мобиле принудим горизонтальный скролл медиа-запросом */
      overflow-x: auto;
      white-space: nowrap;        /* чипсы/имена в одну строку */
      -webkit-overflow-scrolling: touch;
      scrollbar-gutter: stable;   /* без дёрганья при появлении скроллбара */
    }
    

    .file-upload-wrapper button {
      background: #0056b3;   /* синий фон */
      border: none;
      padding: 8px 12px;
      border-radius: 4px;
      cursor: pointer;
      flex: 0 0 auto;
      color: white;          /* белый цвет для текста */
      font-size: 18px;
    }

    .file-upload-wrapper button:hover {
      background: #003d80;
    }

    /* Чипсы файлов */
    .file-chip {
      display: inline-flex;
      align-items: center;
      background: #e0e0e0;
      border-radius: 20px;
      padding: 4px 8px;
      margin: 3px;
      font-size: 14px;
      line-height: 1.1;
      max-width: none;            /* не ограничиваем, скролл решит всё */
    }
    .file-chip button {
      background: none;
      border: none;
      margin-left: 6px;
      cursor: pointer;
      font-weight: bold;
      color: #d9534f; /* красный */
      line-height: 1;
    }

    .file-chip button:hover {
      color: #b52b27; /* тёмно-красный при наведении */
    }

    /* --- СИЛЬНЫЕ ПЕРЕОПРЕДЕЛЕНИЯ ДЛЯ СПИСКА ОБОРУДОВАНИЯ --- */
    #equipmentList { list-style: none; padding: 0; margin: 0; }
    #equipmentList li {
      display: block !important;
      background: #f9f9f9;
      padding: 6px 10px;
      margin-bottom: 5px;
      border-radius: 6px;
      cursor: pointer;
    }
    #equipmentList li > label.equip-item {
      display: grid !important;
      grid-template-columns: 1fr auto !important;
      align-items: center !important;
      column-gap: 12px !important;
      width: 100% !important;
      margin: 0 !important;
      cursor: pointer !important;
    }
    #equipmentList .equip-text { min-width: 0 !important; line-height: 1.35; }
    #equipmentList input[type="checkbox"].equipment-checkbox {
      display: inline-block !important;
      width: 18px !important;
      height: 18px !important;
      margin: 0 !important;
      flex: 0 0 auto !important;
      justify-self: end !important;
      cursor: pointer !important;
    }

    @media (max-width: 768px) {
  /* страховка: страница не скроллится горизонтально */
  html, body { max-width: 100%; overflow-x: hidden; }

  /* главное: файлы теперь в колонку */
  .file-display {
    overflow-x: visible !important; /* скролл по горизонтали не нужен */
    white-space: normal !important; /* разрешаем перенос */
    display: flex !important;       /* переключаем на флекс */
    flex-direction: column !important; /* вертикально */
    gap: 6px;                        /* отступы между чипсами */
  }

  /* чипсы растягиваются на всю ширину */
  .file-chip {
    display: flex; 
    width: 100%;
    justify-content: space-between;
  }
}