/* ===== ПОИСК ПРОЕКТОВ (полноэкранное) ===== */
.fullscreen-modal {
  position: fixed; top: 0; left: 0; width: 100%; height: 100%;
  background: rgba(0,0,0,0.0); display: flex; align-items: center; justify-content: center; z-index: 1100;
}
.fs-modal-content {
  width: 90vw; height: 90vh; max-width: 1400px;
  background: var(--content-bg); border-radius: var(--border-radius); box-shadow: var(--shadow);
  overflow: hidden; position: relative; display: flex; flex-direction: column;
}

.fs-layout { display: flex; height: 100%; }

.fs-sidebar {
  width: var(--sidebar-width); background: var(--sidebar-bg);
  color: var(--text-light); padding: 28px 16px; box-sizing: border-box;
  display: flex; flex-direction: column; flex-shrink: 0; transition: transform 0.3s ease;
}
.fs-sidebar-title { font-size: 20px; font-weight: 600; margin-bottom: 24px; color: white; text-align: center; }
.fs-sidebar hr {
  border: none; border-top: 1px solid rgba(255,255,255,0.1) !important;
  margin: 16px 0; height: 0; background: none;
}

.filter-group { margin-bottom: 20px; width: 90%; margin-left: auto; margin-right: auto; }
.filter-label { display: block; font-size: 13px; font-weight: 500; margin-bottom: 8px; color: rgba(255,255,255,0.8); }

