/* ============================================================
   Пошук за назвою дисципліни (чанк subj-outer)
   Підключити у власний CSS сайту, після Bootstrap.
   Усе інше в чанку працює на класах Bootstrap.
   ============================================================ */

.subj-search {
  max-width: 560px;
}

/* Іконка лупи в input-group */
.subj-search .input-group-text {
  border-right: 0;
}

.subj-search .form-control {
  border-left: 0;
  padding-left: 0;
}

/* Прибрати рідну хрестик-кнопку браузера в type="search" */
.subj-search input[type="search"]::-webkit-search-decoration,
.subj-search input[type="search"]::-webkit-search-cancel-button,
.subj-search input[type="search"]::-webkit-search-results-button,
.subj-search input[type="search"]::-webkit-search-results-decoration {
  -webkit-appearance: none;
  appearance: none;
}

/* Фокус: рамка підсвічує всю групу, а не лише поле */
.subj-search .input-group:focus-within .input-group-text,
.subj-search .input-group:focus-within .form-control,
.subj-search .input-group:focus-within .btn {
  border-color: #86b7fe;
}

.subj-search .form-control:focus {
  box-shadow: none;
}

/* Підсвітка знайденого фрагмента */
#subjList mark {
  background: #ffe9a8;
  color: inherit;
  padding: 0;
  border-radius: 2px;
}

/* Список дисциплін */
#subjList {
  list-style: none;
  margin: 0;
  padding: 0;
}

#subjList > .subj-item {
  display: flex;
  align-items: baseline;
  gap: .5rem;
  padding: .6rem .85rem;
  border: 1px solid #e2e6ea;
  border-radius: .5rem;
  background: #fff;
  margin-bottom: .35rem;
}

#subjList > .subj-item:hover {
  border-color: #ccd3d9;
}

.subj-title {
  flex: 1 1 auto;
  min-width: 0;
  line-height: 1.45;
}

/* Пункт без файлу: без посилання, приглушений */
.subj-title--plain {
  color: #6c757d;
}

/* Кнопка копіювання посилання: видима, але не перетягує увагу */
#subjList .btn-copy {
  flex: 0 0 auto;
  color: #adb5bd;
  text-decoration: none;
}

#subjList .btn-copy:hover,
#subjList .btn-copy:focus {
  color: #0d6efd;
}

@media (max-width: 575.98px) {
  .subj-search {
    max-width: none;
  }
}
