/* Shared paper layout, row and list gutter tokens. */

:root {
  /* Radius policy:
     control = buttons, form fields and compact controls;
     panel control = square dock/panel controls;
     card = compact repeated cards and edit surfaces;
     catalog card = large catalog items;
     shell = large forms, dropdowns and panel menus;
     hero = editorial/home surfaces. */
  --vk-radius-control: 8px;
  --vk-radius-panel-control: 10px;
  --vk-radius-card: var(--vk-radius-control);
  --vk-radius-catalog-card: 12px;
  --vk-radius-shell: 18px;
  --vk-radius-hero: var(--vk-radius-shell);
  --vk-radius-tooltip: calc(var(--vk-radius-control) - 1px);
  --vk-radius-meta-tile: 5px;
  --vk-bookmark-preview-radius: 4px;
  --vk-preview-board-radius: 6px;
  --vk-analysis-list-gap: var(--vk-control-gap-comfortable);
  --vk-analysis-list-radius: var(--vk-radius-control);
  --vk-analysis-list-padding: var(--vk-control-gap) var(--vk-control-gap-compact)
    var(--vk-control-gap-comfortable) var(--vk-control-gap);
  --vk-analysis-choice-size: var(--vk-size-choice);
  --vk-analysis-choice-gap: var(--vk-control-gap-compact);
  --vk-analysis-form-field-height: var(--vk-size-form-control-compact);
  --vk-analysis-form-field-radius: var(--vk-radius-control);
  --vk-analysis-action-gap: var(--vk-control-gap);
  --vk-analysis-action-padding: var(--vk-control-gap);
  --vk-analysis-action-button-height: var(--vk-size-control);
  --vk-panel-button-height: var(--vk-paper-control-height, var(--vk-size-control));
  --vk-panel-button-padding-x: var(--vk-paper-control-padding-x, var(--vk-space-section));
  --vk-paper-list-gutter-top: max(
    var(--vk-control-gap),
    calc(var(--vk-paper-lift-hover-y, var(--vk-space-inline)) + var(--vk-space-micro))
  );
  --vk-paper-list-gutter-right: max(
    var(--vk-control-gap),
    calc(var(--vk-paper-lift-hover-shadow-blur, var(--vk-space-compact)) + var(--vk-space-micro))
  );
  --vk-paper-list-gutter-bottom: max(
    var(--vk-control-gap),
    calc(
      var(--vk-paper-lift-hover-shadow-y, var(--vk-space-inline)) +
        var(--vk-paper-lift-hover-shadow-blur, var(--vk-space-compact)) + var(--vk-space-micro)
    )
  );
  --vk-paper-list-gutter-left: max(
    var(--vk-control-gap),
    calc(var(--vk-paper-lift-hover-shadow-blur, var(--vk-space-compact)) + var(--vk-space-micro))
  );
  --vk-paper-list-gutter: var(--vk-paper-list-gutter-top) var(--vk-paper-list-gutter-right)
    var(--vk-paper-list-gutter-bottom) var(--vk-paper-list-gutter-left);
  --vk-paper-row-height: var(--vk-analysis-action-button-height);
  --vk-paper-row-radius: var(--vk-radius-control);
  --vk-paper-row-padding-x: var(--vk-space-control);
  --vk-paper-row-gap: var(--vk-control-gap);
  --vk-paper-row-leading-size: var(--vk-size-row-leading);
  --vk-paper-row-inline-action-size: var(--vk-size-row-inline-action);
  --vk-paper-row-inline-action-icon-size: 15px;
  --vk-paper-row-inline-action-gap: var(--vk-control-gap-inline);
  --vk-paper-row-context-tab-width: 18px;
  --vk-paper-row-context-tab-bottom: var(--vk-space-comfortable);
  --vk-paper-row-context-tab-radius: 0 0 5px 5px;
  --vk-paper-catalog-card-radius: var(--vk-radius-catalog-card);
  --vk-paper-menu-radius: var(--vk-radius-shell);
  --vk-panel-toggle-icon-normal: color-mix(in srgb, var(--vk-text-primary) 44%, var(--vk-paper-panel-bg) 56%);
  --vk-panel-toggle-icon-hover: var(--vk-palette-white, #fff);
  --vk-shadow-menu:
    0 14px 28px color-mix(in srgb, #000 30%, transparent),
    0 4px 10px color-mix(in srgb, #000 18%, transparent);
  --vk-shadow-popover: var(--vk-shadow-menu);
  --vk-shadow-preview: 0 3px 6px rgba(0, 0, 0, 0.22);
  --vk-shadow-home-surface: 0 0 var(--analysis-panel-shadow-size, 9px)
    var(--analysis-panel-shadow-color, var(--vk-analysis-menu-shadow));
  --vk-shadow-panel-bottom: var(--vk-shadow-home-surface);
  --vk-shadow-board-container:
    0 0 var(--analysis-panel-shadow-size, 9px) var(--analysis-panel-shadow-color, var(--vk-analysis-menu-shadow)),
    0 6px 14px color-mix(
      in srgb,
      var(--analysis-panel-shadow-color, var(--vk-analysis-menu-shadow)) 70%,
      transparent
    );
  --vk-shadow-form-card:
    0 0 var(--menu-panel-shadow-size, 8px) var(--menu-panel-shadow-color, var(--vk-analysis-menu-shadow)),
    0 6px 14px color-mix(in srgb, var(--menu-panel-shadow-color, var(--vk-analysis-menu-shadow)) 70%, transparent);
  --vk-shadow-drag-ghost: var(--vk-shadow-paper-raised, 0 6px 10px rgba(0, 0, 0, 0.24));
  --vk-shadow-context-tab: var(--vk-shadow-paper-compact-raised, 0 3px 5px rgba(0, 0, 0, 0.2));
  --vk-shadow-loader-card: 0 10px 24px var(--vk-shadow-loader);
  --vk-drag-ghost-shadow: var(--vk-shadow-drag-ghost);
  --vk-context-tab-shadow: var(--vk-shadow-context-tab);
  --vk-paper-menu-shadow: var(--vk-shadow-menu);
  --vk-paper-preview-shadow: var(--vk-shadow-preview);
  --vk-paper-bottom-panel-shadow: var(--vk-shadow-panel-bottom);
}
