/* Wapu Pins — Front — Drop-aware */
.wapu-pins-wrap { position: relative; display: inline-block; width: 100%; font-family: var(--wp-font-body, inherit); }

.wapu-pins-image-wrap { position: relative; overflow: hidden; width: 100%; }
.wapu-pins-ratio-11  .wapu-pins-image-wrap { aspect-ratio: 1; }
.wapu-pins-ratio-169 .wapu-pins-image-wrap { aspect-ratio: 16/9; }
.wapu-pins-rounded   .wapu-pins-image-wrap { border-radius: 16px; }
.wapu-pins-image { width: 100%; height: 100%; object-fit: cover; display: block; }

.wapu-pins-wrap { --pin-size: 32px; --pin-font: 24px; }
.wapu-pins-dots-sm { --pin-size: 24px; --pin-font: 16px; }
.wapu-pins-dots-md { --pin-size: 32px; --pin-font: 24px; }
.wapu-pins-dots-lg { --pin-size: 48px; --pin-font: 32px; }

.wapu-pins-dot {
    position: absolute;
    transform: translate(-50%, -50%);
    background: transparent; border: none;
    cursor: pointer; padding: 0; z-index: 10;
    width: var(--pin-size); height: var(--pin-size);
    display: flex; align-items: center; justify-content: center;
}
.wapu-pins-dot-emoji {
    font-size: var(--pin-font); display: block;
    filter: drop-shadow(0 2px 8px rgba(0,0,0,.35));
    animation: hsFloat 2.5s ease-in-out infinite;
    transition: transform .2s; line-height: 1;
}
.wapu-pins-dot:hover .wapu-pins-dot-emoji { transform: scale(1.3); animation: none; }
.wapu-pins-dot-pulse {
    position: absolute; inset: 0; border-radius: 50%;
    background: rgba(255,255,255,.25);
    animation: hsPulse 2s ease-out infinite;
    pointer-events: none;
}
@keyframes hsFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-4px)} }
@keyframes hsPulse { 0%{transform:scale(.6);opacity:.7} 100%{transform:scale(1.9);opacity:0} }

.wapu-pins-popup {
    display: none; position: fixed; inset: 0;
    z-index: 99999; align-items: center; justify-content: center;
}
.wapu-pins-popup.is-open { display: flex; }
.wapu-pins-popup-overlay {
    position: absolute; inset: 0;
    background: rgba(0,0,0,.45); backdrop-filter: blur(8px);
}

.wapu-pins-popup-box {
    position: relative; z-index: 1;
    background: var(--wp-surface, var(--wa-surface));
    border-radius: var(--wp-radius, 16px);
    width: 224px; max-width: 80vw;
    overflow: hidden;
    border-top: .5px solid var(--wp-primary, #1d1d1f);
    display: flex; flex-direction: column;
}
.wapu-pins-popup-close {
    position: absolute; top: 8px; right: 8px;
    background: rgba(0,0,0,.08); border: none; border-radius: 50%;
    width: 24px; height: 24px; cursor: pointer;
    font-size: 11px; color: var(--wp-text-muted, #374151); z-index: 2;
    display: flex; align-items: center; justify-content: center;
}
.wapu-pins-popup-close:hover { background: rgba(0,0,0,.16); }

.wapu-pins-popup-img {
    width: 100%; height: 120px;
    object-fit: cover; display: block;
}

.wapu-pins-popup-info { padding: 16px; }
.wapu-pins-popup-type {
    font-size: 9px; font-weight: 700; letter-spacing: .12em;
    text-transform: uppercase; color: var(--wp-text-muted, var(--wa-text-subtle)); margin-bottom: 8px;
}
.wapu-pins-popup-name {
    font-size: 11px; font-weight: 700; color: var(--wp-text, #1d1d1f);
    margin-bottom: 8px; line-height: 1.3;
    display: -webkit-box; -webkit-line-clamp: 2;
    -webkit-box-orient: vertical; overflow: hidden;
}
.wapu-pins-popup-price {
    font-size: 13px; font-weight: 800;
    color: var(--wp-primary, #1d1d1f);
    margin-bottom: 8px;
}
.wapu-pins-popup-btn {
    display: block; width: 100%; padding: 8px;
    background: var(--wp-primary, #1d1d1f);
    color: var(--wp-text-inverse, var(--wa-surface));
    border: none; border-radius: var(--wp-radius-pill, 100px);
    font-size: 11px; font-weight: 700;
    text-align: center; text-decoration: none;
    cursor: pointer; transition: opacity .15s;
    box-sizing: border-box;
}
.wapu-pins-popup-btn:hover { opacity: .85; color: var(--wp-text-inverse, var(--wa-surface)); }
.wapu-pins-popup-loader { padding: 32px; text-align: center; color: var(--wp-text-muted, var(--wa-text-subtle)); font-size: 12px; }