/* 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/. */

@forward './variables.scss';
@forward './global/fonts.scss' hide styles;
@forward './global/accessibility.scss' hide styles;
@forward './context/theming.scss' hide styles;

@forward './features/util.scss';
@forward './features/text.scss';
@forward './features/typography.scss' as typography-*;
@forward './features/layout.scss';
@forward './features/scroll.scss' as scroll-*;
@forward './features/skeleton.scss' as skeleton-*;

@use './variables.scss' as vars;



// @function fluid-size($size) {
//   $scale: #{calc(tan(atan2($size, 1px)) * 14)};
//   @return #{round(min($size, $scale / 768 * 100vi), 1px)};
// }

@mixin component-base($name) {
  container-name: $name;
  /* Enable content containment. This enforces that the component's content is isolated from its parents. */
  /* https://css-tricks.com/lets-take-a-deep-dive-into-the-css-contain-property */
  contain: layout style;
  
  // The following both disallow anything painted outside of the element boundaries, except from things like outlines
  // or `border-image` on the outer element. However, enabling these by default is not a good idea, because it may cut
  // off things like focus outlines on child elements. We cannot guaranteed that there there is a padding on every `.bk`
  // element to prevent this kind of thing.
  //overflow: hidden;
  //contain: paint;
}

@mixin rounded($radius: bkl.$radius-3) {
  border-radius: $radius;
  overflow: hidden; // Prevent child items from "bleeding through" the rounded borders
}
