@import "ui-variables";
@import "ui-mixins";

atom-text-editor,
atom-text-editor[mini], atom-text-editor[mini]::shadow,
select.form-control,
.settings-view select.form-control {
  .ui-inset-shadow;
  border-radius: 0;
}

atom-text-editor[mini], atom-text-editor[mini]::shadow,
select.form-control,
.settings-view select.form-control {
  background-color: white;
}

atom-text-editor {
  padding: 2px;
}

atom-text-editor[mini], atom-text-editor[mini]::shadow {
  color: lighten(@text-color, 15%);

  border-radius: @component-border-radius;
  padding-left: @component-padding/2;

  .cursor { border-color: #000; }
  .selection .region { background-color: rgba(0, 0, 0, .2); }
  .placeholder-text {
    color: lighten(@text-color-subtle, 10%);
  }
}

atom-text-editor[mini].is-focused, atom-text-editor[mini].is-focused::shadow {
  color: @text-color;
  background-color: @input-background-color;
  border-color: @input-border-color;
  .placeholder-text {
    color: @text-color-subtle;
  }
  .selection .region {
    background-color: lighten(@background-color-info, 30%);
  }
}

// FIXME: these should go in syntax themes?
atom-text-editor, atom-text-editor::shadow {
  .gutter.drop-shadow {
    -webkit-box-shadow: -2px 0 10px 2px #222;
  }
}