
.imp-front{max-width:var(--impMax);width:100%;margin:0 auto;position:relative;--impPin:var(--impPinD,40px);--impScale:1}
.imp-topbar{display:none;margin-bottom:10px}
.imp-topbar-inner{display:flex;gap:10px;overflow:auto;padding:6px 2px}
.imp-chip{display:inline-flex;align-items:center;gap:10px;border:1px solid rgba(17,24,39,.12);
  background:rgba(255,255,255,.9); color:#111827;padding:8px 12px;border-radius:999px;cursor:pointer;white-space:nowrap}
.imp-chip img{width:28px;height:28px;border-radius:999px;border:2px solid #fff;object-fit:cover}
.imp-viewport{width:100%;position:relative;border-radius:16px;overflow:hidden;background:transparent !important;touch-action:none}
.imp-canvas{position:relative;width:100%;transform:translate3d(0,0,0) scale(1);transform-origin:0 0;will-change:transform;background:transparent !important}
.imp-mapimg{width:100%;height:auto;display:block;user-select:none;-webkit-user-drag:none;pointer-events:none}
.imp-pins{position:absolute;inset:0;pointer-events:auto}
.imp-pin{position:absolute;left:calc(var(--x)*1%);top:calc(var(--y)*1%);transform:translate(-50%,-50%);
  width:var(--impPin) !important;height:var(--impPin) !important;border-radius:999px;border:3px solid #fff;background:#fff;box-shadow:0 10px 25px rgba(0,0,0,.25);
  cursor:pointer;padding:0;display:grid;place-items:center;overflow:hidden}
.imp-pin img{width:100%;height:100%;object-fit:cover;border-radius:999px}

.imp-card{position:absolute;right:18px;top:18px;width:380px;max-width:calc(100% - 24px);
  background:#fff;border-radius:16px;box-shadow:0 25px 60px rgba(0,0,0,.25);padding:16px 16px 14px;display:none;z-index:5}
.imp-card.open{display:block}
.imp-card-close{position:absolute;right:10px;top:10px;width:30px;height:30px;border:0;background:transparent;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:.9;transition:background .15s ease}
.imp-card-close:hover{background:#C41830}
.imp-card-head{display:flex;align-items:center;gap:12px;padding-bottom:12px;border-bottom:1px solid rgba(0,0,0,.08);margin-bottom:12px}
.imp-card-flag{width:48px;height:48px;border-radius:999px;overflow:hidden;border:3px solid #fff;background:#f3f4f6;box-shadow:0 12px 25px rgba(0,0,0,.12)}
.imp-card-flag img{width:100%;height:100%;object-fit:cover}
.imp-card-country{font-weight:800;color:#b11226;font-size:18px}
.imp-card-label{font-weight:800;color:#111827;margin-top:10px;font-size:13px}
.imp-card-value{color:#4b5563;font-size:13px;line-height:1.45;margin-top:4px}
.imp-card-value a.imp-link{color:inherit;text-decoration:none}
.imp-card-value a.imp-link:hover{color:inherit;text-decoration:none;opacity:.9}
.imp-card-social{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.imp-socialbtn{width:40px;height:40px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;background:#b11226;color:#fff;text-decoration:none;font-weight:800}
.imp-socialbtn img,.imp-socialbtn svg{width:36px;height:36px;display:block}

.imp-overlay{position:fixed;inset:0;background:rgba(0,0,0,.35);display:none;z-index:4}
.imp-overlay.open{display:block}

/* Tablet/Mobile UX (≤1024) */

@media (max-width:1024px){
  /* Topbar (solo tablet/móvil) */
  .imp-topbar{display:block;margin-bottom:10px}
  .imp-topbar-inner{display:flex;gap:10px;overflow-x:auto;-webkit-overflow-scrolling:touch;padding:6px 2px}

  /* Mapa ancho completo */
  .imp-front{width:100%;max-width:100%;margin:0 auto}
  .imp-viewport{width:100%}

  /* Popup fuera del mapa (bottom sheet) */
  .imp-card{
    position:fixed;
    left:50%;
    right:auto;
    top:auto;
    bottom:14px;
    transform:translateX(-50%);
    width:calc(100% - 28px);
    max-width:520px;
    max-height:60vh;
    overflow:auto;
    z-index:9999;
  }
  .imp-overlay{position:fixed;inset:0;z-index:9998}
  body.admin-bar .imp-card{bottom: calc(14px + 46px);}
}

/* Topbar mobile */

@media (max-width:1024px){.imp-card{position:fixed;left:50%;right:auto;top:auto;bottom:14px;transform:translateX(-50%);width:min(420px, calc(100% - 28px));max-width:calc(100% - 28px);max-height:60vh;overflow:auto;z-index:9999}}

@media (min-width:1025px){.imp-front{--impPin:var(--impPinD,40px)}}
@media (min-width:768px) and (max-width:1024px){.imp-front{--impPin:var(--impPinT,34px)}}
@media (max-width:767px){.imp-front{--impPin:var(--impPinM,30px)}}
@media (max-width:767px){.imp-pin{border:2px solid #fff;}}

/* Social icons sizing (stable across breakpoints) */
.imp-socials{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.imp-socials a{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:999px}
.imp-socials img,.imp-socials svg{width:18px;height:18px;display:block}
@media (max-width:1024px){
  .imp-socials a{width:42px;height:42px}
  .imp-socials img,.imp-socials svg{width:20px;height:20px}
}


/* Social buttons: fixed size (not tied to marker pin size) */
.imp-socialbtn{
  width:40px !important;
  height:40px !important;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.imp-socialbtn img,.imp-socialbtn svg{width:36px;height:36px;display:block}
@media (max-width:1024px){
  .imp-socialbtn{width:36px !important;height:36px !important;}
  .imp-socialbtn img,.imp-socialbtn svg{width:36px;height:36px;display:block}
}


/* Close button styling */
.imp-close{
  width:34px;height:34px;
  border-radius:10px;
  background:#c41830;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  transition: background .15s ease, transform .15s ease;
}
.imp-close:hover{background:#C41830;transform:translateY(-1px)}
.imp-close svg{width:16px;height:16px}


/* Social buttons: keep original style, fixed size */
.imp-socialbtn{background:#b11226 !important;color:#fff !important;width:40px !important;height:40px !important;border-radius:999px !important}
.imp-socialbtn:hover{background:#c41830 !important}
@media (max-width:1024px){.imp-socialbtn{width:36px !important;height:36px !important}}

.imp-socialbtn{padding:0 !important;}


/* Close button: smaller, consistent */
.imp-close{width:30px !important;height:30px !important;border-radius:8px !important;background:transparent !important;border:1px solid rgba(0,0,0,.08) !important}
.imp-close:hover{background:#C41830 !important;border-color:#C41830 !important}
.imp-close svg{width:14px !important;height:14px !important}


/* Topbar chips: icon-only on tablet/móvil */
@media (max-width:1024px){
  .imp-chip{min-width:44px;height:44px;padding:0 10px;border-radius:999px;display:flex;align-items:center;justify-content:center}
  .imp-chip span{display:none!important}
  .imp-chip img{width:22px;height:22px;border-radius:999px;display:block}
}

/* Social buttons: transparent */
.imp-socialbtn{background:transparent !important}

/* Topbar chips: transparent + fixed icon size */
@media (max-width:1024px){.imp-chip{background:transparent !important;box-shadow:none !important;border:0 !important;padding:0 !important;min-width:auto !important;height:auto !important}
.imp-chip img{width:36px !important;height:36px !important}
}


