/**
 * Loaded in the Ladle *shell* document (appendToHead). Story iframe uses catalog.css;
 * theme classes on documentElement are synced to both, so vars must match catalog.css.
 */
.theme-light {
  --catalog-bg: #ffffff;
  --catalog-fg: #000000;
  --catalog-border: #d4d4d4;
  --catalog-muted: #525252;
}

.theme-dark {
  --catalog-bg: #333333;
  --catalog-fg: #ffffff;
  --catalog-border: #525252;
  --catalog-muted: #d4d4d4;
}

/* Split-pane drag strip lives in the shell, outside the story iframe */
.ladle-resize-handle {
  background-color: var(--catalog-border) !important;
  background-image: none !important;
  border-color: var(--catalog-border) !important;
  box-shadow: none !important;
}

.ladle-resize-handle:hover,
.ladle-resize-handle:focus-visible {
  background-color: var(--catalog-muted) !important;
}