:root {
    --hlm-accent: #c66a13;
    --hlm-accent-hover: #a9570c;
    --hlm-text: #17181b;
    --hlm-muted: #65686f;
    --hlm-border: #e6e1db;
}

/* The component intentionally inherits the WordPress theme. */
.hlm-app {
    width: 100%;
    margin: 30px 0 42px;
    color: var(--hlm-text);
}

.hlm-map-shell {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--hlm-border);
    border-radius: 9px;
    background: #e9e7e3;
    box-shadow: 0 10px 30px rgba(23,24,27,.08);
}

.hlm-map {
    width: 100%;
    height: min(68vh, 640px);
    min-height: 470px;
}

.hlm-map-placeholder {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    background:
        radial-gradient(circle at 50% 45%, rgba(255,255,255,.62), rgba(226,223,218,.35) 45%, rgba(210,206,200,.5));
}

.hlm-placeholder-card {
    width: min(330px, calc(100% - 35px));
    padding: 24px;
    text-align: center;
    background: rgba(255,255,255,.94);
    border: 1px solid rgba(23,24,27,.09);
    border-radius: 12px;
    box-shadow: 0 14px 35px rgba(23,24,27,.12);
}

.hlm-placeholder-icon { margin-bottom: 5px; font-size: 34px; }
.hlm-placeholder-card strong { display:block; margin-bottom:5px; font-size:17px; }
.hlm-placeholder-card p { margin:0; color:var(--hlm-muted); font-size:12px; line-height:1.55; }

.hlm-cta {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:25px;
    margin-top:16px;
    padding:18px 21px;
    border:1px solid var(--hlm-border);
    border-radius:9px;
    background:#fbfaf8;
}

.hlm-cta-copy { display:flex; align-items:center; gap:13px; }
.hlm-cta-icon { font-size:27px; line-height:1; }
.hlm-cta h3 { margin:0 0 3px; font-size:17px; }
.hlm-cta p { margin:0; color:var(--hlm-muted); font-size:13px; line-height:1.45; }

