@import  '../../theme/mixins';
@import '../utilities/mixins';
@import '../utilities/map';
@import '../../overlay/overlay.scss';
@import './table';
@import './button';
@import './card';
@import './grid';
@import './tabset';
@import './badge';
@import './inputs';
@import '../../blazing-font.scss';
@import './import-mixin';
@import './media-queries';


*,
*::before,
*::after {
  box-sizing: border-box; // 1
}


.fk-center {
  @include flex(center)
}

.fk-column {
  display: flex;
  flex-direction: column;
}

.fk-space-ad {
  display: flex;
  justify-content: space-around
}

.fk-flex-left {
  justify-content: flex-end;
  display: flex;
}

.fk-truncate {
  display:block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}


.fk-vertical-center {
	display:flex; 
	flex-direction:column; 
	justify-content: center;
}

.fk-space {
	display:flex;
	justify-content: space-between;
	align-items: center
}

.fk-fixed {
  position:fixed
}

.fk-absolute {
  position: absolute;
}

.fk-relative {
  position: relative;
}

.fk-break-space {
	white-space: break-spaces;
}

.fk-right {
	float:right;
}

.fk-left {
	float:left;
}

.fk-flex {
	display: flex;
}

.fk-no-wrap {
	white-space: nowrap;
}

.fk-align-center {
	text-align:center!important
}

.fk-column {
	display: flex;
	flex-direction: column
}

.fk-hidden {
	visibility: hidden;
}

.fk-disabled {
	pointer-events:none;
	opacity: 0.7
}

.fk-hide {
	display: none!important;
}

.fk-flex-left {
	text-align:end;
	flex:1;
}


/* badge */
.fk-badge {
	padding-left: 2px;
	padding-right: 2px;
  border-radius: 5px;
}


.fk-http-progress-bar {
  position: fixed;
  top: 0px;
  width: 100vw;
  z-index: 11;
  overflow: hidden;
}

html {
  font-size: 1rem;
}
      
body {
  margin: 0;
  font-family: Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  text-align: left;
  background-color: #fff;
  overflow-x: hidden;
}

.fk-header-component {
  display: flex;
  justify-content: space-between
}

.fk-header-container {
  @include flex(center);
  padding: .7rem
}

.fk-not-select-text {
  @include user-select(none);
}

.fk-visually-hidden {
  position: absolute !important;
  height: 1px;
  width: 1px;
  overflow: hidden;
  clip: rect(1px 1px 1px 1px);
  clip: rect(1px, 1px, 1px, 1px);
}


.fk-danger {
  color: #ef2e55
}

.fk-scroll-bar {
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: #e4e9f2 #f7f9fc;
  
}


.fk-scroll-bar::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}


.fk-scroll-bar::-webkit-scrollbar-track {
  background: #f7f9fc;
}


.fk-scroll-bar::-webkit-scrollbar-thumb {
  background: #e4e9f2;
  border-radius: 2px;
}


.fk-scroll-bar::-webkit-scrollbar-thumb:hover {
  background: #e4e9f2;
}


body {
  scrollbar-width: thin;
  scrollbar-color: #e4e9f2 #f7f9fc;
}


body::-webkit-scrollbar {
  width: 4px;
}


body::-webkit-scrollbar-track {
  background: #f7f9fc;
}


body::-webkit-scrollbar-thumb {
  background: #e4e9f2;
  border-radius: 2px;
}


.fk-scroll-bar::-webkit-scrollbar-thumb:hover {
  background: #e4e9f2;
}

.fk-pseudo-button {
  display: inline-block ;
  text-align: center ;
  align-items: flex-start ;
}

.fk-no-click {
  opacity: 70%;
  &:active {
    pointer-events: none;
    cursor: default !important;
    box-shadow: none !important;
  };
  &:focus:hover {
    cursor: default !important;
    box-shadow: none !important;
  };
  
}