/* r291 — Modal / sheet normalization по UI_STANDARD_KARETA.md
   Цель: единая база модалок без изменения JS-логики открытия/закрытия. */

:root{
  --ui-modal-w-sm: 420px;
  --ui-modal-w-md: 560px;
  --ui-modal-w-lg: 780px;
  --ui-modal-max-h: min(86vh, 760px);
  --ui-sheet-max-h: min(88vh, 760px);
  --ui-modal-pad: var(--space-4,16px);
  --ui-modal-head-pad: var(--space-4,16px);
  --ui-modal-body-pad: var(--space-4,16px);
  --ui-modal-z: var(--z-modal,300);
  --ui-modal-backdrop: rgba(15,23,42,.58);
}

/* Overlay contract: старые классы подключаются к единому поведению. */
.ui-modal,
.ui-sheet,
.cmodal-overlay.open,
.modal-overlay-v2.open,
.news-modal-overlay.open,
.cab-pane-modal-overlay.open,
.mo-tools-sheet.cmodal-overlay.open{
  position: fixed;
  inset: 0;
  z-index: var(--ui-modal-z);
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  padding: var(--ui-modal-pad);
  background: var(--ui-modal-backdrop);
  overflow: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

/* Общий контракт карточки модалки. */
.ui-modal__card,
.ui-sheet__card,
.cmodal-card,
.cmodal-box,
.modal-dialog-v2,
.modal-panel-v2,
.mo-tools-sheet-card,
.news-modal-box,
.cab-pane-modal-card,
.home-catalog-modal-card,
.part-details-modal-card,
.auth-modal{
  width: min(var(--ui-modal-w-md), calc(100vw - 24px));
  max-width: 100%;
  max-height: var(--ui-modal-max-h);
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  border-radius: var(--ui-radius-modal);
  background: var(--surface-bg, var(--surface, #fff));
  color: var(--text, #111827);
  border: var(--surface-border, 1px solid rgba(15,23,42,.12));
  box-shadow: var(--shadow-modal, 0 24px 80px rgba(15,23,42,.28));
  isolation: isolate;
}

/* Размерные варианты по смыслу старых модалок. */
.cmodal-card,
.cmodal-box,
.modal-dialog-v2,
.mo-tools-sheet-card,
.auth-modal{
  width: min(var(--ui-modal-w-md), calc(100vw - 24px));
}

.news-modal-box,
.part-details-modal-card,
.cab-pane-modal-card,
.home-catalog-modal-card{
  width: min(var(--ui-modal-w-lg), calc(100vw - 24px));
}

/* Шапка модалки — один стандарт для старых и новых классов. */
.ui-modal__head,
.ui-sheet__head,
.cmodal-head,
.modal-header-v2,
.mo-tools-sheet-head,
.cab-pane-modal-head{
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3,12px);
  min-width: 0;
  padding: var(--ui-modal-head-pad);
  border-bottom: 1px solid var(--line, rgba(15,23,42,.10));
  background: transparent;
}

.ui-modal__title,
.ui-sheet__title,
.cmodal-title,
.modal-header-v2__title,
.mo-tools-sheet-head b{
  min-width: 0;
  margin: 0;
  color: var(--text, #111827);
  font-size: 18px;
  line-height: 1.2;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ui-modal__sub,
.ui-sheet__sub,
.modal-header-v2__sub,
.mo-tools-sheet-head span:not(.mo-tools-sheet-icon){
  margin-top: 4px;
  color: var(--text2, #64748b);
  font-size: 13px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

/* Тело модалки: один scroll-контейнер внутри карточки. */
.ui-modal__body,
.ui-sheet__body,
.cmodal-body,
.modal-body-v2,
.mo-tools-sheet-body,
.news-modal-body,
.cab-pane-modal-body{
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: var(--ui-modal-body-pad);
  box-sizing: border-box;
}

/* Footer/actions. */
.ui-modal__footer,
.ui-sheet__footer,
.cmodal-actions,
.modal-footer-v2,
.news-modal-actions,
.mx-filter-actions{
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: var(--space-2,8px);
  min-width: 0;
  padding: var(--space-3,12px) var(--ui-modal-body-pad);
  border-top: 1px solid var(--line, rgba(15,23,42,.10));
}

/* Кнопки закрытия: квадратный icon-only contract. */
.ui-modal__close,
.ui-sheet__close,
.cmodal-close,
.modal-close-v2,
.mo-tools-sheet-close,
.news-modal-close{
  flex: 0 0 var(--ui-touch-target,44px);
  width: var(--ui-touch-target,44px);
  height: var(--ui-touch-target,44px);
  min-width: var(--ui-touch-target,44px);
  min-height: var(--ui-touch-target,44px);
  display: inline-grid;
  place-items: center;
  border-radius: var(--ui-radius-btn);
  border: 1px solid var(--line, rgba(15,23,42,.12));
  background: var(--surface-2, rgba(15,23,42,.04));
  color: var(--text, #111827);
  box-sizing: border-box;
  cursor: pointer;
}

.ui-modal__close:hover,
.ui-sheet__close:hover,
.cmodal-close:hover,
.modal-close-v2:hover,
.mo-tools-sheet-close:hover,
.news-modal-close:hover{
  background: var(--surface-hover, rgba(15,23,42,.08));
}

/* Tool sheets: карточка инструментов использует тот же modal contract. */
.mo-tools-sheet .mo-tools-option-list,
.mo-tools-sheet .mo-tools-filter-list,
.mo-tools-sheet .mo-tools-sort-list,
.mo-tools-sheet .mo-tools-settings{
  display: grid;
  gap: var(--space-2,8px);
  min-width: 0;
}

.mo-tools-sheet .mo-tools-option,
.mo-tools-sheet .mo-tools-filter-btn,
.mo-tools-sheet .mo-tools-sort-btn,
.mo-tools-sheet .mo-tools-setting-btn{
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  border-radius: var(--ui-radius-btn);
}

/* Длинные тексты в модалках не выталкивают карточку. */
.cmodal-card *,
.cmodal-box *,
.modal-dialog-v2 *,
.modal-panel-v2 *,
.mo-tools-sheet-card *,
.news-modal-box *,
.cab-pane-modal-card *{
  max-width: 100%;
}

/* ПК: центрированная модалка. */
@media (min-width: 1024px){
  .cmodal-overlay.open,
  .modal-overlay-v2.open,
  .news-modal-overlay.open,
  .cab-pane-modal-overlay.open,
  .mo-tools-sheet.cmodal-overlay.open{
    align-items: center;
    justify-content: center;
    padding: var(--space-5,20px);
  }
}

/* Мобильный: bottom sheet без вылета за экран и без двойных радиусов. */
@media (max-width: 640px){
  .ui-sheet,
  .cmodal-overlay.open,
  .modal-overlay-v2.open,
  .news-modal-overlay.open,
  .cab-pane-modal-overlay.open,
  .mo-tools-sheet.cmodal-overlay.open{
    align-items: flex-end;
    justify-content: center;
    padding: 0;
    overflow: hidden;
  }

  .ui-modal__card,
  .ui-sheet__card,
  .cmodal-card,
  .cmodal-box,
  .modal-dialog-v2,
  .modal-panel-v2,
  .mo-tools-sheet-card,
  .news-modal-box,
  .cab-pane-modal-card,
  .home-catalog-modal-card,
  .part-details-modal-card,
  .auth-modal{
    width: 100%;
    max-width: 100%;
    max-height: var(--ui-sheet-max-h);
    border-radius: var(--ui-radius-modal) var(--ui-radius-modal) 0 0;
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
  }

  .ui-modal__head,
  .ui-sheet__head,
  .cmodal-head,
  .modal-header-v2,
  .mo-tools-sheet-head,
  .cab-pane-modal-head{
    padding: var(--space-3,12px) var(--space-4,16px);
  }

  .ui-modal__body,
  .ui-sheet__body,
  .cmodal-body,
  .modal-body-v2,
  .mo-tools-sheet-body,
  .news-modal-body,
  .cab-pane-modal-body{
    padding: var(--space-3,12px) var(--space-4,16px) calc(var(--space-4,16px) + env(safe-area-inset-bottom));
  }

  .ui-modal__footer,
  .ui-sheet__footer,
  .cmodal-actions,
  .modal-footer-v2,
  .news-modal-actions,
  .mx-filter-actions{
    padding: var(--space-3,12px) var(--space-4,16px) calc(var(--space-3,12px) + env(safe-area-inset-bottom));
  }
}