/* ==================================================
   CSS CODING BY JAGO KOMPUTER - JANGAN DI UBAH APAPUN
================================================== */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html,
body{
    width:100%;
    min-height:100%;
    overflow-x:hidden;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    background:#000;
}

/* ===============================
   CONTROL READY STATE
================================== */

/* sembunyikan popup sebelum LP siap */
body:not(.lp-ready) .wp_welcome_overlay{
  opacity:0;
  pointer-events:none;
}

/* ===============================
   LOADER SCREEN
================================== */

#lpLoader{
  position:fixed;
  inset:0;
  background:#000;
  display:flex;
  justify-content:center;
  align-items:center;
  z-index:999999;
}

/* spinner */
.lp-spinner{
  width:38px;
  height:38px;
  border:4px solid rgba(255,255,255,0.15);
  border-top-color:#39ff14;
  border-radius:50%;
  animation:spin 0.8s linear infinite;
}

/* animasi spin */
@keyframes spin{
  to{
    transform:rotate(360deg);
  }
}


/* =============================== POPUP SAMBUTAN - SAFE DATING UI ================================== */
/* ===============================
   OVERLAY
================================== */
.wp_welcome_overlay{
  position:fixed;
  inset:0;
  display:flex;
  justify-content:center;
  align-items:center;
  z-index:999999;
  background:none;
  letter-spacing:0.5px;
}

/* ===============================
   MAIN CARD
================================== */
.wp_welcome_box{
  width:360px;
  border-radius:20px;
  overflow:hidden;

  background:rgba(255,255,255,0.08);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);

  border:1px solid rgba(255,255,255,0.15);
  box-shadow:0 40px 100px rgba(0,0,0,0.55);

  font-family:system-ui, -apple-system, sans-serif;
  animation:pop .18s ease;

  letter-spacing:0.5px;
}

@keyframes pop{
  from{transform:scale(.95);opacity:0;}
  to{transform:scale(1);opacity:1;}
}

/* ===============================
   HEADER (VERY TIGHT)
================================== */
.wp_welcome_title{
  padding:0px 14px 2px 14px;
  text-align:center;
}

/* TITLE */
.wp_welcome_title_main{
  display:inline-block;
  padding:5px 14px;
  font-size:20px !important;
  font-weight:980 !important;
  border-radius:0 0 20px 20px;

  /* background hitam transparan */
  background:rgba(0,0,0,0.75);

  border:2px solid rgba(255,255,255,.18);
}

.wp_welcome_title_main span{
  background:linear-gradient(
    90deg,
    #ff0000,
    #ff9900,
    #ffff00,
    #00ff00,
    #00ffff,
    #0066ff,
    #cc00ff,
    #ff0099
  );

  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  color:transparent;

  font-weight:980 !important;
}

/* SUB TITLE */
.wp_welcome_title_sub{
  display:inline-block;
  font-size:14px;
  font-weight:bold;
  color:#fff;
  text-align:center;
  line-height:1.3;
  letter-spacing:0.5px;

  padding:4px 12px;

  border:2px solid rgba(255,255,255,0.18);
  border-radius:50px;

  text-shadow:0 2px 10px rgba(0,0,0,0.35);

  margin-top:6px;

  background:rgba(0,0,0,0.35);
}

/* ===============================
   CONTENT (COMPACT)
================================== */
.wp_welcome_iming{
  margin:0px 12px 0 12px;
  padding:8px;

  background:none;
  border-radius:12px;
  
  display:flex;
  flex-direction:column;
  gap:6px;
}

/* ===============================
   STEP BOX
================================== */
.wp_step_box{
  display:flex;
  align-items:center;
  gap:6px;

  width:100%;

  padding:10px 12px;
  border-radius:25px;

  background:#000;
  border:1px solid #00FFFF;

  color:#fff;
  box-sizing:border-box;
}

