.klkpwa-install-btn{
  position:fixed;
  bottom:20px;
  right:20px;
  background:#0d6efd;
  color:#fff;
  border:none;
  padding:12px 16px;
  border-radius:8px;
  cursor:pointer;
  z-index:9999;
}

#klkpwa-popup{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:rgba(0,0,0,0.4);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:99999;
}

.klkpwa-box{
  background:#fff;
  padding:25px;
  border-radius:12px;
  text-align:center;
  width:320px;
  box-shadow:0 10px 30px rgba(0,0,0,0.2);
}

.klkpwa-icon{
  font-size:30px;
  margin-bottom:10px;
}

.klkpwa-buttons{
  margin-top:15px;
  display:flex;
  justify-content:space-between;
  gap:10px;
}

.klkpwa-buttons button{
  flex:1;
  padding:10px;
  border:none;
  border-radius:6px;
  cursor:pointer;
}

#klkpwa-later{
  background:#ddd;
}

#klkpwa-install{
  background:#0d6efd;
  color:#fff;
}

#klkpwa-subscribe{
  background:#28a745;
  color:#fff;
}

#klkpwa-loader{
  position:fixed;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  background:#fff;
  padding:20px;
  border-radius:12px;
  box-shadow:0 10px 30px rgba(0,0,0,0.2);
  z-index:9999;
  text-align:center;
}

.klkpwa-progress{
  width:200px;
  height:6px;
  background:#eee;
  border-radius:10px;
  overflow:hidden;
  margin-bottom:10px;
}

.klkpwa-bar{
  width:0%;
  height:100%;
  background:#0d6efd;
  animation:loadBar 2s linear infinite;
}

@keyframes loadBar{
  0%{width:0%;}
  50%{width:80%;}
  100%{width:100%;}
}

/* BUTTON EFFECT */
.klkpwa-buttons button{
  padding:10px 15px;
  border:none;
  border-radius:8px;
  cursor:pointer;
  transition:all 0.2s ease;
}

#klkpwa-subscribe{
  background:#28a745;
  color:#fff;
}

#klkpwa-subscribe:hover{
  background:#218838;
  transform:translateY(-2px);
}

#klkpwa-subscribe:active{
  transform:scale(0.95);
}

/* LOADING BAR */
#klkpwa-progress{
  margin-top:15px;
  text-align:center;
}

.klkpwa-bar{
  height:5px;
  width:100%;
  background:#eee;
  border-radius:10px;
  overflow:hidden;
  margin-bottom:5px;
  position:relative;
}

.klkpwa-bar::after{
  content:'';
  position:absolute;
  width:40%;
  height:100%;
  background:#0d6efd;
  animation:loading 1s infinite;
}

@keyframes loading{
  0%{left:-40%;}
  100%{left:100%;}
}

/* TOAST */
.klkpwa-toast{
  position:fixed;
  bottom:20px;
  left:50%;
  transform:translateX(-50%);
  padding:10px 20px;
  border-radius:8px;
  color:#fff;
  z-index:9999;
}

.klkpwa-toast.success{ background:#28a745; }
.klkpwa-toast.error{ background:#dc3545; }