//
// Map Popover
// --------------------------------------------------

.map-popover {
  width: $grid-unit-x * 45;
  font-family: $font-family-base;

  p {
    font-family: $font-family-base;
    font-size: $font-size-base;
  }

  &-header {
    padding: $grid-unit-y * 3;
  }

  &-body {
    padding: $grid-unit-y * 3;

    .table {
      margin-left: -$grid-unit-y * 3;
      margin-right: -$grid-unit-y * 3;
      width: auto;
      max-width: none;
    }
  }

  &-footer {
    padding: $grid-unit-y * 3;
  }

  &-dark {
    .map-popover-header {
      background-color: $color-bg;
      border-bottom: 6px solid $brand-danger;

      &,
      h4 {
        color: $color-white;
      }
    }

    .map-popover-footer {
      background-color: $color-bg;
      border-top: 6px solid $brand-danger;
      color: $color-white;
    }

    .gm-style-iw-t:after {
      background-color: $color-bg;
      background-image: none;
    }
  }
}

.angular-google-map-container {
  .gm-style-iw {
    font-size: $font-size-base;
    padding: 0;
    border-radius: $border-radius-base * 6;

    @include themes(background, map-popover-bg);
    @include box-shadow-themes(box-shadow-2);

    .gm-style-iw-d {
      overflow: visible !important;
    }

    button.gm-ui-hover-effect {
      top: (ceil($grid-unit-y * 2) - 1) !important;
      right: (ceil($grid-unit-y * 2) - 1) !important;
      font-size: $font-size-large;

      @include themes(color, color-text-dark);

      &:before {
        content: "\f00d";
        font-family: $font-family-awesome;
        font-weight: $font-family-awesome-weight;
      }

      span {
        display: none !important;
      }

      img {
        display: none !important;
      }

      span {
        display: none !important;
      }
    }
  }

  .gm-style-iw-t:after {
    height: 17px;
    width: 17px;

    @include box-shadow(none);
    @include themes(background, map-popover-bg);
  }
}