// Typography Rules - Scoped to #sideconvo-app
// NOTE: Heading/paragraph styles are intentionally NOT defined here.
// They are applied via Figma typography mixins (@include heading-3, etc.)
// at the component level in SCSS Modules. Defining them here with
// #sideconvo-app scoping creates specificity (0-1-1) that overrides
// CSS Module classes (0-1-0).
@use 'sass:map';
@use '../abstracts/variables' as *;
@use '../abstracts/mixins' as *;

#sideconvo-app {
  code,
  pre {
    font-family: $font-family-mono;
  }

  code {
    @include font-size('sm');
    padding: 2px 6px;
    background-color: $color-gray-100;
    border-radius: map.get($radius, 'sm');
  }

  pre {
    @include font-size('sm');
    padding: map.get($spacing-scale, 'md');
    background-color: $color-gray-100;
    border-radius: map.get($radius, 'md');
    overflow-x: auto;

    code {
      padding: 0;
      background-color: transparent;
    }
  }
}