@import '../style/variables.less';

.react-geo-window-portal {
  z-index: 1000; // see @zindex-modal
  position: inherit !important;

  .react-geo-simplebutton {
    color: #fff;
    background-color: @primary-color;
    border-color: darken(@primary-color, 5);

    &:hover {
      background-color: lighten(@primary-color, 10);
      border-color: lighten(@component-background, 5);
    }
  }

  .ant-modal-header {
    padding: 1px;
    border-bottom: 2px dotted fade(@primary-color,25);
    background-color: lighten(@component-background, 5);

    .title {
      text-overflow: ellipsis;
      overflow: hidden;
      white-space: nowrap;
    }
  }

  // shadow
  // First group shadows the right & bottom while the second group shadows the left (by using negative value) & bottom.
  -moz-box-shadow: 2px 2px 10px -2px darken(@component-background, 20), -2px 2px 10px -2px darken(@component-background, 20);
  -webkit-box-shadow: 2px 2px 10px -2px darken(@component-background, 20), -2px 2px 10px -2px darken(@component-background, 20);
  box-shadow: 2px 2px 10px -2px darken(@component-background, 20), -2px 2px 10px -2px darken(@component-background, 20);
}