/* ==========================================================================
   WCM Partner Hub – map-GoogleMaps.css
   Specyficzne overridy dla Google Maps (kontekst hub i podstrona partnera).

   PHILOSOPHY:
   Tokens (:root --wcm-ph-*) i klasy popup (.wcm-ph-popup-*) są wspólne
   z Leaflet — ich definicje znajdują się w map-OpenStreetMap-Leaflet.css.
   Ten plik dodaje TYLKO overridy dla wewnętrznych elementów Google'a
   (gm-style-iw-c wrapper, ukrywanie zbędnych kontrolek).

   Stylowanie kafelków mapy (kolory lądu/wody/dróg) odbywa się natywnie
   przez Google Maps API (parametr `styles: window.WCM_GMAPS_STYLE`
   z assets/js/map-GoogleMaps.js).

   Wymagana kolejność enqueue (gdy aktywny provider 'google'):
     1. map-OpenStreetMap-Leaflet.css (tokens + popup classes)
     2. map-GoogleMaps.css (Google overrides)
     3. frontend.css / partner-single.css
   ========================================================================== */

/* ==========================================================================
   GOOGLE MAPS POPUP / INFO WINDOW WRAPPER
   Czyszczenie domyślnego stylu Google — cały vizual obsługuje wewnętrzny
   .wcm-ph-popup (z map-OpenStreetMap-Leaflet.css), żeby uniknąć "kontener
   w kontenerze".
   ========================================================================== */

.wcm-ph-map .gm-style .gm-style-iw-chr,
.wcm-pp-map .gm-style .gm-style-iw-chr {
    display: none !important;
}

