/* СПИСКИ ИЗБРАННОГО И ИСТОРИИ — в стиле выдвижной панели карты.
 *
 * Отдельный файл, а не дописка в `map-sheet.css`: там оформление ПЕРЕЕХАВШИХ
 * блоков боковой колонки, а здесь разметка новая, своя (`js/map/favorites.js`,
 * `js/map/recent.js`). Смешав их, мы связали бы правки старых полей с правками
 * новых списков.
 *
 * Повторяем окна приложения (`favorites_sheet.dart`, `recent_sheet.dart`):
 * строка «значок — название и адрес — красная кнопка справа», удаление в два
 * шага, переспрос текстом вместо значка.
 */

.mlist-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 8px;
}

.mlist-title {
  flex: 1;
  font-size: 15px;
  font-weight: 600;
  color: var(--text);
}

/* «Очистить» — действие отменяющее: спокойный вид, красный только цветом. */
.mlist-clear {
  padding: 5px 10px;
  border-radius: 8px;
  border: 1px solid transparent;
  background: rgba(224, 49, 49, .12);
  color: var(--danger, #e03131);
  font: inherit;
  font-size: 12.5px;
  cursor: pointer;
}
.mlist-clear:hover { background: rgba(224, 49, 49, .2); }
/* Переспросили — заметнее, чтобы второе нажатие было осознанным. */
.mlist-clear.is-sure { background: rgba(224, 49, 49, .28); border-color: var(--danger, #e03131); }

.mlist-rows { display: flex; flex-direction: column; }

.mlist-row {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 2px 0;
  border-top: 1px solid var(--border);
}
.mlist-row:first-child { border-top: none; }

/* Само направление — кнопка во всю ширину строки: за рулём целятся грубо,
   попасть нужно в любую точку строки, а не в текст. */
.mlist-go {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  padding: 9px 8px;
  border: none;
  border-radius: 10px;
  background: transparent;
  color: var(--text);
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.mlist-go:hover { background: rgba(255, 255, 255, .05); }

.mlist-ico { flex: none; font-size: 16px; line-height: 1; }

.mlist-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
/* Длинный адрес обязан ужиматься в многоточие, иначе строка ломает панель. */
.mlist-txt b,
.mlist-txt i {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mlist-txt b { font-size: 14px; font-weight: 500; }
.mlist-txt i { font-size: 11.5px; font-style: normal; color: var(--text-mute); }

/* Сколько раз туда ездили. */
.mlist-uses { flex: none; font-size: 12px; color: var(--accent-2, #2dd4bf); }

.mlist-del {
  flex: none;
  padding: 6px 8px;
  border: none;
  border-radius: 8px;
  background: rgba(224, 49, 49, .14);
  color: var(--danger, #e03131);
  font: inherit;
  font-size: 12px;
  line-height: 1.4;
  cursor: pointer;
}
.mlist-del:hover { background: rgba(224, 49, 49, .22); }
.mlist-del.is-sure { background: rgba(224, 49, 49, .28); padding: 6px 10px; }
.mlist-del:disabled { opacity: .5; cursor: default; }

.mlist-empty {
  margin: 4px 0 12px;
  font-size: 12.5px;
  line-height: 1.4;
  color: var(--text-mute);
}