:root {
  --uh-primary: #0085ba;
  --uh-primary-light: #4c9aff;
  --uh-success: #10b981;
  --uh-danger: #ef4444;
  --uh-warning: #f59e0b;
  --uh-bg: #fff;
  --uh-border: #dde8fb;
  --uh-shadow: 0 2px 14px 0 #0085ba22;
  --uh-radius: 14px;
  --uh-font: 'Segoe UI', 'Arial', sans-serif;
  --uh-text: #212121;
}

/* HARİTA ANA ALAN */
.harita-map,
.wmapbox-map-container {
  border: 1px solid var(--uh-border);
  border-radius: var(--uh-radius);
  background: var(--uh-bg);
  box-shadow: var(--uh-shadow);
  margin-bottom: 22px;
  min-height: 320px;
  position: relative;
}

/* MARKER POPUP KLİSİK YATAY */
.mapboxgl-popup-content {
  padding: 0 !important;
  border-radius: var(--uh-radius) !important;
  box-shadow: var(--uh-shadow) !important;
  border: 1px solid var(--uh-border) !important;
  background: var(--uh-bg) !important;
  max-width: 430px;
  font-family: var(--uh-font);
  font-size: 16px;
}
.mapboxgl-popup-anchor-bottom .mapboxgl-popup-tip,
.mapboxgl-popup-anchor-top .mapboxgl-popup-tip {
  border-top-color: var(--uh-bg) !important;
  border-bottom-color: var(--uh-bg) !important;
}

/* CLASSIC POPUP YATAY KART İÇERİĞİ */
.mapboxgl-popup-content a { color: var(--uh-primary); text-decoration: none; }
.mapboxgl-popup-content a:hover { color: var(--uh-primary-light); }
.mapboxgl-popup-content img { display:block; }
.mapboxgl-popup-content .harita-btn, 
.mapboxgl-popup-content button {
  font-family: var(--uh-font);
  border: none;
  outline: none;
  font-weight: 500;
  border-radius: 8px;
  padding: 7px 14px;
  margin: 0 0 4px 0;
  background: #f0f4fd;
  color: var(--uh-primary);
  transition: all 0.18s;
  cursor: pointer;
  min-width: 85px;
  font-size: 15px;
}
.mapboxgl-popup-content .harita-btn.servis-btn,
.mapboxgl-popup-content .harita-paket {
  background: #e9fcf1;
  color: #129864;
  border: 1px solid #baf2d6;
}
.mapboxgl-popup-content .harita-btn:hover,
.mapboxgl-popup-content .servis-btn:hover { background: var(--uh-primary-light); color: #fff; }

.mapboxgl-popup-content .harita-btn:active { background: #c8d7ea; }

/* CLUSTER POPUP: Ürün listesi */
.mapboxgl-popup-content .popup-cluster-item {
  display: flex;
  align-items: center;
  border-bottom: 1px solid #f3f3f3;
  padding: 7px 0;
}
.mapboxgl-popup-content .popup-cluster-item:last-child { border-bottom: none; }
.mapboxgl-popup-content .popup-cluster-item img {
  width: 38px; height: 38px; border-radius: 7px; margin-right: 9px;
  border: 1px solid #eee;
}
.mapboxgl-popup-content .popup-cluster-item .harita-btn {
  min-width: 50px; padding: 5px 10px; font-size: 13px; margin-left: 6px;
}
.mapboxgl-popup-content .popup-cluster-item a { color: var(--uh-text); }
.mapboxgl-popup-content .popup-cluster-item .popup-featured,
.mapboxgl-popup-content .popup-featured {
  background: #ffe082; color: #744210; font-size: 12px;
  border-radius: 7px; padding: 2px 8px; margin-left: 7px;
  font-weight: 500;
}

/* LOADING SPINNER */
#wmapbox-loading-spinner {
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  background: rgba(255,255,255,0.98);
  padding: 2em 2.5em;
  border-radius: 16px;
  z-index: 10;
  box-shadow: 0 2px 18px rgba(0,133,186,0.1);
  font-family: var(--uh-font);
  color: var(--uh-text);
  text-align: center;
  border: 1px solid var(--uh-border);
}
.wmapbox-spinner {
  margin: 0 auto 18px auto;
  border: 3px solid #dde8fb;
  border-top: 3px solid var(--uh-primary);
  border-radius: 50%; width: 34px; height: 34px;
  animation: spin 1.1s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* VENDOR/PRODUCT FORMLARI */
.dokan-form-group .harita-map {
  min-height: 240px !important;
  margin-bottom: 15px !important;
}
.dokan-form-group .harita-btn {
  margin-bottom: 10px !important;
}
#paket-form, #paket-form-registration {
  background: #f6fafe;
  border: 1px solid #dde8fb;
  border-radius: 9px;
  margin-top: 10px;
  padding: 10px 14px 6px 14px;
}
#paket-form label, #paket-form-registration label {
  margin-right: 10px;
  font-size: 15px;
}

