.credent-google-map {
  --map-hue: 356deg;
  --map-saturation: 92%;
  --map-brightness: 102%;
  --map-contrast: 100%;
  --map-invert: 0%;
  --map-sepia: 0%;
  --map-opacity: 100%;
  --map-blur: 0px;
  --map-blend-mode: normal;
  --info-bg: #ffffff;
  --info-text: #333333;
  --info-radius: 24px;
  --info-padding: 30px 38px 34px;
  width: 100%;
  min-height: 320px;
  overflow: hidden;
  position: relative;
}

.credent-google-map__canvas {
  height: 100%;
  min-height: inherit;
  width: 100%;
}

.credent-google-map[data-apply-filters="true"] .credent-google-map__canvas {
  filter:
    hue-rotate(var(--map-hue))
    saturate(var(--map-saturation))
    brightness(var(--map-brightness))
    contrast(var(--map-contrast))
    invert(var(--map-invert))
    sepia(var(--map-sepia))
    opacity(var(--map-opacity))
    blur(var(--map-blur));
  mix-blend-mode: var(--map-blend-mode);
}

.credent-google-map[data-builder-preview="false"] .credent-google-map__pins {
  display: none;
}

.credent-google-map[data-builder-preview="true"] {
  height: auto !important;
}

.credent-google-map[data-builder-preview="true"] .credent-google-map__canvas {
  height: 420px;
}

.credent-google-map[data-builder-preview="true"] .credent-google-map__pins {
  background: #f5f6f7;
  border: 1px dashed var(--bricks-border-color, #dddedf);
  display: grid;
  gap: 12px;
  margin-top: 12px;
  padding: 12px;
}

.credent-google-map[data-builder-preview="true"] .credent-google-map-pin {
  background: #ffffff;
  border: 1px solid var(--bricks-border-color, #dddedf);
  border-radius: 4px;
  padding: 16px;
}

.credent-google-map .gm-style .gm-style-iw-c {
  background: var(--info-bg);
  border-radius: var(--info-radius);
  color: var(--info-text);
  overflow: visible;
  padding: 0;
}

.credent-google-map .gm-style .gm-style-iw-d {
  color: var(--info-text);
  max-height: none !important;
  overflow: visible !important;
}

.credent-google-map .gm-style .gm-style-iw-d,
.credent-google-map .gm-style .gm-style-iw-chr,
.credent-google-map .gm-style .gm-style-iw-ch {
  background: var(--info-bg);
  border-radius: var(--info-radius);
}

.credent-google-map .gm-style .gm-style-iw-chr {
  height: 0;
  min-height: 0;
}

.credent-google-map .gm-style .gm-style-iw-ch {
  display: none;
}

.credent-google-map .gm-style .gm-style-iw-tc::after {
  background: var(--info-bg);
}

.credent-google-map .gm-style .gm-ui-hover-effect {
  position: absolute !important;
  top: 8px !important;
  right: 8px !important;
  z-index: 2;
}

.credent-google-map .gm-style .gm-ui-hover-effect span {
  background-color: var(--info-text);
}

.credent-google-map__info {
  box-sizing: border-box;
  color: var(--info-text);
  max-width: 320px;
  padding: var(--info-padding);
}

.credent-google-map__info-pin {
  display: block;
}

.credent-google-map__info > :first-child {
  margin-top: 0;
}

.credent-google-map__info > :last-child {
  margin-bottom: 0;
}

.credent-google-map__info :where(h1, h2, h3, h4, h5, h6, p, span, div, li, i):not(.bricks-button):not(.bricks-button *) {
  color: inherit;
}

.credent-google-map__info a:not(.bricks-button) {
  color: inherit;
}

.credent-google-map__info svg [stroke] {
  stroke: currentColor;
}

.credent-google-map__info svg [fill]:not([fill="none"]) {
  fill: currentColor;
}

.credent-google-map__info .bricks-button {
  display: inline-flex;
}

.credent-google-map__info-title {
  color: inherit;
  font-size: 18px;
  line-height: 1.3;
  margin: 0 28px 10px 0;
}

.credent-google-map__info-content {
  color: inherit;
  font-size: 14px;
  line-height: 1.55;
}

.credent-google-map__info-content > :last-child {
  margin-bottom: 0;
}

.credent-google-map__info-actions {
  margin: 16px 0 0;
}

.credent-google-map__info-button {
  display: inline-flex;
  line-height: 1;
}

@media (max-width: 767px) {
  .credent-google-map {
    min-height: 420px;
  }

  .credent-google-map__info {
    max-width: 260px;
  }
}