@import 'reset';

html, body {
  margin: 0;
  padding: 0;
  overflow: auto;
  overflow-y: hidden;
  height: 100%;
}

html {
  font-size: var(--sn-stylekit-base-font-size);
}

body {
  background-color: transparent;
  font-family: sans-serif;
  margin: 0;
  padding: 0;
  font-family: -apple-system, BlinkMacSystemFont,
    "Segoe UI", "Roboto", "Oxygen",
    "Ubuntu", "Cantarell", "Fira Sans",
    "Droid Sans", "Helvetica Neue", sans-serif;
  -webkit-font-smoothing: antialiased;
  font-size: var(--sn-stylekit-font-size-p);
}

#root {
  height: 100%;
}

a.sk-button {
  text-decoration: none;
}

.sn-component, .sk-panel, .sk-panel-content {
  height: 100%;
  overflow-x: hidden;
}

#title-container {
  width: 60px;
}

#title  {
  font-weight: 900;
  text-transform: uppercase;
  word-spacing: 1000px;
}

#panel-content {
  padding: 0px 8px;
  height: 100%;
  // padding-top: 6px;
  // On Windows, a horizontal scroll bar also creates a vertical scroll bar on Firefox.
  // Ideally this interface would be responsive and always scroll vertically instead.
  overflow-x: hidden !important;
}

.sn-component .sk-panel-row  {
  padding-top: 0 !important;
}

.vertical-rule {
  height: 100% !important;
  width: 1px;
  background-color: var(--sn-stylekit-border-color);
  margin-right: 10px;
  margin-left: 10px;
}

.full-height {
  height: 100% !important;
}

.sk-button.no-border {
  border: none;
}

#commit-info {
  display: flex;
  flex-wrap: nowrap;
  flex-direction: row;
  align-items: center;

  input {
    margin: 0;
    margin-right: 3px;
    height: 35px;
  }

  .file-path, .commit-message {
    width: 200px;
  }

  .file-ext {
    width: 60px;
  }

  .sk-button {
    margin-left: 10px;
  }
}

input {
  width: 150px;
}

.token-form {
  position: relative;
}

.token-form input {
  margin: 0px;
  padding-right: 60px !important;
  width: 100%;
  outline: none;
  height: 30px;
  border-radius: 5px;
}

.token-form div {
  position: absolute;
  top: 0;
  border-radius: 5px;
  right: 0px;
  z-index: 2;
  border: none;
  top: 7px;
  height: 30px;
  cursor: pointer;
  font-weight: 900;
}