/* =========================================================
   VisitVoruVald – INFO button + Leaflet attribution (FINAL)
   ========================================================= */


/* =========================
   LEAFLET ATTRIBUTION
   (all paremal, vasakul INFOst)
   ========================= */

.leaflet-control-attribution{
  position: fixed !important;
  right: 120px !important;   /* ⬅ vahe INFO ja attributioni vahel */
  bottom: 8px !important;
  z-index: 500 !important;
  pointer-events: auto !important;
}


/* =========================
   INFO NUPP – all paremal
   ========================= */

.leaflet-control.vvv-info-control{
  position: fixed !important;
  right: 12px !important;    /* INFO on kõige paremal */
  bottom: 8px !important;    /* ✅ SAMAL JOONEL attributioniga */
  z-index: 999999 !important;
  pointer-events: auto !important;
}


/* =========================
   INFO NUPU STIIL (punane pill)
   ========================= */

.leaflet-control.vvv-info-control .vvv-info-btn{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 10px 18px !important;

  background: #c62828 !important;
  color: #ffffff !important;

  border: none !important;
  border-radius: 999px !important;

  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1 !important;

  cursor: pointer !important;
  box-shadow: 0 6px 16px rgba(0,0,0,.25) !important;
}

.leaflet-control.vvv-info-control .vvv-info-btn:hover{
  background: #b71c1c !important;
}


/* =========================
   INFO POPUP / MODAL
   ========================= */

.vvv-info-overlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  display: none;
  z-index: 999999;
  padding: 18px;
}

.vvv-info-overlay.is-open{
  display: flex;
  align-items: center;
  justify-content: center;
}

.vvv-info-modal{
  width: min(720px, 100%);
  max-height: 80vh;
  overflow: auto;
  background: #ffffff;
  border-radius: 16px;
  box-shadow: 0 20px 60px rgba(0,0,0,.35);
  position: relative;
  padding: 18px 18px 22px;
}

.vvv-info-close{
  position: absolute;
  top: 10px;
  right: 12px;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,.12);
  background: #ffffff;
  cursor: pointer;
  font-size: 22px;
  line-height: 1;
}

.vvv-info-header{
  display: flex;
  align-items: center;
  gap: 14px;
  padding-right: 48px;
  margin-bottom: 12px;
}

.vvv-info-logo img{
  max-height: 44px;
  width: auto;
  display: block;
}

.vvv-info-lang{
  margin-left: auto;
  display: flex;
  gap: 8px;
}

.vvv-info-lang a{
  display: inline-block;
  padding: 6px 10px;
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 999px;
  text-decoration: none;
  color: inherit;
}

.vvv-info-body{
  font-size: 16px;
  line-height: 1.5;
}


/* =========================
   MOBIIL – SAFE AREA TUGI
   ========================= */

@media (max-width: 768px){

  .leaflet-control-attribution{
    right: 110px !important;
    bottom: calc(8px + env(safe-area-inset-bottom)) !important;
    bottom: calc(8px + constant(safe-area-inset-bottom)) !important;
  }

  .leaflet-control.vvv-info-control{
    right: 12px !important;
    bottom: calc(8px + env(safe-area-inset-bottom)) !important;
    bottom: calc(8px + constant(safe-area-inset-bottom)) !important;
  }

  .leaflet-control.vvv-info-control .vvv-info-btn{
    padding: 11px 16px !important;
    font-size: 14px !important;
  }
}