/**
 * Мобільне вікно: стан завантаження / помилки (вміст пакета, послуги, кейса
 * приходить із сервера після кліку — main.js, openRemote).
 * У мобільних макетах цих станів немає: зроблено в стилі сайту, пропорції
 * десктопу ×0.6, як решта мобільних підписів. Десктоп — у main.css.
 */

[data-layout="mobile"] .modal__state {
  gap: 13px;
  padding: 0 30px;
}

[data-layout="mobile"] .modal__progress {
  width: 96px;
  height: 1.5px;
}

[data-layout="mobile"] .modal__state-text {
  max-width: 300px;
  font-size: 12px;
  line-height: 15.4px;
}
[data-layout="mobile"] .modal__state--error .modal__state-text {
  font-size: 15px;
  line-height: 22.5px;
}

/* Кнопка повтору — як ghost-кнопки мобільних вікон (.msrv__actions): 47 заввишки,
   мідна рамка 0.72 тінню, 15/19.2 */
[data-layout="mobile"] .modal__retry {
  height: 47px;
  padding: 2.4px 24px 0;
  border: 0;
  border-radius: 3px;
  box-shadow: inset 0 0 0 0.72px var(--accent);
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  font-size: 15px;
  line-height: 19.2px;
}

/* Кейс і лід на телефоні — білі вікна, тож хрестик там темний. Поки вміст
   вантажиться (або не завантажився), під хрестиком лише темна підкладка —
   повертаємо йому білий колір, інакше його не видно. */
[data-layout="mobile"] .modal[data-state] .modal__close { color: var(--ink); }