/* PixelPick live Lands logo pins, scoped to this add-on. */
/* v13: compact round pins (26-50px), color-matched to each Lands claim.
   Logos are inset, leaving a visible land-colored circle/ring. No tails or badges.
   Missing logos use initials on the live Lands territory color. */
.pp-logo-marker {background:transparent!important;border:0!important;box-shadow:none!important;overflow:visible!important}
.pp-logo-marker .pp-round-pin {
  position:relative!important;box-sizing:border-box!important;display:flex!important;
  justify-content:center!important;align-items:center!important;
  width:var(--pp-pin-size,40px)!important;height:var(--pp-pin-size,40px)!important;
  border-radius:50%!important;overflow:hidden!important;
  border:1px solid var(--pp-land-color,#276779)!important;background:var(--pp-land-color,#276779)!important;
  /* The circle itself is land-colored; a thin high-contrast halo aids visibility. */
  box-shadow:0 0 0 1px #eaf8fb,0 2px 8px rgba(0,0,0,.42)!important;
  transform:none!important;pointer-events:none!important;
}
.pp-logo-marker .pp-round-pin::before,
.pp-logo-marker .pp-round-pin::after {display:none!important;content:none!important}
.pp-logo-marker .pp-round-pin .pp-logo-pin-letters {
  display:flex!important;justify-content:center!important;align-items:center!important;
  width:100%!important;height:100%!important;
  color:#fff!important;font:800 clamp(10px,calc(var(--pp-pin-size)*.31),17px)/1 Arial,sans-serif!important;
  text-shadow:0 1px 2px #111!important;letter-spacing:-.02em!important;
}
.pp-logo-marker .pp-round-pin .pp-logo-pin-image {
  position:absolute!important;inset:1px!important;display:block!important;
  width:calc(100% - 2px)!important;height:calc(100% - 2px)!important;
  border-radius:50%!important;object-fit:cover!important;object-position:center!important;
  border:0!important;background:transparent!important;
}
.pp-logo-marker:hover .pp-round-pin,.pp-logo-marker:focus-within .pp-round-pin {
  border-color:var(--pp-land-color,#276779)!important;
  box-shadow:0 0 0 1px #e8ffff,0 3px 12px rgba(0,0,0,.55)!important;
}
.pp-logo-info-popup .leaflet-popup-content-wrapper {padding:0!important;border-radius:15px!important;
  background:white!important;box-shadow:0 15px 40px #06162480!important;overflow:hidden!important;}
.pp-logo-info-popup .leaflet-popup-content {margin:0!important;padding:0!important;
  width:min(310px,calc(100vw - 42px))!important;max-width:min(310px,calc(100vw - 42px))!important;
  max-height:min(320px,65vh)!important;overflow-y:auto!important;overflow-x:hidden!important;
  white-space:normal!important;box-sizing:border-box!important;}
.pp-logo-info-popup .leaflet-popup-tip{background:#fff!important;}
.pp-logo-info-popup .leaflet-popup-close-button {top:7px!important;right:8px!important;
  z-index:5!important;color:#637789!important;font-size:19px!important;}
.pp-pin-card,.pp-pin-card * {box-sizing:border-box!important;overflow-wrap:anywhere;}
.pp-pin-card {font:13px/1.46 Arial,Helvetica,sans-serif;color:#1b3542;background:white;width:100%;}
.pp-pin-card-header {display:flex;align-items:center;gap:11px;padding:15px 32px 13px 15px;background:#f3fbfd;border-bottom:1px solid #d5e8ec;}
.pp-pin-card-logo {height:46px;width:46px;flex:0 0 46px;display:flex;align-items:center;
  justify-content:center;position:relative;background:var(--pp-land-color,#276779);border-radius:50%;overflow:hidden;border:2px solid var(--pp-land-color,#276779);
  box-shadow:0 0 0 1px #b9dae0;}
.pp-pin-title-group{min-width:0;}
.pp-pin-kicker {color:#2b8091;font:bold 9px/1.4 Arial,sans-serif;letter-spacing:1.25px;}
.pp-pin-title {font:800 19px/1.2 Arial,Helvetica,sans-serif!important;color:#122c37!important;margin:4px 0 1px!important;padding:0!important;}
.pp-pin-subtitle {font:12px/1.4 Arial,sans-serif;color:#637b86;}
.pp-pin-statrow {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;border-bottom:1px solid #ebf0f3;padding:12px 16px;}
.pp-pin-stat {display:flex;flex-direction:column;min-width:0;}
.pp-pin-statlabel{font:bold 10px/1.2 Arial,sans-serif;color:#6c8793;letter-spacing:.45px;}
.pp-pin-statvalue{font:bold 19px/1.25 Arial,sans-serif;color:#0b2d3c;margin-top:4px;}
.pp-pin-description {margin:0!important;padding:12px 16px!important;color:#39535d!important;font:13px/1.5 Arial,sans-serif!important;}
.pp-pin-details {margin:0 16px 12px;border:1px solid #d7e7ec;border-radius:9px;padding:7px 10px;background:#f5f9fb;color:#355a67;}
.pp-pin-details>summary{font-weight:bold;cursor:pointer;}
.pp-pin-detailrow{font-size:12px;line-height:1.6;margin-top:6px;}
.pp-pin-actions{display:flex;flex-wrap:wrap;gap:8px;padding:0 16px 15px;}
.pp-pin-actions>a {display:inline-flex;align-items:center;justify-content:center;min-height:35px;
  border-radius:8px;padding:8px 11px;text-decoration:none!important;
  font:bold 12px/1.2 Arial,sans-serif!important;}
.pp-pin-discord{color:white!important;background:#5965e9!important;}
.pp-pin-directory{color:#166b80!important;background:#e7f5f8!important;}
.pp-pin-actions>a:hover{filter:brightness(.95);}
@media(max-width:520px){.pp-pin-card-header{padding:12px 28px 10px 12px;}
 .pp-pin-title{font-size:17px!important;}
 .pp-logo-info-popup .leaflet-popup-content{max-height:55vh!important;}}


/* Expose the Lands claim color around each avatar in the information popup. */
.pp-pin-card-logo .pp-logo-pin-image{inset:3px!important;width:calc(100% - 6px)!important;height:calc(100% - 6px)!important;object-fit:cover!important;}

/* v14: official Discord server logos occupy the circular pin; no thick border. */

/* v15: 50%-diameter pins. Ultra-fine ring keeps the small logos legible. */
.pp-logo-marker .pp-round-pin {
  border-width:.65px!important;
  box-shadow:0 0 0 .5px #eaf8fb,0 1px 5px rgba(0,0,0,.38)!important;
}
.pp-logo-marker .pp-round-pin .pp-logo-pin-image {
  inset:.65px!important;
  width:calc(100% - 1.3px)!important;
  height:calc(100% - 1.3px)!important;
}
.pp-logo-marker .pp-round-pin .pp-logo-pin-letters {
  font-size:clamp(7px,calc(var(--pp-pin-size)*.34),10px)!important;
  letter-spacing:-.04em!important;
}
.pp-logo-marker:hover .pp-round-pin,
.pp-logo-marker:focus-within .pp-round-pin {
  box-shadow:0 0 0 .5px #e8ffff,0 2px 7px rgba(0,0,0,.5)!important;
}

/* v17: during a wheel / touch zoom animation, the interior circle scales
   smoothly while Leaflet controls the geographic marker's position. */
.pp-logo-marker .pp-round-pin {
  transform:scale(var(--pp-live-zoom-scale,1))!important;
  transform-origin:center center!important;
  transition:transform 200ms cubic-bezier(.2,.65,.25,1)!important;
}
@media(prefers-reduced-motion:reduce){
  .pp-logo-marker .pp-round-pin{transition:none!important}
}

/* v18: the thumbnail inside the popup must be a single correctly clipped image.
   Its fallback lettering is hidden whenever a Discord logo is present. */
.pp-pin-card-logo{position:relative!important;isolation:isolate!important;overflow:hidden!important;}
.pp-pin-card-logo>.pp-logo-pin-letters{
  display:flex!important;align-items:center!important;justify-content:center!important;
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  margin:0!important;padding:0!important;line-height:1!important;
  font:800 16px/1 Arial,sans-serif!important;color:#fff!important;
}
.pp-pin-card-logo>.pp-logo-pin-image{
  display:block!important;position:absolute!important;inset:1px!important;
  width:calc(100% - 2px)!important;height:calc(100% - 2px)!important;
  max-width:none!important;max-height:none!important;margin:0!important;padding:0!important;
  object-fit:contain!important;object-position:center center!important;
  border:0!important;border-radius:50%!important;background:transparent!important;
}
.pp-pin-card-logo:has(>.pp-logo-pin-image)>.pp-logo-pin-letters,
.pp-round-pin:has(>.pp-logo-pin-image)>.pp-logo-pin-letters,
.pp-pin-card-logo>.pp-logo-pin-letters.pp-has-image,
.pp-round-pin>.pp-logo-pin-letters.pp-has-image{display:none!important}

/* v20: original inner fade; overridden by the more reliable v21 outer marker fade.
   Land-click popups are independent from these marker visuals. */
.pp-logo-marker .pp-round-pin {
  opacity:var(--pp-pin-opacity,1)!important;
  transition:transform 200ms cubic-bezier(.2,.65,.25,1),opacity 220ms ease-out!important;
}
@media(prefers-reduced-motion:reduce) {
  .pp-logo-marker .pp-round-pin {transition:none!important}
}


/* v21: fade the entire geographic icon as zoom increases. CSS specificity
   wins over inner child styles and ensures no leftover logo/ring remains. */
.pp-logo-marker {
  opacity:var(--pp-marker-opacity,1)!important;
  transition:opacity 140ms linear!important;
}
.pp-logo-marker .pp-round-pin {opacity:1!important;}
@media(prefers-reduced-motion:reduce){.pp-logo-marker{transition:none!important}}

/* v26: stable center anchor. Zoom changes only this child's scale, not the
   Leaflet icon's 0x0 geographic anchor. No jump when zoomend fires. */
.pp-logo-marker {
 overflow:visible!important;
}
.pp-logo-marker .pp-round-pin {
 position:absolute!important;left:0!important;top:0!important;
 transform:translate(-50%,-50%) scale(var(--pp-live-zoom-scale,1))!important;
 transform-origin:center center!important;
 pointer-events:auto!important;
 will-change:transform,opacity!important;
}
@media(prefers-reduced-motion:reduce){
 .pp-logo-marker .pp-round-pin{transition:none!important}
}

/* v27: stay synchronized with the stock Leaflet zoom animation (250ms).
   Native openPopup auto-pan is disabled in JS so hovering a pin cannot pan
   the camera and create an apparent geographic jump while zooming. */
.pp-logo-marker .pp-round-pin {
 transition:transform 250ms linear!important;
}
@media(prefers-reduced-motion:reduce){
 .pp-logo-marker .pp-round-pin{transition:none!important;}
}


/* v34: compact community social icons + direct civilization detail link. */
.pp-pin-actions{display:flex!important;align-items:center!important;gap:8px!important;flex-wrap:nowrap!important;}
.pp-pin-actions .pp-pin-social-icon {display:inline-flex!important;align-items:center!important;justify-content:center!important;
 flex:0 0 38px!important;width:38px!important;min-width:38px!important;height:38px!important;
 padding:8px!important;border-radius:9px!important;color:#fff!important;
 font-size:0!important;line-height:0!important;text-decoration:none!important;}
.pp-pin-actions .pp-pin-social-icon svg{display:block;width:21px;height:21px;color:inherit;}
.pp-pin-actions .pp-pin-social-discord{background:#5865f2!important;border:1px solid #7480ff!important;}
.pp-pin-actions .pp-pin-social-youtube{background:#e42c30!important;border:1px solid #fc6b70!important;}
.pp-pin-actions .pp-pin-directory {margin-left:auto;min-height:38px;padding:9px 12px;
 white-space:nowrap;font-weight:800!important;font-size:12px!important;}

/* v35: logo-related dark theme for the entire map popup, not just its icon. */
.pp-logo-info-popup .leaflet-popup-content-wrapper{
 background:var(--pp-popup-bg,#111b23)!important;
 border:1px solid var(--pp-popup-border,#476174)!important;
 box-shadow:0 14px 46px rgba(0,0,0,.66)!important;
 border-radius:16px!important;
}
.pp-logo-info-popup .leaflet-popup-tip{background:var(--pp-popup-bg,#111b23)!important;}
.pp-logo-info-popup .leaflet-popup-close-button{color:#edf5fc!important;}
.pp-logo-info-popup .leaflet-popup-content{max-height:min(430px,72vh)!important;}
.pp-logo-info-popup .pp-pin-card{
 background:var(--pp-popup-bg,#111b23)!important;
 color:#edf5fc!important;
}
.pp-logo-info-popup .pp-pin-card-header{
 background:var(--pp-popup-head,#152d3b)!important;
 border-bottom:1px solid var(--pp-popup-border,#476174)!important;
}
.pp-logo-info-popup .pp-pin-title{color:#f9fcff!important;}
.pp-logo-info-popup .pp-pin-subtitle{color:#cbd9e2!important;}
.pp-logo-info-popup .pp-pin-statrow{
 background:var(--pp-popup-panel,#132632)!important;
 border-bottom:1px solid var(--pp-popup-border,#476174)!important;
}
.pp-logo-info-popup .pp-pin-statlabel{color:#cad9e4!important;}
.pp-logo-info-popup .pp-pin-statvalue{color:#fff!important;}
.pp-logo-info-popup .pp-pin-description{color:#e2ecf2!important;}
.pp-logo-info-popup .pp-pin-directory{
 color:#fff!important;background:var(--pp-popup-head,#173a4b)!important;
 border:1px solid var(--pp-popup-border,#547b8f)!important;
}
.pp-logo-info-popup .pp-pin-directory:hover{filter:brightness(1.22)!important;}