/* NUMBER */
.wp_step_number{
  width:28px;
  height:28px;

  flex-shrink:0;

  display:flex;
  align-items:center;
  justify-content:center;

  font-size:15px;
  font-weight:900;

  background:#8B5A2B;

  background:linear-gradient(
    90deg,
    #ff0000,
    #ff9900,
    #ffff00,
    #00ff00,
    #00ffff,
    #0066ff,
    #cc00ff,
    #ff0099
  );
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  color:transparent;

  border:2px solid #00FF00;
  border-radius:50px;

  box-shadow:0 5px 12px rgba(0,0,0,0.35);
}

/* TEXT */
.wp_step_text{
  flex:1;
  min-width:0;

  font-size:14px;
  line-height:1.4;
  font-weight:800;

  color:#fff;
  letter-spacing:0.6px;

  word-break:break-word;
}

/* ===============================
   BUTTONS (COMPACT)
================================== */
.wp_welcome_btns{
  display:flex;
  gap:8px;
  padding:10px;
}

/* BUTTON BASE */
.wp_welcome_btn{
  flex:1;
  padding:8px;
  border-radius:0 0 25px 25px;
  border:2px solid rgba(255,255,255,.18);

  font-weight:980;

  cursor:pointer;
  transition:0.2s ease;

  background:#111827;
  box-shadow:0 8px 18px rgba(0,0,0,0.45);
}

/* SPAN */
.wp_welcome_btn span{
  font-weight:980;
}