.category-list { display: flex; flex-direction: column; gap: 8px; }
.category-radio {
  display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 12px;
  background: rgba(255,255,255,0.1); color: white; font-size: 14px; cursor: pointer; transition: 0.2s;
}
.category-radio:hover { background: rgba(255,255,255,0.18); }
.category-radio input[type="radio"] { accent-color: #ffd966; margin: 0; }

.filter-select, .filter-input {
  width: 100%; padding: 10px 14px; border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.3); background: rgba(255,255,255,0.15);
  color: white; font-size: 14px; font-family: inherit; outline: none; box-sizing: border-box;
}
.filter-select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='white' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center;
}
.filter-select option { background: #3b0764; color: white; }
.filter-input::placeholder { color: rgba(255,255,255,0.5); }
.filter-range { display: flex; align-items: center; gap: 8px; }
.filter-separator { color: rgba(255,255,255,0.7); }
.filter-actions { margin-top: auto; width: 90%; margin-left: auto; margin-right: auto; display: flex; gap: 10px; }
.filter-apply-btn, .filter-reset-btn {
  flex: 1; padding: 10px; border-radius: 12px; font-weight: 600; font-size: 14px; cursor: pointer; border: none; transition: 0.2s;
}
.filter-apply-btn { background: #ffd966; color: #2d0a5e; }
.filter-apply-btn:hover { background: #ffe484; }
.filter-reset-btn { background: rgba(255,255,255,0.2); color: white; }
.filter-reset-btn:hover { background: rgba(255,255,255,0.3); }

/* Правая часть поиска */
.fs-content { flex: 1; display: flex; flex-direction: column; background: #fafcff; min-height: 0; }
.fs-topbar { display: flex; justify-content: space-between; align-items: center; padding: 16px 32px; background: #ffffff; border-bottom: 1px solid #edf2f7; flex-shrink: 0; }
.fs-header-row { display: flex; justify-content: space-between; align-items: center; padding: 24px 32px 0 32px; }
.fs-header-row .data-title { margin: 0; }
.sorting-block { display: flex; align-items: center; gap: 8px; }
.sorting-label { font-size: 14px; color: #475569; font-weight: 500; }
.sorting-select { padding: 8px 12px; border-radius: 10px; border: 1px solid #cbd5e1; background: white; font-size: 14px; font-family: inherit; outline: none; box-sizing: border-box; }
.search-input-row { padding: 12px 32px 0 32px; }
.search-text-input { width: 100%; padding: 12px 16px; border-radius: 12px; border: 1px solid #cbd5e1; font-size: 14px; font-family: inherit; outline: none; box-sizing: border-box; }

/* Карточки проектов */
.projects-grid-container {
  flex: 1; overflow-y: auto; padding: 20px 32px 32px 32px;
  display: flex; flex-direction: column; gap: 12px; align-content: start;
}

.project-card {
  background: white; border-radius: 16px; box-shadow: 0 4px 12px rgba(0,0,0,0.04);
  display: flex; align-items: stretch; overflow: hidden; cursor: pointer;
  transition: transform 0.2s, box-shadow 0.2s; min-height: 130px; flex-shrink: 0;
}
.project-card:hover { transform: translateY(-2px); box-shadow: 0 12px 24px rgba(0,0,0,0.1); }

.project-card-img-wrapper { position: relative; width: 200px; flex-shrink: 0; }
.project-card-img { width: 100%; height: 100%; object-fit: cover; background: #e2e8f0; }
.project-status-badge {
  position: absolute; top: 12px; left: 12px; padding: 5px 14px; border-radius: 20px; font-size: 12px;
  font-weight: 600; color: white; background: rgba(0,0,0,0.5); backdrop-filter: blur(4px); white-space: nowrap;
}

.project-card-body { padding: 16px 20px; flex: 1; display: flex; flex-direction: column; text-align: left; }
.project-card-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 10px; }
.project-card-title { font-size: 18px; font-weight: 700; color: #0a2540; margin: 0; word-break: break-word; max-width: 70%; }
.project-card-award { display: inline-flex; align-items: center; gap: 6px; font-size: 18px; font-weight: 700; color: #310a6b; white-space: nowrap; margin-left: 16px; flex-shrink: 0; }
.project-card-desc {
  font-size: 13px; color: #475569; line-height: 1.5;
  display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden;
  margin-bottom: 12px; flex: 1; word-break: break-word; overflow-wrap: break-word;
}
.project-card-meta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: 12px; color: #334155; margin-top: auto; }
.project-card-priority { background: #f1f5f9; padding: 2px 8px; border-radius: 20px; }
.award-icon { width: 22px; height: 22px; flex-shrink: 0; }

/* Мобильная панель фильтров (кнопка-фаб) */
.mobile-filter-fab {
  display: none;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  background: #310a6b;
  color: white;
  border: none;
  border-radius: 50%;
  font-size: 20px;
  line-height: 1;
  padding: 0;
  box-sizing: border-box;
  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
  position: absolute;
  bottom: 80px;
  right: 20px;
  z-index: 1050;
  cursor: pointer;
  transition: background 0.2s, transform 0.2s;
}
.mobile-filter-fab:hover {
  background: #4a1d8c;
  transform: scale(1.05);
}

/* ==============================
   МОБИЛЬНАЯ АДАПТАЦИЯ (≤768px)
   ============================== */
@media (max-width: 768px) {
  /* Контейнер для абсолютного позиционирования фильтров */
  .fs-layout {
    position: relative;
  }

  /* Боковая панель фильтров – скрыта за левым краем, выезжает по классу .open */
  .fs-sidebar {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 280px;
    transform: translateX(-100%);
    transition: transform 0.3s ease;
    z-index: 1100;
    background: #2d0a5e;
    padding: 28px 16px;
  }
  .fs-sidebar.open {
    transform: translateX(0);
  }

  /* Кнопка закрытия фильтров (крестик) – теперь видна */
  .mobile-filter-close {
    display: block;
    position: absolute;
    top: 12px;
    right: 16px;
    font-size: 24px;
    color: white;
    cursor: pointer;
    z-index: 1101;
  }

  /* Кнопка-фаб показывается на мобильных */
  .mobile-filter-fab {
    display: flex;
  }

  /* ---------- Резиновая правая часть ---------- */
  .fs-topbar {
    padding: 12px 16px;
  }
  .fs-header-row {
    padding: 16px 16px 0 16px;
    flex-wrap: wrap;
    gap: 8px;
  }
  .fs-header-row .data-title {
    font-size: 20px;
    margin-bottom: 8px;
  }
  .sorting-block {
    flex-wrap: wrap;
    row-gap: 4px;
  }
  .sorting-label {
    font-size: 13px;
  }
  .sorting-select {
    font-size: 13px;
    padding: 6px 10px;
  }
  .search-input-row {
    padding: 10px 16px 0 16px;
  }
  .search-text-input {
    padding: 10px 14px;
    font-size: 13px;
  }
  .projects-grid-container {
    padding: 16px 16px 24px 16px;
  }
}