/* hgm-local.css - our cached map box on hotel pages (hgm-local-cached.js): the static image is a button that opens
   the live map in a dialog. Buttons start from all: unset, so theme button styles do not leak in. */
.hgm-cbox { position: absolute; top: 0; right: 0; bottom: 0; left: 0; overflow: hidden; background: #e5e3df; border-radius: inherit; }
.hgm-cbox__img { display: block !important; width: 100% !important; height: 100% !important; max-width: none !important; object-fit: cover; border-radius: 0 !important; }

.hgm-cbox__area { all: unset; position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: block; cursor: pointer; border-radius: inherit; }
.hgm-cbox__area::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0, 0, 0, 0); transition: background .15s; }
.hgm-cbox__area:hover::after { background: rgba(0, 0, 0, .06); }
.hgm-cbox__area:focus-visible { outline: 3px solid #1a73e8; outline-offset: -3px; }

.hgm-cbox__plus {
  position: absolute; z-index: 1; right: 10px; bottom: 10px; display: flex; align-items: center; justify-content: center;
  box-sizing: border-box; width: 40px; height: 40px; color: #1f2937; background: #fff; border: 1px solid #d1d5db; border-radius: 6px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .2); transition: border-color .15s, transform .15s;
}
.hgm-cbox__area:hover .hgm-cbox__plus { border-color: #1f2937; transform: scale(1.06); }
.hgm-cbox svg { display: block; width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }

.hgm-cbox__dialog { max-width: none; max-height: none; width: 100%; height: 100%; margin: 0; padding: 3.5rem 1rem 1rem; border: 0; background: transparent; }
.hgm-cbox__dialog[open] { display: flex; align-items: center; justify-content: center; }
.hgm-cbox__dialog::backdrop { background: rgba(17, 24, 39, .9); }
.hgm-cbox__dialog iframe { display: block; width: min(100%, 1200px); height: min(100%, 800px); border: 0; border-radius: 8px; background: #e5e3df; }
.hgm-cbox__close {
  all: unset; position: absolute; top: .75rem; right: .75rem; display: flex; align-items: center; justify-content: center;
  box-sizing: border-box; width: 40px; height: 40px; color: #fff; border-radius: 50%; cursor: pointer; transition: background .15s;
}
.hgm-cbox__close svg { width: 24px; height: 24px; }
.hgm-cbox__close:hover { background: rgba(255, 255, 255, .15); }
.hgm-cbox__close:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
