@use '../../style/theming';

// MARK: Variables
$two-block-top-height-init-height: 50px;
$two-block-top-height-var: --dbx-two-block-top-height;

// MARK: Mixin
@mixin core() {
  .dbx-two-block.dbx-two-block-fixed-top {
    height: 100%;
  }

  /// @dbx-utility two-block-content
  /// @intent two-block stack content area — fixed-height region whose `.dbx-two-block-bottom` child fills the remaining height after a 50px (default) `.dbx-two-block-top`. Override the top height via `--dbx-two-block-top-height`.
  /// @role layout
  /// @see-also two-column
  .dbx-two-block-content {
    height: 100%;
    #{$two-block-top-height-var}: $two-block-top-height-init-height;

    .dbx-two-block-bottom {
      height: calc(100% - var($two-block-top-height-var));
    }
  }
}

@mixin theme($theme-config) {
}