.mpl-location-locator, .mpl-location-modal {
  --mpl-primary: #0f3d78;
  --mpl-primary-hover: #082b57;
  --mpl-accent: #ff7a00;
  --mpl-text: #1f2f46;
  --mpl-text-muted: #62718a;
  --mpl-border: #dfe5ec;
  --mpl-surface: #ffffff;
  --mpl-filter-button-bg: #f6f8fb;
  --mpl-info-box-bg: #f8fafc;
  --mpl-map-bg: #d8ecfb;
  --mpl-on-primary: #ffffff;
  --mpl-overlay: #081423;
  width: 100%;
  max-width: none!important;
  color: var(--mpl-text);
}

.mpl-category-filter { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; padding: 18px; border-bottom: 1px solid var(--mpl-border); }
.mpl-category-btn { border: 0; border-radius: 5px; background: var(--mpl-filter-button-bg); color: var(--mpl-text); padding: 12px 20px; font-size: 15px; font-weight: 700; line-height: 1; cursor: pointer; transition: all .25s ease; }
.mpl-category-btn span { margin-left: 6px; font-size: 13px; opacity: .75; }
.mpl-category-btn:hover, .mpl-category-btn:focus-visible { background: var(--mpl-primary-hover); color: var(--mpl-on-primary); box-shadow: 0 8px 18px color-mix(in srgb,var(--mpl-primary) 22%,transparent); }
.mpl-category-btn.is-active { background: var(--mpl-primary); color: var(--mpl-on-primary); box-shadow: 0 8px 18px color-mix(in srgb,var(--mpl-primary) 22%,transparent); }
.mpl-locator-grid { display: grid; grid-template-columns: minmax(0,1fr) 500px; align-items: start; border-bottom: 1px solid var(--mpl-border); }
.mpl-map-area { position: relative; align-self: start; width: 100%; background: var(--mpl-map-bg); overflow: hidden; }
.mpl-map-inner { position: relative; width: 100%; overflow: hidden; }
.mpl-map-image { display: block; width: 100%; height: auto; object-fit: contain; }
.mpl-map-pin { position: absolute; left: var(--x); top: var(--y); z-index: 3; transform: translate(-50%,-50%); width: 26px; height: 26px; border: 3px solid var(--mpl-on-primary); border-radius: 50%; background: var(--mpl-accent); box-shadow: 0 0 0 10px color-mix(in srgb,var(--mpl-accent) 10%,transparent),0 8px 20px color-mix(in srgb,var(--mpl-primary-hover) 22%,transparent); cursor: pointer; transition: transform .25s,background-color .25s,box-shadow .25s; }
.mpl-map-pin:hover, .mpl-map-pin:focus-visible, .mpl-map-pin.is-hovered { background: var(--mpl-primary-hover); transform: translate(-50%,-50%) scale(1.15); box-shadow: 0 0 0 16px color-mix(in srgb,var(--mpl-primary) 15%,transparent),0 10px 24px color-mix(in srgb,var(--mpl-primary-hover) 28%,transparent); }
.mpl-map-pin.is-hidden, .mpl-location-card.is-hidden { display: none; }
.mpl-location-panel { background: var(--mpl-surface); border-left: 1px solid var(--mpl-border); padding: 0 24px 24px; overflow-y: auto; max-height: 760px; }
.mpl-location-panel-header { position: sticky; top: 0; z-index: 5; margin: 0 -24px 18px; padding: 24px; background: var(--mpl-surface); border-bottom: 1px solid var(--mpl-border); box-shadow: 0 6px 12px -12px rgba(15,23,42,.35); }
.mpl-location-search-wrap { position: relative; margin-bottom: 16px; }
.mpl-search-icon { position: absolute; left: 18px; top: 50%; transform: translateY(-50%); color: var(--mpl-text-muted); font-size: 22px; line-height: 1; }
.mpl-location-search { box-sizing: border-box; width: 100%; height: 58px; padding: 0 18px 0 50px; border: 1px solid var(--mpl-border); border-radius: 5px; background: var(--mpl-surface); color: var(--mpl-text); font-size: 16px; outline: none; transition: border-color .25s,box-shadow .25s; }
.mpl-location-search:focus { border-color: var(--mpl-primary); box-shadow: 0 0 0 3px color-mix(in srgb,var(--mpl-primary) 8%,transparent); }
.mpl-location-count { margin: 0; font-size: 15px; }
.mpl-location-list { display: flex; flex-direction: column; gap: 12px; }
.mpl-location-card { display: flex; align-items: center; gap: 16px; padding: 18px 20px; border: 1px solid var(--mpl-border); border-radius: 5px; background: var(--mpl-surface); cursor: pointer; transition: border-color .25s,box-shadow .25s,transform .25s; }
.mpl-location-card:hover, .mpl-location-card:focus-visible, .mpl-location-card.is-hovered { border-color: var(--mpl-primary); box-shadow: 0 10px 24px color-mix(in srgb,var(--mpl-primary-hover) 10%,transparent); transform: translateY(-1px); outline: 0; }
.mpl-location-logo { display: flex; align-items: center; justify-content: center; width: 58px; height: 58px; flex: 0 0 58px; border: 1px solid var(--mpl-border); border-radius: 5px; background: var(--mpl-surface); overflow: hidden; }
.mpl-location-logo img, .mpl-modal-logo img { box-sizing: border-box; width: 100%; height: 100%; object-fit: contain; padding: 7px; }
.mpl-location-logo span { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; background: var(--mpl-primary); color: var(--mpl-on-primary); font-weight: 800; font-size: 18px; }
.mpl-location-card h3 { margin: 0 0 6px; color: var(--mpl-primary); font-size: 17px; line-height: 1.25; font-weight: 800; }
.mpl-location-card p { margin: 0; color: var(--mpl-text-muted); font-size: 14px; line-height: 1.4; }
.mpl-icon { display: inline-block; width: 24px; height: 24px; flex: 0 0 24px; background-color: currentColor; -webkit-mask: var(--mpl-icon) center/contain no-repeat; mask: var(--mpl-icon) center/contain no-repeat; vertical-align: middle; }
.mpl-icon-flag { --mpl-icon: url("../../assets/icons/flag.svg"); }
.mpl-icon-mail { --mpl-icon: url("../../assets/icons/mail.svg"); }
.mpl-icon-map-pin { --mpl-icon: url("../../assets/icons/map-pin.svg"); }
.mpl-icon-phone { --mpl-icon: url("../../assets/icons/phone.svg"); }
.mpl-icon-user { --mpl-icon: url("../../assets/icons/user.svg"); }
.mpl-icon-world-www { --mpl-icon: url("../../assets/icons/world-www.svg"); }
.mpl-location-card-content .mpl-icon { width: 18px; height: 18px; color: var(--mpl-accent); margin-right: 5px; }
body.mapili-modal-open { overflow: hidden; }
.mpl-location-modal { position: fixed!important; inset: 0!important; z-index: 9999999!important; display: none; align-items: center; justify-content: center; box-sizing: border-box; padding: 24px; width: 100vw; height: 100vh; }
.mpl-location-modal.is-open { display: flex!important; }
.mpl-modal-backdrop { position: fixed!important; inset: 0!important; z-index: 9999998!important; background: color-mix(in srgb,var(--mpl-overlay) 68%,transparent); backdrop-filter: blur(4px); }
.mpl-modal-box { position: relative!important; z-index: 9999999!important; width: min(680px,calc(100vw - 48px)); max-height: calc(100vh - 48px); overflow-y: auto; background: var(--mpl-surface); border: 1px solid var(--mpl-primary); border-radius: 5px; box-shadow: 0 24px 70px color-mix(in srgb,var(--mpl-overlay) 32%,transparent); }
.mpl-modal-close { position: absolute; top: 24px; right: 26px; z-index: 13; border: 0; background: transparent; color: var(--mpl-on-primary); font-size: 34px; line-height: 1; cursor: pointer; }
.mpl-modal-head { padding: 34px 34px 32px; background: var(--mpl-primary); color: var(--mpl-on-primary); }
.mpl-modal-logo { display: flex; align-items: center; justify-content: center; width: 80px; height: 80px; margin-bottom: 18px; border-radius: 5px; background: var(--mpl-surface); overflow: hidden; }
.mpl-modal-logo span { color: var(--mpl-primary); font-size: 22px; font-weight: 800; }
.mpl-modal-head h2 { margin: 0 0 10px; color: var(--mpl-on-primary)!important; font-size: 30px; line-height: 1.2; font-weight: 800; }
.mpl-modal-head p { display: flex; align-items: center; gap: 8px; margin: 0; color: color-mix(in srgb,var(--mpl-on-primary) 88%,transparent); font-size: 18px; }
.mpl-modal-body { padding: 32px 34px; }
.mpl-modal-info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.mpl-modal-info, .mpl-modal-person, .mpl-modal-website { display: flex; align-items: center; gap: 14px; padding: 18px; border: 1px solid var(--mpl-border); border-radius: 5px; background: var(--mpl-info-box-bg); }
.mpl-modal-info > .mpl-icon, .mpl-modal-person > .mpl-icon, .mpl-modal-website > .mpl-icon { color: var(--mpl-accent); }
.mpl-modal-info strong, .mpl-modal-person strong, .mpl-modal-website strong { display: block; margin-bottom: 4px; color: var(--mpl-text-muted); font-size: 12px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.mpl-modal-info a, .mpl-modal-website a { color: var(--mpl-primary); font-weight: 700; text-decoration: none; overflow-wrap: anywhere; }
.mpl-modal-person { margin-top: 22px; border-left: 4px solid var(--mpl-accent); }
.mpl-modal-person p { margin: 0; color: var(--mpl-primary); font-size: 20px; font-weight: 800; }
.mpl-modal-extra { margin-top:22px; }
.mpl-modal-extra-value { display:block; color:var(--mpl-primary); font-size:20px; font-weight:800; }
.mpl-modal-bubbles, .mpl-modal-website { margin-top: 24px; }
.mpl-modal-bubbles h3 { margin: 0 0 14px; color: var(--mpl-primary); font-size: 22px; font-weight: 800; }
.mpl-modal-bubbles > div { display: flex; flex-wrap: wrap; gap: 10px; }
.mpl-modal-bubbles span { display: inline-flex; padding: 9px 16px; border-radius: 999px; background: var(--mpl-primary); color: var(--mpl-on-primary); font-size: 14px; font-weight: 700; }
.mpl-modal-footer { display: flex; justify-content: flex-end; padding: 22px 34px; border-top: 1px solid var(--mpl-border); background: var(--mpl-info-box-bg); }
.mpl-modal-close-btn { border: 0; border-radius: 5px; background: var(--mpl-primary); color: var(--mpl-on-primary); padding: 14px 28px; font-size: 15px; font-weight: 800; cursor: pointer; box-shadow: 0 8px 18px color-mix(in srgb,var(--mpl-primary) 22%,transparent); }
.mpl-modal-close-btn:hover, .mpl-modal-close-btn:focus-visible { background: var(--mpl-primary-hover); }
@media (max-width:1100px) { .mpl-locator-grid { grid-template-columns: 1fr; } .mpl-location-panel { border-left: 0; border-top: 1px solid var(--mpl-border); max-height: 75vh; } }
@media (max-width:767px) { .mpl-category-filter { padding: 14px 0; gap: 8px; } .mpl-category-btn { padding: 10px 14px; font-size: 14px; } .mpl-location-panel { padding: 0 20px 20px; } .mpl-location-panel-header { margin: 0 -20px 18px; padding: 20px; } .mpl-location-search { height: 52px; font-size: 15px; } .mpl-location-card { padding: 16px; } .mpl-modal-info-grid { grid-template-columns: 1fr; } .mpl-modal-head { padding: 30px 24px 28px; } .mpl-modal-body { padding: 26px 24px; } .mpl-modal-footer { padding: 20px 24px; } .mpl-modal-head h2 { font-size: 25px; } }
