@layer components {
  .panel {
    background: var(--color-canvas);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius);
    overflow: hidden;

    &--chart {
      padding: var(--block-space);
    }
  }

  .panel__header {
    padding: var(--block-space) var(--block-space-double);
    border-bottom: 1px solid var(--color-border);
    font-weight: 600;
  }

  .panel__body {
    padding: var(--block-space);
  }

  .panel__footer {
    padding: var(--block-space) var(--block-space-double);
    border-top: 1px solid var(--color-border);
  }
}