.hlm-primary {
    appearance:none;
    border-radius:6px;
    padding:11px 17px;
    border:1px solid var(--hlm-accent);
    background:var(--hlm-accent);
    color:#fff;
    font:inherit;
    font-size:13px;
    font-weight:700;
    cursor:pointer;
    transition:background .18s ease, transform .18s ease;
    white-space:nowrap;
}
.hlm-primary:hover { background:var(--hlm-accent-hover); border-color:var(--hlm-accent-hover); color:#fff; transform:translateY(-1px); }

.hlm-modal { position:fixed; inset:0; z-index:999999; display:none; }
.hlm-modal.is-open { display:block; }
.hlm-modal-backdrop { position:absolute; inset:0; background:rgba(20,20,22,.58); backdrop-filter:blur(4px); }

.hlm-dialog {
    position:relative;
    width:min(620px,calc(100% - 28px));
    max-height:90vh;
    overflow:auto;
    margin:5vh auto;
    padding:30px;
    border:1px solid #e2ddd7;
    border-radius:12px;
    background:#fff;
    color:var(--hlm-text);
    box-shadow:0 30px 80px rgba(0,0,0,.25);
}
.hlm-kicker { display:block; margin-bottom:7px; color:var(--hlm-accent); font-size:11px; letter-spacing:.14em; font-weight:800; }
.hlm-close { position:absolute; top:9px; right:13px; width:36px; height:36px; border:0; background:transparent; color:#777; font-size:28px; line-height:1; cursor:pointer; }
.hlm-dialog h2 { margin:5px 0 7px; font-size:28px; line-height:1.2; }
.hlm-dialog-intro { margin:0 0 20px; color:var(--hlm-muted); font-size:13px; line-height:1.6; }
.hlm-dialog label { display:block; margin:14px 0; color:#34363a; font-size:12px; font-weight:700; }
.hlm-dialog input,.hlm-dialog textarea { width:100%; margin-top:6px; padding:10px 11px; border:1px solid #d9d4ce; border-radius:6px; background:#fff; color:#17181b; font:inherit; font-size:14px; outline:none; }
.hlm-dialog input:focus,.hlm-dialog textarea:focus { border-color:var(--hlm-accent); box-shadow:0 0 0 2px rgba(198,106,19,.1); }
.hlm-grid { display:grid; grid-template-columns:1fr 1fr; gap:0 14px; }
.hlm-optional { color:#92959a; font-weight:500; }

.hlm-sweets-notice {
    display:flex;
    align-items:center;
    gap:12px;
    margin:18px 0;
    padding:12px 14px;
    border:1px solid #eadbca;
    border-radius:7px;
    background:#fff9f2;
}
.hlm-sweets-notice > span { font-size:25px; }
.hlm-sweets-notice strong { display:block; font-size:13px; }
.hlm-sweets-notice small { display:block; margin-top:2px; color:var(--hlm-muted); font-size:11px; line-height:1.4; }

.hlm-submit { width:100%; margin-top:5px; }
.hlm-form-message { min-height:18px; margin-top:11px; color:var(--hlm-muted); font-size:12px; text-align:center; color:#c66a13 }

.hlm-infowindow {
    --hlm-map-scale:1;
    position:relative;
    width:440px;
    max-width:calc(100vw - 36px);
    padding:28px 30px 25px;
    box-sizing:border-box;
    color:#17181b;
    font-family:inherit;
    background:#fffdf9;
    border-radius:20px;
    box-shadow:0 12px 30px rgba(23,24,27,.18);
    transform:scale(var(--hlm-map-scale));
    transform-origin:50% 100%;
}

.hlm-infowindow-top {
    display:flex;
    align-items:center;
    gap:18px;
}

.hlm-infowindow-icon {
    flex:0 0 82px;
    width:82px;
    height:82px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#fff0dc;
}

.hlm-infowindow-icon img {
    display:block;
    width:68px;
    height:68px;
    object-fit:contain;
}

.hlm-infowindow-title {
    min-width:0;
    flex:1;
    padding-right:54px;
}

.hlm-infowindow h3 {
    margin:0 0 10px;
    color:#17181b;
    font-size:22px;
    line-height:1.15;
    font-weight:700;
    letter-spacing:-.2px;
}

.hlm-tags {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
}

.hlm-tag {
    display:inline-flex;
    align-items:center;
    gap:7px;
    padding:7px 12px;
    border-radius:999px;
    background:#fff0dc;
    color:#a35c12;
    font-size:13px;
    line-height:1;
    font-weight:700;
}

.hlm-tag img {
    display:block;
    width:21px;
    height:21px;
}

.hlm-infowindow-description {
    margin:23px 0 0;
    color:#626873;
    font-size:16px;
    line-height:1.45;
    font-weight:400;
}

.hlm-infowindow-divider {
    height:1px;
    margin:22px 0 15px;
    background:#ebe4dc;
}

.hlm-infowindow-address,
.hlm-infowindow-location {
    display:flex;
    align-items:center;
    gap:11px;
    color:#60656d;
    font-size:14px;
    line-height:1.3;
    font-weight:650;
}

.hlm-infowindow-location {
    margin-top:7px;
}

.hlm-address-icon {
    flex:0 0 27px;
    width:27px;
    height:27px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#f1efec;
    color:#656b73;
}

.hlm-address-icon svg {
    width:16px;
    height:16px;
    fill:currentColor;
    stroke:currentColor;
    stroke-width:1.2;
}

.hlm-infowindow-address small {
    display:block;
    margin-top:2px;
    color:#8a8e95;
    font-size:12px;
    font-weight:500;
}

.hlm-candy-decoration {
    position:absolute;
    right:23px;
    bottom:17px;
    width:64px;
    height:48px;
    opacity:.48;
    transform:rotate(-8deg);
}

/* Remove Google's extra header area so the card starts immediately at the top. */
.gm-style .gm-style-iw-c {
    padding:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
}

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

.hlm-infowindow-close {
    position:absolute;
    top:16px;
    right:16px;
    width:42px;
    height:42px;
    padding:0;
    margin:0;
    border:0;
    border-radius:50%;
    background:#fff0dc !important;
    box-shadow:0 2px 8px rgba(23,24,27,.08);
    cursor:pointer;
    z-index:20;
    appearance:none;
    -webkit-appearance:none;
}

.hlm-infowindow-close::before,
.hlm-infowindow-close::after {
    content:"";
    position:absolute;
    left:12px;
    top:20px;
    width:18px;
    height:2px;
    border-radius:2px;
    background:#626873;
}

.hlm-infowindow-close::before {
    transform:rotate(45deg);
}

.hlm-infowindow-close::after {
    transform:rotate(-45deg);
}

.hlm-infowindow-close:hover {
    background:#ffe7c7;
}

.gm-style .gm-style-iw-chr {
    display:none !important;
    position:absolute !important;
    top:13px !important;
    right:13px !important;
    z-index:10 !important;
    height:auto !important;
    padding:0 !important;
}

.gm-style .gm-style-iw-chr button {
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
    min-height:42px !important;
    margin:0 !important;
    padding:9px !important;
    box-sizing:border-box !important;
    border-radius:50% !important;
    background:#fff0dc !important;
    border:0 !important;
    box-shadow:0 1px 5px rgba(23,24,27,.08) !important;
    opacity:1 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
}

.gm-style .gm-style-iw-chr button img {
    width:24px !important;
    height:24px !important;
    display:block !important;
}

.gm-style .gm-style-iw-tc {
    display:none !important;
}

.hlm-infowindow::after {
    content:"";
    position:absolute;
    left:50%;
    bottom:-14px;
    width:28px;
    height:28px;
    background:#fffdf9;
    transform:translateX(-50%) rotate(45deg);
    border-radius:0 0 4px 0;
}

body.hlm-no-scroll { overflow:hidden; }

@media (max-width:760px) {
    .gm-style .gm-style-iw-c {
        max-width:calc(100vw - 28px) !important;
    }

    .hlm-infowindow {
        width:100%;
        padding:24px 22px 22px;
    }

    .hlm-infowindow-icon {
        flex-basis:70px;
        width:70px;
        height:70px;
    }

    .hlm-infowindow-icon img {
        width:58px;
        height:58px;
    }

    .hlm-infowindow-title {
        padding-right:34px;
    }

    .hlm-infowindow h3 {
        font-size:19px;
    }

    .hlm-app { margin:22px 0 32px; }
    .hlm-map { height:64vh; min-height:430px; }
    .hlm-cta { align-items:flex-start; flex-direction:column; padding:18px; }
    .hlm-cta .hlm-primary { width:100%; }
    .hlm-grid { grid-template-columns:1fr; }
    .hlm-dialog { margin:3vh auto; padding:24px 20px; }
}
