/* Copyright (c) Fortanix, Inc.
|* This Source Code Form is subject to the terms of the Mozilla Public License, v. 2.0. If a copy of
|* the MPL was not distributed with this file, You can obtain one at http://mozilla.org/MPL/2.0/. */

@use '../../../styling/defs.scss' as bk;

@property --bk-panel-inset-compensation {
  syntax: '<length>';
  initial-value: 0;
  inherits: true;
}

@mixin panel($name: bk-panel) {
  --bk-panel-background-color: #{bk.$theme-card-background-default};
  --bk-panel-border-color: #{bk.$theme-card-border-default};
  --bk-panel-inset: #{bk.$spacing-4};
  
  overflow: hidden;
  
  min-block-size: 4rem;
  padding: var(--bk-panel-inset);
  background: var(--bk-panel-background-color);
  border: bk.rem-from-px(1) solid var(--bk-panel-border-color);
  border-radius: bk.$radius-3;
}


@layer baklava.components {
  .bk-panel {
    @include bk.component-base(bk-panel);
    @include panel;
    
    &.bk-panel--edgeless {
      // Communicate the current panel inset to any children who might want to compensate for it (e.g. edgeless layouts)
      --bk-panel-inset-compensation: var(--bk-panel-inset);
    }
    
    .bk-panel__heading {
      margin-block-end: bk.$spacing-7;
      text-wrap: nowrap;
      text-overflow: ellipsis;
    }
  }
}
