@use '../../_styles/mixin.scss' as *;

.o-table-medium {
  @include respond('<=laptop') {
    --table-text-size: var(--o-font_size-tip1);
    --table-text-height: var(--o-line_height-tip1);

    --table-head-cell-padding-y: 8px;
    --table-cell-padding-y: 8px;

    --table-edge-padding: 24px;
    --table-expand-cell-padding: 24px;

    --table-row-icon-size: var(--o-icon_size-s);
  }

  @include respond('<=pad') {
    --table-radius: var(--o-radius_control-s);

    --table-head-cell-padding-x: 12px;
    --table-cell-padding-x: 12px;

    --table-edge-padding: 20px;
    --table-expand-cell-padding: 16px;
  }

  @include respond('<=pad_v') {
    --table-text-size: var(--o-font_size-tip2);
    --table-text-height: var(--o-line_height-tip2);

    --table-head-cell-padding-x: 8px;
    --table-cell-padding-x: 8px;
    --table-edge-padding: 8px;
    --table-expand-cell-padding: 12px;

    --table-row-icon-size: var(--o-icon_size-m);
  }
}

.o-table-small {
  @include respond('<=laptop') {
    --table-expand-cell-padding: 16px;
  }
  @include respond('<=pad') {
    --table-text-size: var(--o-font_size-tip2);
    --table-text-height: var(--o-line_height-tip2);
    --table-head-cell-padding-x: 8px;
    --table-cell-padding-x: 8px;

    --table-edge-padding: 8px;
    --table-expand-cell-padding: 12px;

    --table-radius: var(--o-radius_control-s);
  }
}