/* Shared menu catalog skeleton layout. */

  .menu-catalog-skeleton.menu-catalog-layout {
    width: 100%;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: var(--menu-catalog-pad-top) var(--menu-catalog-pad-x) 0;
    box-sizing: border-box;
  }

  .menu-catalog-skeleton-scroll.menu-catalog-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    padding:
      var(--vk-paper-list-gutter-top)
      var(--vk-paper-list-gutter-right)
      max(var(--menu-catalog-pad-bottom), var(--vk-paper-list-gutter-bottom))
      var(--vk-paper-list-gutter-left);
    scroll-padding: var(--vk-paper-list-gutter);
    box-sizing: border-box;
  }

  .menu-catalog-skeleton-grid.menu-catalog-grid {
    --vk-catalog-card-min-width: var(--vk-card-selection-min-width);
    --menu-catalog-card-min: var(--vk-catalog-card-min-width);
    align-content: flex-start;
    align-items: flex-start;
    gap: 14px;
    justify-content: flex-start;
    margin: 0;
    padding: 0;
  }

  [data-menu-catalog-skeleton="variation"] .menu-catalog-skeleton-grid {
    --vk-catalog-card-min-width: var(--vk-card-variation-min-width);
  }

  [data-menu-catalog-skeleton="bookmarks"] .menu-catalog-skeleton-grid {
    --vk-catalog-card-min-width: var(--vk-card-bookmark-min-width);
  }

  [data-menu-catalog-skeleton="people"] .menu-catalog-skeleton-grid {
    --vk-catalog-card-min-width: var(--vk-card-user-min-width);
  }

  .menu-catalog-skeleton-card {
    min-height: 184px;
    display: grid;
    align-content: start;
    gap: 12px;
    padding: 16px;
    border-radius: var(--vk-paper-catalog-card-radius);
    background: var(--menu-side-canvas-bg);
    box-shadow: var(--vk-shadow-paper-raised);
    box-sizing: border-box;
    overflow: hidden;
  }

  .menu-catalog-skeleton-card--variation {
    --vk-card-preview-size: 158px;
    min-height: 208px;
    grid-template-columns: var(--vk-card-preview-size) minmax(0, 1fr);
    align-items: start;
  }

  .menu-catalog-skeleton-preview {
    width: var(--vk-card-preview-size, 158px);
    height: var(--vk-card-preview-size, 158px);
    border-radius: var(--vk-radius-shell);
    box-shadow: var(--vk-shadow-paper-raised);
  }

  .menu-catalog-skeleton-icon {
    width: 58px;
    height: 58px;
    border-radius: var(--vk-radius-shell);
    box-shadow: var(--vk-shadow-paper-raised);
  }

  .menu-catalog-skeleton-body {
    min-width: 0;
    display: grid;
    gap: 12px;
    padding-top: 4px;
  }
