@import './tide-form-variables';
@import './font';

#tide-form {
  @import './components/mixins';
  @import './components/placeholders';
  @import './components/base';
  @import './components/form';
  @import './components/button';
  @import './components/cta';

  @import './components/step-indicators';
  @import './components/tree';
  @import './components/booking';
  @import './components/checkbox';
  @import './components/radiobutton';
  @import './components/dropdown';
  @import './components/loader';
  @import './components/date-range-picker';
  @import './components/tide-form';
  @import './components/contact';

  @extend %reset;
  @include body;

  %scrollbar-none {
    &::-webkit-scrollbar {
      width: 0px;
      height: 0px;
    }

    &::-webkit-scrollbar-track {
      padding: 0;
      background: transparent;
    }
  }

  %scrollbar-thin {
    &::-webkit-scrollbar {
      width: 8px;
      height: 8px;
    }

    &::-webkit-scrollbar-track {
      padding: 2px;
      background: transparent;
    }

    &::-webkit-scrollbar-thumb {
      border-radius: 4px;
      background-color: #cbcbcb;
    }
  }

  @extend %scrollbar-thin;
}