@use '~@cb-general/core/styles/mixins' as *;

$root: FlatInputButton;

:global(.#{$root}) {
  background-color: #292c35;
  border-top-right-radius: toRem(5);
  border-bottom-right-radius: toRem(5);
  text-transform: uppercase;
  font-weight: 900;
  font-size: 1.1em;
  padding-left: toRem(18);
  padding-right: toRem(18);
  font-family: Roboto;
  color: white;

  &:before {
    content: '';
    opacity: 0.9;
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient(270deg, #21242d 0%, rgba(20, 23, 33, 0) 100%);
    width: 2rem;
    height: 100%;
    transform: translateX(-100%);
  }

  &:active {
    opacity: 0.8;
  }
}

:export {
  root: $root;
}