.wcm-ph-map .gm-style .gm-style-iw-c,
.wcm-pp-map .gm-style .gm-style-iw-c {
    background: rgba(16, 10, 28, 0.75) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 20px !important;
    box-shadow:
        0 12px 40px rgba(0,0,0,.7),
        0 0 50px rgba(114,54,186,.25),
        inset 0 1px 2px rgba(255,255,255,.05) !important;
    backdrop-filter: blur(20px) saturate(150%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(150%) !important;
    padding: 0 !important;
    overflow: hidden !important;
    color: var(--wcm-ph-text-main) !important;
    font-family: var(--wcm-ph-font) !important;
    max-width: 320px !important;
}

/* Linia gradient u góry popupu — obsługiwana wewnątrz contentu jako
   .wcm-ph-popup-strip (tier-aware: gold/auth/premium) — patrz
   map-OpenStreetMap-Leaflet.css. Brak ::before na wrapperze — nie chcemy
   stałej linii gradient'u nad każdym popupem niezależnie od tier'a. */

/* Inner container — bez paddingu (puis content sam dba o margin) */
.wcm-ph-map .gm-style .gm-style-iw-d,
.wcm-pp-map .gm-style .gm-style-iw-d {
    overflow: visible !important;
    padding: 8px !important;
    background: transparent !important;
    color: var(--wcm-ph-text-main) !important;
    font-family: var(--wcm-ph-font) !important;
    max-height: none !important;
}

/* Strzałka popupu — dopasowana do nowego szklistego tła */
.wcm-ph-map .gm-style .gm-style-iw-t::after,
.wcm-pp-map .gm-style .gm-style-iw-t::after {
    background: rgba(16, 10, 28, 0.95) !important;
    box-shadow: -3px 3px 12px rgba(0,0,0,.5) !important;
    border-left: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}
.wcm-ph-map .gm-style .gm-style-iw-tc::after,
.wcm-pp-map .gm-style .gm-style-iw-tc::after {
    background: rgba(16, 10, 28, 0.95) !important;
}

/* Close X — subtelny (lustro do Leaflet popup-close-button) */
.wcm-ph-map .gm-style .gm-ui-hover-effect,
.wcm-pp-map .gm-style .gm-ui-hover-effect {
    top: 6px !important;
    right: 6px !important;
    width: 24px !important;
    height: 24px !important;
    background: transparent !important;
    opacity: 1 !important;
    z-index: 10 !important;
    transition: all 180ms ease !important;
    filter: none !important;
}
.wcm-ph-map .gm-style .gm-ui-hover-effect span,
.wcm-pp-map .gm-style .gm-ui-hover-effect span {
    width: 14px !important;
    height: 14px !important;
    margin: 5px !important;
    background-color: rgba(255,255,255,.30) !important;
    transition: background-color 180ms ease !important;
}
.wcm-ph-map .gm-style .gm-ui-hover-effect:hover span,
.wcm-pp-map .gm-style .gm-ui-hover-effect:hover span {
    background-color: var(--wcm-ph-gold-1) !important;
}

/* ==========================================================================
   BLOKADA ZBĘDNYCH KONTROLEK (fullscreen, 3D, Street View)
   ========================================================================== */

.wcm-ph-map .gm-fullscreen-control,
.wcm-pp-map .gm-fullscreen-control,
.wcm-ph-map button[title="Włącz widok pełnoekranowy"],
.wcm-pp-map button[title="Włącz widok pełnoekranowy"],
.wcm-ph-map button[title="Wyłącz widok pełnoekranowy"],
.wcm-pp-map button[title="Wyłącz widok pełnoekranowy"],
.wcm-ph-map button[aria-label="Toggle fullscreen view"],
.wcm-pp-map button[aria-label="Toggle fullscreen view"] {
    display: none !important;
}

.wcm-ph-map .gm-tilt,    .wcm-pp-map .gm-tilt,
.wcm-ph-map .gm-compass, .wcm-pp-map .gm-compass,
.wcm-ph-map .gm-svpc,    .wcm-pp-map .gm-svpc,
.wcm-ph-map button[title="Obróć mapę"],
.wcm-pp-map button[title="Obróć mapę"],
.wcm-ph-map button[aria-label="Sterowanie kamerą na mapie"],
.wcm-pp-map button[aria-label="Sterowanie kamerą na mapie"] {
    display: none !important;
}

/* ==========================================================================
   KONTROLKA ZOOM — lustro do Leaflet zoom control
   (jasna, fioletowa, zaokrąglona)
   ========================================================================== */

.wcm-ph-map .gm-bundled-control,
.wcm-pp-map .gm-bundled-control {
    margin: 12px !important;
}

.wcm-ph-gmaps-geo-ctrl {
    position: absolute;
    z-index: 5;
    margin: 0 !important;
    right: 12px;
    bottom: 110px;
}

.wcm-ph-gmaps-geo-btn {
    width: 40px;
    height: 40px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0;
    background: #ECE7F1;
    color: var(--wcm-pu1, #411D76);
    cursor: pointer;
    box-shadow:
        rgba(0, 0, 0, 0.3) 0 1px 4px -1px;

    transition: background 0.2s, color 0.2s, transform 0.1s, box-shadow 0.2s;
}
.wcm-ph-gmaps-geo-btn:hover {
    background: #f5f5f5;
    color: var(--wcm-pu2, #7236ba);
}
.wcm-ph-gmaps-geo-btn:active {
    transform: scale(0.95);
}
.wcm-ph-gmaps-geo-btn:focus-visible {
    outline: 2px solid var(--wcm-pu3, #9152df);
    outline-offset: 2px;
}
.wcm-ph-gmaps-geo-btn[disabled] {
    cursor: not-allowed;
    opacity: 0.6;
}

/* Loading: pulsująca aura purple + obracająca się ikona crosshair.
   Reuse keyframes wcm-geo-pulse / wcm-geo-spin z frontend.css. */
.wcm-ph-gmaps-geo-btn--loading {
    pointer-events: none;
    cursor: progress;
    color: var(--wcm-pu2, #7236ba) !important;
    background: #faf6ff !important;
    animation: wcm-geo-pulse 1.4s ease-in-out infinite;
}
.wcm-ph-gmaps-geo-btn--loading svg {
    animation: wcm-geo-spin 2s linear infinite;
}

/* Active: subtelny złoty highlight gdy lokalizacja została pomyślnie pobrana.
   Zachowujemy białe tło (spójność z zoom controls) — złoty akcent przez glow + ikonę. */
.wcm-ph-gmaps-geo-btn--active {
    background: #fffbe8 !important;
    color: #c89400 !important;
    box-shadow:
        0 0 0 1.5px rgba(255, 202, 40, 0.7),
        0 0 14px rgba(255, 202, 40, 0.45),
        rgba(0, 0, 0, 0.3) 0 1px 4px -1px !important;
}
.wcm-ph-gmaps-geo-btn--active:hover {
    background: #fff5cc !important;
    box-shadow:
        0 0 0 1.5px rgba(255, 202, 40, 0.85),
        0 0 22px rgba(255, 202, 40, 0.6),
        rgba(0, 0, 0, 0.3) 0 1px 4px -1px !important;
}

.wcm-ph-gmaps-geo-ctrl svg {
    stroke: #626067;
}

@media (prefers-reduced-motion: reduce) {
    .wcm-ph-gmaps-geo-btn--loading,
    .wcm-ph-gmaps-geo-btn--loading svg {
        animation: none !important;
    }
}