/* SKIP */
.wp_welcome_skip{
  background:linear-gradient(145deg,#0f3d2e,#00a86b);
}

.wp_welcome_skip span{
  color:#fff;
  font-size:14px;
}

/* NEXT */
.wp_welcome_next{
  background:linear-gradient(145deg,#0b1b3a,#1e3a8a);
}

.wp_welcome_next span{
  font-size:18px;

  background:linear-gradient(
    135deg,
    #ff2d55 0%,
    #ff4d8d 35%,
    #ff7a45 70%,
    #ffb347 100%
  );

  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
  color:transparent;

  filter:
    drop-shadow(0 2px 10px rgba(255,45,85,.35))
    drop-shadow(0 0 12px rgba(255,138,0,.25));
}

/* hover */
.wp_welcome_btn:hover{
  transform:translateY(-1px) scale(1.01);
  filter:brightness(1.1);
}

/* active */
.wp_welcome_btn:active{
  transform:scale(0.97);
}

/* ===============================
   MOBILE
================================== */
@media (max-width:420px){
  .wp_welcome_box{
    width:92%;
  }
}


/* =============================== POPUP LOGIN - SAFE DATING UI ================================== */
/* =====================================
   OVERLAY BACKDROP (SUPER LIGHT)
======================================== */
.popup-overlay{
    position:fixed;
    inset:0;

    background:rgba(0,0,0,0.2);

    display:flex;
    justify-content:center;
    align-items:center;

    z-index:999999;

    opacity:0;
    visibility:hidden;

    transition:opacity .2s linear;
}

.popup-overlay.active{
    opacity:1;
    visibility:visible;
}


/* =========================
   POPUP BOX PREMIUM UI LIGHT
========================= */
.popup-box{
    width:380px;
    max-width:98vw;

    border-radius:26px;

    overflow:hidden;

    background:linear-gradient(
        180deg,
        rgba(20,20,20,.92),
        rgba(10,10,10,.96)
    );

    border:2px solid rgba(255,45,85,.25);

    text-align:center;

    /* shadow ringan */
    box-shadow:
        0 8px 20px rgba(0,0,0,.35);

    opacity:0;
}


/* =========================
   ULTRA LIGHT FADE
========================= */
.popup-overlay.active .popup-box{
    animation:popupFade .35s linear forwards;
}

@keyframes popupFade{

    from{
        opacity:0;
    }

    to{
        opacity:1;
    }

}

/* =========================
   HEADER (SMOOTH COLOR ANIMATION)
========================= */
.popup-header{
    padding:0px 16px 14px 16px;

    border-bottom:1px solid rgba(255,255,255,.08);

    border-top-left-radius:26px;
    border-top-right-radius:26px;

    /* animated gradient background */
    background:linear-gradient(270deg,
        rgba(255,45,85,.22),
        rgba(255,122,69,.18),
        rgba(255,0,120,.20),
        rgba(255,200,100,.15)
    );

    background-size:800% 800%;

    animation:headerFlow 2s ease infinite;
}

/* SMOOTH COLOR SHIFT ANIMATION */
@keyframes headerFlow{
    0%{
        background-position:0% 50%;
    }
    50%{
        background-position:100% 50%;
    }
    100%{
        background-position:0% 50%;
    }
}

/* =========================
   BADGE
========================= */
.popup-badge{
    display:inline-block;
    padding:5px 14px;
    font-size:14px;
    font-weight:980 !important;
    border-radius:0 0 20px 20px;
	
    background:rgba(255,45,85,.15);
    color:#ff6aa8;
    border:1px solid rgba(255,45,85,.25);

    margin-bottom:10px;

    letter-spacing:.3px;
}

/* =========================
   TITLE
========================= */
.popup-title{
  font-size:16px;

  font-weight:980;

  text-transform:uppercase;

  letter-spacing:1px;

  background:
  linear-gradient(
    135deg,
    #ff1744 0%,
    #ff3d7f 25%,
    #ff6a00 55%,
    #ffcc33 100%
  );

  -webkit-background-clip:text;

  background-clip:text;

  -webkit-text-fill-color:transparent;

  color:transparent;

  text-shadow:
    0 0 1px rgba(255,255,255,.15);
}

/* =========================
   TAGLINE
========================= */
.popup-tagline{
    color:rgba(255,255,255,.85);
    font-size:13px;
    margin-bottom:4px;
    font-weight:700;
	letter-spacing:0.5px;
}

.popup-subtag{
    color:rgba(255,255,255,.55);
    font-size:12px;
	letter-spacing:0.5px;
}


/* =========================
   BODY
========================= */
.popup-body{
    padding:16px;
}

/* =========================
   INPUT WRAPPER
========================= */
.input-box{
    position:relative;
    width:100%;
    margin-bottom:10px;
}

/* =========================
   INPUT FIELD
========================= */
.popup-body input{
    width:100%;
    padding:12px 42px 12px 12px;

    border-radius:12px;
    border:1px solid rgba(255,255,255,.08);

    outline:none;

    background:rgba(255,255,255,.06);
    color:#fff;

    letter-spacing:0.5px;
    font-size:14px;

    transition:.2s ease;
}

.popup-body input:focus{
    border:1px solid rgba(255,90,165,.45);
    background:rgba(255,255,255,.09);
}

.popup-body input::placeholder{
    color:rgba(255,255,255,.4);
}

/* =========================
   EYE ICON (SVG BUTTON)
========================= */
.eye-toggle{
    position:absolute;
    right:10px;
    top:50%;
    transform:translateY(-50%);
    width:34px;
    height:34px;

    display:flex;
    align-items:center;
    justify-content:center;

    cursor:pointer;

    border-radius:50px;

    transition:.2s ease;

    background:none;
}

.eye-toggle:hover{
    background:rgba(255,255,255,.10);
    transform:translateY(-50%) scale(1.05);
}

/* SVG STYLE */
.eye-toggle svg{
    width:18px;
    height:18px;
    fill:rgba(255,255,255,.7);
    transition:.2s ease;
}

.eye-toggle:hover svg{
    fill:#fff;
}

/* =========================
   LOGIN BUTTON
========================= */
.btn-login{
    width:100%;
    padding:8px 5px;
    letter-spacing:0.5px;
    border:2px solid rgba(255,255,255,.18);
    border-radius:16px;
    font-size:20px;
    font-weight:980;
    background:linear-gradient(135deg,#ff2d55,#ff7a45);
    color:#fff;
    cursor:pointer;
    transition:.2s ease;
    box-shadow:0 10px 25px rgba(255,45,85,.25);
}

/* TEXT */
.btn-login span{
    display:inline-block;
    animation:colorRun 3s linear infinite;

    /* STRONG SHADOW */
    text-shadow:
        0 2px 2px rgba(0,0,0,.95),
        0 4px 8px rgba(0,0,0,.85),
        0 0 10px rgba(0,0,0,.75);
}

/* =========================
   DIVIDER
========================= */
.popup-divider{
    margin:5px 0;
    font-size:14px;
    color:rgba(255,255,255,.75);
    letter-spacing:0.8px;
    text-align:center;
}

/* TEXT */
.popup-divider span{
    display:inline-block;
    text-shadow:
        0 2px 2px rgba(0,0,0,.95),
        0 4px 8px rgba(0,0,0,.85),
        0 0 10px rgba(0,0,0,.75);
}

/* =========================
   REGISTER BUTTON
========================= */
.btn-register{
    width:100%;
    padding:8px 5px;
    letter-spacing:0.5px;

    border-radius:18px;
    cursor:pointer;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:20px;
    font-weight:980;
    color:#ffffff;

    position:relative;
    overflow:hidden;

    background:radial-gradient(
        circle at 30% 25%,
        #93c5fd 0%,
        #3b82f6 40%,
        #2563eb 70%,
        #1e3a8a 100%
    );

    border:2px solid rgba(255,255,255,.18);

    box-shadow:
        0 0 18px rgba(59,130,246,.35),
        0 8px 25px rgba(0,0,0,.25);
}

/* TEXT */
.btn-register span{
    display:inline-block;
    animation:colorRun 3s linear infinite;

    /* STRONG SHADOW */
    text-shadow:
        0 2px 2px rgba(0,0,0,.95),
        0 4px 8px rgba(0,0,0,.85),
        0 0 10px rgba(0,0,0,.75);
}

/* =========================
   COLOR RUN ANIMATION
========================= */
@keyframes colorRun{
    0%{
        color:#ffffff; /* PUTIH */
    }
    25%{
        color:#ffff00; /* KUNING */
    }
    50%{
        color:#39ff14; /* HIJAU CERAH */
    }
    75%{
        color:#ffff00; /* KUNING */
    }
    100%{
        color:#ffffff; /* PUTIH */
    }
}

/* =========================
   HOVER EFFECT (MORE PREMIUM)
========================= */
.btn-register:hover{
    transform:scale(1.01);
}

/* =========================
   GUIDE
========================= */
.popup-guide{
    margin:0 16px 14px 16px;
    text-align:left;

    padding:10px;

    background:rgba(255,255,255,.04);
    border:2px solid rgba(255,255,255,.08);

    border-radius:18px;
}

.popup-guide h3{
    font-size:14px;
	font-weight:600;
    color:#fff;
    margin-bottom:5px;
	letter-spacing:0.5px;
}

.step{
    font-size:12px;
	font-weight:600;
    color:rgba(255,255,255,.95);
    margin-bottom:0px;
	letter-spacing:1px;
}

/* =========================
   FOOTER
========================= */
.popup-footer{
    padding:8px 5px 15px 5px;
    border-top:1px solid rgba(255,255,255,.08);
}

.popup-footer small{
    font-size:10px;
    color:rgba(255,255,255,.55);
	font-weight:500;
	letter-spacing:0.5px;
}

/* =========================
   RESPONSIVE
========================= */
@media (max-width:360px){
    .popup-box{ width:92vw; }
    .popup-title{ font-size:20px; }
}

@media (min-width:361px) and (max-width:420px){
    .popup-box{ width:90vw; }
}

@media (min-width:421px) and (max-width:480px){
    .popup-box{ width:380px; }
}

@media (min-width:481px) and (max-width:820px){
    .popup-box{ width:420px; }
}


/* ==================================================
   TOP BAR UI PREMIUM
================================================== */

.top-ui{
    position:fixed;
    top:15px;
    left:15px;
    right:15px;

    display:flex;
    justify-content:space-between;
    align-items:center;

    z-index:9999;
    pointer-events:none;
}

/* =========================
   LOGO KIRI (GLASS BLACK UI)
========================= */

.logo-box{
    display:flex;
    align-items:center;
    gap:6px;

    padding: 6px 15px 6px 6px;

    background:rgba(0,0,0,.45);
    backdrop-filter:blur(15px);
    -webkit-backdrop-filter:blur(15px);

    border:1px solid rgba(255,255,255,.08);

    border-radius:50px;

    box-shadow:
        0 0 25px rgba(0,0,0,.6),
        inset 0 0 10px rgba(255,255,255,.05);
}

/* =========================
   LOGO IMAGE
========================= */

.logo-box img{
    width:38px;
    height:38px;
    border-radius:50%;
    object-fit:cover;
}

/* =========================
   LOGO TEXT (GRADIENT STYLE)
========================= */

.logo-text{
    font-size:26px;
    font-weight:900;
    letter-spacing:0.5px;
    line-height:1;
    cursor:pointer;

    background:linear-gradient(
        135deg,
        #ff2d55 0%,
        #ff4d8d 35%,
        #ff7a45 70%,
        #ffb347 100%
    );

    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    background-clip:text;
    color:transparent;

    filter:
        drop-shadow(0 2px 10px rgba(255,45,85,.35))
        drop-shadow(0 0 12px rgba(255,138,0,.25));
}

/* =========================
   LOGO SUB TEXT
========================= */

.logo-sub{
    color:rgba(255,255,255,.75);
    font-size:12px;
	font-weight:700;
    font-family:Arial,sans-serif;
    line-height:1.2;
	letter-spacing:0.5px;
}

/* =========================
   STATUS KANAN
========================= */

.status-box{
    display:flex;
    align-items:center;
    gap:10px;

    padding: 6px 10px 6px 10px;

    background:rgba(0,0,0,.45);
    backdrop-filter:blur(15px);
    -webkit-backdrop-filter:blur(15px);

    border:1px solid rgba(255,255,255,.08);

    border-radius:50px;

    box-shadow:
        0 0 25px rgba(0,0,0,.6),
        inset 0 0 10px rgba(255,255,255,.05);
}

.status-dot{
    width:10px;
    height:10px;
    border-radius:50%;
    background:#00ff4c;

    animation:pulse 1s infinite;
}

.status-text{
    color:#fff;
    font-size:18px;
    font-weight:600;
    font-family:Arial,sans-serif;
    white-space:nowrap;
}

@keyframes pulse{

    0%{
        transform:scale(1);
        opacity:1;
    }

    50%{
        transform:scale(1.4);
        opacity:.5;
    }

    100%{
        transform:scale(1);
        opacity:1;
    }

}

/* ============================================
     🔵 RESPONSIVE FIXED (UNIFORM ALL SCREEN)
=============================================== */

/* HP KECIL 4" - 4.7" */
@media (max-width:360px){

    .top-ui{
        top:8px;
        left:8px;
        right:8px;
    }

    .logo-box{
        padding:6px 10px;
        gap:8px;
    }

    .logo-box img{
        width:30px;
        height:30px;
    }

    .logo-text{
        font-size:18px;
    }

    .logo-sub{
        font-size:10px;
    }

    .status-box{
        padding:6px 10px;
    }

    .status-text{
        font-size:11px;
    }

}

/* HP NORMAL 5" - 5.5" */
@media (min-width:361px) and (max-width:420px){

    .top-ui{
        top:8px;
        left:8px;
        right:8px;
    }

    .logo-box img{
        width:32px;
        height:32px;
    }

    .logo-text{
        font-size:18px;
    }

    .status-text{
        font-size:18px;
    }

}

/* HP BESAR 6" - 6.5" */
@media (min-width:421px) and (max-width:460px){

    .top-ui{
        top:8px;
        left:8px;
        right:8px;
    }

    .logo-box img{
        width:34px;
        height:34px;
    }

}

/* HP EXTRA BESAR 6.6" - 7" */
@media (min-width:461px) and (max-width:480px){

    .top-ui{
        top:8px;
        left:8px;
        right:8px;
    }

    .logo-box img{
        width:36px;
        height:36px;
    }

}

/* TABLET */
@media (min-width:481px) and (max-width:820px){

    .top-ui{
        top:12px;
        left:12px;
        right:12px;
    }

}

/* LAPTOP */
@media (min-width:821px) and (max-width:1440px){

    .top-ui{
        top:20px;

        left:50%;
        transform:translateX(-50%);

        width:1100px;
        max-width:1100px;
    }

}

/* MONITOR BESAR */
@media (min-width:1441px) and (max-width:1920px){

    .top-ui{
        top:22px;

        left:50%;
        transform:translateX(-50%);

        width:1200px;
        max-width:1200px;
    }

}

/* TV DIGITAL / ULTRAWIDE */
@media (min-width:1921px){

    .top-ui{
        top:25px;

        left:50%;
        transform:translateX(-50%);

        width:1300px;
        max-width:1300px;
    }

}


/* ==================================
   WRAPPER
================================== */

.slider-container{
    position:fixed;
    inset:0;
    overflow:hidden;

    background:linear-gradient(
    270deg,
    #ff0000,
    #ff8800,
    #ffff00,
    #00ff00,
    #00ffff,
    #0000ff,
    #ff00ff,
    #ff0000
    );

    background-size:1600% 1600%;

    animation:rainbowBG 3s linear infinite;
}

/* ==================================
   ANIMASI GRADIENT
================================== */

@keyframes rainbowBG{

    0%{
        background-position:0% 50%;
    }

    50%{
        background-position:100% 50%;
    }

    100%{
        background-position:0% 50%;
    }

}

/* ==================================
   TRACK
================================== */

.slider-track{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    will-change:transform;
}

/* ==================================
   SLIDE
================================== */

.slide{
    width:100%;
    height:100vh;
    display:flex;
    overflow:hidden;
}

/* ==================================
   MOBILE 9:16
================================== */

.mobile-slide{
    display:flex;
    justify-content:center;
    align-items:center;
    background:#000;
    width:100%;
    height:100vh;
}

.mobile-frame{
    width:100%;
    height:100%;
    display:flex;
    overflow:hidden;
}

.mobile-frame img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

/* ==================================
   DESKTOP
================================== */

.desktop-slide img{
    width:100%;
    height:100%;
    object-fit:contain;
    display:block;
}

/* ==================================
   HP
================================== */

@media(max-width:768px){

    .desktop-slide{
        display:none !important;
    }

}

/* ==================================
   DESKTOP
================================== */

@media(min-width:769px){

    .mobile-slide{
        display:none !important;
    }

}

/* ==============================================
   🔵 FIX: HILANGKAN TAP-HIGHLIGHT / KEDIP KLIK
      (SEMUA CLASS CSS ANDA)
================================================= */

/* ================= WELCOME POPUP ================= */
.wp_welcome_overlay,
.wp_welcome_box,
.wp_welcome_title,
.wp_welcome_title_main,
.wp_welcome_title_sub,
.wp_welcome_iming,
.wp_step_box,
.wp_step_number,
.wp_step_text,
.wp_welcome_btns,
.wp_welcome_btn,
.wp_welcome_skip,
.wp_welcome_next,

/* ================= LOGIN POPUP ================= */
.popup-overlay,
.popup-box,
.popup-header,
.popup-badge,
.popup-title,
.popup-tagline,
.popup-subtag,
.popup-body,
.input-box,
.eye-toggle,
.btn-login,
.popup-divider,
.btn-register,
.popup-guide,
.step,
.popup-footer,

/* ================= TOP UI ================= */
.top-ui,
.logo-box,
.logo-text,
.logo-sub,
.status-box,
.status-dot,
.status-text,

/* ================= SLIDER ================= */
.slider-container,
.slider-track,
.slide,
.mobile-slide,
.mobile-frame,
.desktop-slide {

  -webkit-tap-highlight-color: transparent !important;
  -webkit-touch-callout: none !important;
  -webkit-user-select: none !important;
  user-select: none !important;
  touch-action: manipulation !important;
  outline: none !important;
}

/* ==============================================
   🔵 FIX: HAPUS FOCUS / OUTLINE
================================================= */

.wp_welcome_overlay:focus,
.wp_welcome_box:focus,
.wp_welcome_title:focus,
.wp_welcome_title_main:focus,
.wp_welcome_title_sub:focus,
.wp_welcome_iming:focus,
.wp_step_box:focus,
.wp_step_number:focus,
.wp_step_text:focus,
.wp_welcome_btns:focus,
.wp_welcome_btn:focus,
.wp_welcome_skip:focus,
.wp_welcome_next:focus,

.popup-overlay:focus,
.popup-box:focus,
.popup-header:focus,
.popup-badge:focus,
.popup-title:focus,
.popup-tagline:focus,
.popup-subtag:focus,
.popup-body:focus,
.input-box:focus,
.eye-toggle:focus,
.btn-login:focus,
.popup-divider:focus,
.btn-register:focus,
.popup-guide:focus,
.step:focus,
.popup-footer:focus,

.top-ui:focus,
.logo-box:focus,
.logo-text:focus,
.logo-sub:focus,
.status-box:focus,
.status-dot:focus,
.status-text:focus,

.slider-container:focus,
.slider-track:focus,
.slide:focus,
.mobile-slide:focus,
.mobile-frame:focus,
.desktop-slide:focus {

  outline: none !important;
  box-shadow: none !important;
}

/* ==============================================
   🔵 FIX: ACTIVE / CLICK EFFECT
================================================= */

.wp_welcome_btn:active,
.wp_welcome_skip:active,
.wp_welcome_next:active,
.eye-toggle:active,
.btn-login:active,
.btn-register:active {

  outline: none !important;
  box-shadow: none !important;
}

/* ==============================================
   🔵 FIX: SELECTION HIGHLIGHT
================================================= */

.wp_welcome_overlay,
.wp_welcome_box,
.wp_welcome_title,
.wp_welcome_title_main,
.wp_welcome_title_sub,
.wp_welcome_iming,
.wp_step_box,
.wp_step_number,
.wp_step_text,
.wp_welcome_btns,
.wp_welcome_btn,
.wp_welcome_skip,
.wp_welcome_next,

.popup-overlay,
.popup-box,
.popup-header,
.popup-badge,
.popup-title,
.popup-tagline,
.popup-subtag,
.popup-body,
.input-box,
.eye-toggle,
.btn-login,
.popup-divider,
.btn-register,
.popup-guide,
.step,
.popup-footer,

.top-ui,
.logo-box,
.logo-text,
.logo-sub,
.status-box,
.status-dot,
.status-text,

.slider-container,
.slider-track,
.slide,
.mobile-slide,
.mobile-frame,
.desktop-slide {

  -webkit-user-select: none !important;
  user-select: none !important;
}

/* MATIKAN NAVBAR BLOGGER (JIKA TEMA DI PASANG DI BLOGGSPOT) */
#navbar-iframe{
  display:none !important;
}