
.han-hi-wrap,
.han-hi-wrap *{box-sizing:border-box}
.han-hi-wrap{
  --han-hi-bar-bg:#ffffff;
  --han-hi-icon-color:#202028;
  --han-hi-text-color:#202028;
  --han-hi-border:#e6dff1;
  --han-hi-accent:#7f45ff;
  --han-hi-panel-bg:#ffffff;
  --han-hi-panel-text:#202028;
  position:fixed;
  right:16px;
  bottom:18px;
  z-index:99990;
  font-family:Inter, Arial, sans-serif;
}
.han-hi-bar{
  display:flex;
  flex-direction:column;
  gap:10px;
  align-items:flex-end;
}
.han-hi-item{
  width:56px;
  height:56px;
  border-radius:18px;
  border:1px solid var(--han-hi-border);
  background:var(--han-hi-bar-bg);
  color:var(--han-hi-icon-color);
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  box-shadow:0 12px 30px rgba(44,26,82,.10);
  transition:all .28s ease;
  cursor:pointer;
}
.han-hi-item:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 34px rgba(44,26,82,.16);
}
.han-hi-icon svg,
.han-hi-social-icon svg{
  width:24px;
  height:24px;
  display:block;
}
.han-hi-social-trigger{
  width:56px;
  height:120px;
  padding:10px 0;
}
.han-hi-social-text{
  writing-mode:vertical-rl;
  text-orientation:mixed;
  transform:rotate(180deg);
  font-size:13px;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--han-hi-text-color);
}
.han-hi-overlay{
  position:fixed;
  inset:0;
  background:rgba(18,15,32,.55);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:all .3s ease;
}
.han-hi-panel{
  position:fixed;
  right:88px;
  bottom:18px;
  width:260px;
  background:var(--han-hi-panel-bg);
  color:var(--han-hi-panel-text);
  border:1px solid var(--han-hi-border);
  border-radius:22px;
  padding:18px;
  box-shadow:0 18px 40px rgba(31,19,58,.16);
  opacity:0;
  visibility:hidden;
  transform:translateX(16px);
  transition:all .3s ease;
}
.han-hi-wrap.is-open .han-hi-overlay{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.han-hi-wrap.is-open .han-hi-panel{
  opacity:1;
  visibility:visible;
  transform:translateX(0);
}
.han-hi-panel-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:14px;
}
.han-hi-panel-title{
  color:var(--han-hi-panel-text);
  font-size:18px;
  font-weight:800;
}
.han-hi-close{
  border:0;
  background:transparent;
  color:var(--han-hi-accent);
  font-size:24px;
  line-height:1;
  cursor:pointer;
}
.han-hi-social-list{
  display:grid;
  gap:10px;
}
.han-hi-social-link{
  display:flex;
  align-items:center;
  gap:12px;
  min-height:52px;
  padding:12px 14px;
  border-radius:16px;
  background:#faf8ff;
  border:1px solid #ece6f7;
  color:var(--han-hi-panel-text);
  text-decoration:none;
  font-size:14px;
  font-weight:800;
  transition:all .25s ease;
}
.han-hi-social-link:hover{
  background:#f1eaff;
  transform:translateX(3px);
}
.han-hi-social-icon{
  color:var(--han-hi-accent);
  flex:0 0 auto;
}
.han-hi-admin-wrap .han-hi-admin-card{
  background:#fff;
  border:1px solid #e6dff1;
  border-radius:18px;
  padding:18px;
  max-width:900px;
}
@media (max-width: 767px){
  .han-hi-wrap{
    right:12px;
    bottom:12px;
  }
  .han-hi-item{
    width:52px;
    height:52px;
    border-radius:16px;
  }
  .han-hi-social-trigger{
    height:112px;
  }
  .han-hi-panel{
    right:76px;
    bottom:12px;
    width:220px;
    padding:14px;
  }
}

.han-hi-icon i,
.han-hi-social-icon i{
  font-size:24px;
  line-height:1;
  display:block;
}
.han-hi-social-icon{
  width:22px;
  text-align:center;
}

.han-hi-wrap{
  --han-hi-social-bg:#ffffff;
  --han-hi-scroll-bg:#ffffff;
}
.han-hi-social-trigger{
  background:var(--han-hi-social-bg);
}
.han-hi-scroll-top{
  background:var(--han-hi-scroll-bg);
}

/* Global tema renklerinden etkilenmesin */
.han-hi-wrap .han-hi-item,
.han-hi-wrap .han-hi-item:hover,
.han-hi-wrap .han-hi-item:focus,
.han-hi-wrap .han-hi-item:active,
.han-hi-wrap .han-hi-social-trigger,
.han-hi-wrap .han-hi-social-trigger:hover,
.han-hi-wrap .han-hi-scroll-top,
.han-hi-wrap .han-hi-scroll-top:hover{
  background: var(--han-hi-bar-bg) !important;
  color: var(--han-hi-icon-color) !important;
  border-color: var(--han-hi-border) !important;
}
.han-hi-wrap .han-hi-social-trigger,
.han-hi-wrap .han-hi-social-trigger:hover,
.han-hi-wrap .han-hi-social-trigger:focus,
.han-hi-wrap .han-hi-social-trigger:active{
  background: var(--han-hi-social-bg) !important;
  color: var(--han-hi-text-color) !important;
}
.han-hi-wrap .han-hi-scroll-top,
.han-hi-wrap .han-hi-scroll-top:hover,
.han-hi-wrap .han-hi-scroll-top:focus,
.han-hi-wrap .han-hi-scroll-top:active{
  background: var(--han-hi-scroll-bg) !important;
  color: var(--han-hi-icon-color) !important;
}
.han-hi-wrap .han-hi-social-text,
.han-hi-wrap .han-hi-social-text:hover{
  color: var(--han-hi-text-color) !important;
}
.han-hi-wrap .han-hi-icon,
.han-hi-wrap .han-hi-icon i,
.han-hi-wrap .han-hi-icon svg,
.han-hi-wrap .han-hi-social-icon,
.han-hi-wrap .han-hi-social-icon i{
  color: inherit !important;
  fill: currentColor !important;
}
.han-hi-wrap .han-hi-social-link,
.han-hi-wrap .han-hi-social-link:hover,
.han-hi-wrap .han-hi-social-link:focus,
.han-hi-wrap .han-hi-social-link:active{
  background:#faf8ff !important;
  color:var(--han-hi-panel-text) !important;
  border-color:#ece6f7 !important;
}
.han-hi-wrap .han-hi-social-link:hover{
  background:#f1eaff !important;
}
.han-hi-wrap .han-hi-close,
.han-hi-wrap .han-hi-close:hover,
.han-hi-wrap .han-hi-close:focus{
  color: var(--han-hi-accent) !important;
}