/* NOTIFICATIONS & MODALS */
.uh-error-notification, .uh-success-notification {
  position: fixed; left: 50%; top: 24px; transform: translateX(-50%);
  z-index: 99999; padding: 14px 24px; font-size: 16px;
  border-radius: 12px; color: #fff; font-weight: 500;
  box-shadow: 0 2px 14px 0 #0085ba22;
  text-align: center; min-width: 180px;
}
.uh-success-notification { background: var(--uh-success); }
.uh-error-notification { background: var(--uh-danger); }
.uh-modal {
  position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;
  background: rgba(0,0,0,0.72); z-index: 10000;
  display: flex; align-items: center; justify-content: center;
}
.uh-modal > div {
  background: #fff;
  padding: 2em 2em 1.5em 2em;
  border-radius: 18px;
  box-shadow: 0 6px 24px 0 #0085ba19;
  max-width: 380px; min-width: 230px;
  font-family: var(--uh-font);
}

/* RESPONSIVE */
@media (max-width: 767px) {
  .harita-map,
  .wmapbox-map-container { min-height: 220px; }
  #harita-toggle-btn { top: 12px; right: 10px; font-size: 13px; padding: 7px 16px;}
  .mapboxgl-popup-content { max-width: 96vw !important; }
}
@media (max-width: 430px) {
  .mapboxgl-popup-content { padding: 0 !important; }
  .mapboxgl-popup-content img { max-width: 34px !important; max-height: 34px !important;}
}

/* Harita kapalıyken kesinlikle görünmesin */
body:not(.harita-map-visible) #woodmart-mapbox-archive {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}

/* Harita açıkken görünsün */
body.harita-map-visible #woodmart-mapbox-archive {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Woodmart AJAX yüklenirken harita durumunu koru */
.woodmart-loading #woodmart-mapbox-archive {
    transition: none !important;
}

/* Filter değişirken harita flickering önle */
.woocommerce-result-count + #woodmart-mapbox-archive {
    transition: opacity 0.3s ease;
}

/* unified-harita.css dosyasına ekleyin: */

/* Mobil modal düzeltmeleri */
@media (max-width: 768px) {
    /* Modal backdrop mobil optimizasyonu */
    [id*="enhanced-modal-backdrop"] {
        padding: 5px !important;
        align-items: flex-start !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    /* Modal container mobil optimizasyonu */
    [id*="enhanced-modal"] {
        margin: 10px 5px !important;
        max-height: 85vh !important;
        width: calc(100% - 10px) !important;
        max-width: calc(100% - 10px) !important;
    }
    
    /* Modal içerik padding'i azalt */
    [id*="enhanced-modal"] > div {
        padding: 20px 15px !important;
    }
    
    /* Close button büyüt */
    [id*="enhanced-modal"] button {
        width: 44px !important;
        height: 44px !important;
        font-size: 24px !important;
        top: 10px !important;
        right: 10px !important;
    }
    
    /* Modal title mobil */
    [id*="enhanced-modal"] h3 {
        font-size: 20px !important;
        padding-right: 60px !important;
        margin-bottom: 20px !important;
    }
}

/* Mobil harita container koruması */
@media (max-width: 768px) {
    #woodmart-mapbox-archive {
        min-height: 300px;
        position: relative;
        overflow: hidden;
    }
    
    /* Mobil harita yüklenirken */
    #woodmart-mapbox-archive:empty::before {
        content: "Harita yükleniyor...";
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        color: #666;
        font-size: 14px;
    }
    
    /* Mobil harita container hidden state */
    body:not(.harita-map-visible) #woodmart-mapbox-archive {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        min-height: 0 !important;
    }
    
    /* Mobil popup butonları */
    .harita-btn {
        min-height: 44px !important;
        padding: 12px 16px !important;
        font-size: 14px !important;
        touch-action: manipulation !important;
        -webkit-tap-highlight-color: transparent !important;
    }
    
    /* Mobil popup'lar */
    .mapboxgl-popup {
        max-width: 280px !important;
    }
    
    .mapboxgl-popup-content {
        padding: 10px !important;
        border-radius: 8px !important;
    }
}

/* iOS Safari düzeltmeleri */
@supports (-webkit-touch-callout: none) {
    [id*="enhanced-modal-backdrop"] {
        position: fixed !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    /* iOS modal scroll düzeltmesi */
    [id*="enhanced-modal"] {
        -webkit-overflow-scrolling: touch !important;
        overflow-y: auto !important;
    }
}

/* Android Chrome düzeltmeleri */
@media screen and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm) {
    [id*="enhanced-modal"] {
        transform: translateZ(0) !important;
    }
}

btn.style.setProperty('background', 'transparent', 'important');
btn.style.setProperty('border', 'none', 'important');
btn.style.setProperty('padding', '0', 'important');
btn.style.setProperty('margin', '0', 'important');
emoji.style.setProperty('font-size', `${fontSize}px`, 'important');
