/* =========================================
   JAKSKY AUTH POLISH V4
   - eye button sama di light/dark
   - tab lebih terbaca
   - subtitle/link dark lebih jelas
========================================= */


/* =========================
   PASSWORD EYE
   PERMANEN DI SEMUA TEMA
========================= */

#userModal .authEyeBtn{
  position:absolute !important;
  right:10px !important;
  top:50% !important;

  transform:translateY(-50%) !important;

  width:42px !important;
  min-width:42px !important;

  height:42px !important;
  min-height:42px !important;

  padding:0 !important;
  margin:0 !important;

  display:grid !important;
  place-items:center !important;

  border-radius:50% !important;

  background:
    linear-gradient(
      145deg,
      #102d60,
      #091f47
    ) !important;

  border:
    1px solid rgba(83,190,255,.32) !important;

  color:#5ed0ff !important;
  -webkit-text-fill-color:#5ed0ff !important;

  box-shadow:
    0 5px 16px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.05)
    !important;

  opacity:1 !important;
}


/* icon SVG */
#userModal .authEyeBtn svg{
  width:21px !important;
  height:21px !important;

  color:#5ed0ff !important;
  stroke:#5ed0ff !important;
  fill:none !important;

  opacity:1 !important;

  filter:
    drop-shadow(
      0 0 4px rgba(78,195,255,.25)
    ) !important;
}

#userModal .authEyeBtn svg path,
#userModal .authEyeBtn svg circle,
#userModal .authEyeBtn svg line,
#userModal .authEyeBtn svg ellipse,
#userModal .authEyeBtn svg polyline{
  stroke:#5ed0ff !important;
}


/* ketika ditekan */
#userModal .authEyeBtn:active{
  transform:
    translateY(-50%)
    scale(.92) !important;

  background:#14376d !important;
}


/* ruang agar text password tidak nabrak eye */
#userModal .authPasswordWrap input{
  padding-right:58px !important;
}


/* =========================
   TAB MASUK / DAFTAR
========================= */

#userModal .jakAuthTabFinal{
  color:#b44e7b !important;
  -webkit-text-fill-color:#b44e7b !important;

  opacity:1 !important;

  font-weight:800 !important;
}

#userModal .jakAuthTabFinal.jakAuthTabActiveFinal{
  color:#d13d7a !important;
  -webkit-text-fill-color:#d13d7a !important;
}


/* dark mode tab */
html[data-jak-theme="dark"]
#userModal .jakAuthTabFinal{
  color:#d98bb0 !important;
  -webkit-text-fill-color:#d98bb0 !important;
}

html[data-jak-theme="dark"]
#userModal .jakAuthTabFinal.jakAuthTabActiveFinal{
  color:#ff66aa !important;
  -webkit-text-fill-color:#ff66aa !important;
}


/* =========================
   SUBTITLE LOGIN
========================= */

html[data-jak-theme="dark"]
#userModal .jakAuthSubtitleFinal{
  color:#b8c8df !important;
  -webkit-text-fill-color:#b8c8df !important;

  opacity:1 !important;
}


/* =========================
   LINK BAWAH
========================= */

#userModal .authV4Link,
#userModal .jakAuthBottomLinkFinal{
  opacity:1 !important;
}

html[data-jak-theme="dark"]
#userModal .authV4Link,

html[data-jak-theme="dark"]
#userModal .jakAuthBottomLinkFinal{
  color:#d585ac !important;
  -webkit-text-fill-color:#d585ac !important;
}


/* titik separator */
html[data-jak-theme="dark"]
#userModal .jakAuthSeparatorFinal{
  color:#b5c5dc !important;
  -webkit-text-fill-color:#b5c5dc !important;

  opacity:1 !important;
}


/* input tetap bersih */
html[data-jak-theme="dark"]
#userModal .authPasswordWrap input,

html[data-jak-theme="dark"]
#userModal input[type="text"],

html[data-jak-theme="dark"]
#userModal input[type="password"]{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;

  caret-color:#5ed0ff !important;
}


/* placeholder */
html[data-jak-theme="dark"]
#userModal input::placeholder{
  color:#8fa5c5 !important;
  -webkit-text-fill-color:#8fa5c5 !important;

  opacity:1 !important;
}
