/**************************
WynGPT - custom.css (final optimized + enlarged settings popup)
***************************/

/* === Voice mode button: gradient + blur + glow === */
[aria-label="Voice mode"] {
  background: linear-gradient(135deg,#ffffff,#cceeff,#99ddff,#66ccff,#33ccff,#00ccff);
  background-size: 600% 600%;
  animation: blendShift 16s ease-in-out infinite;
  color: #fff; border: none;
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 0 20px rgba(0,204,255,.4),0 0 40px rgba(0,204,255,.3),0 0 60px rgba(0,204,255,.2);
  transition: .3s; position: relative; z-index: 1;
}
@keyframes blendShift {
  0% { background-position: 0% 50% }
  50% { background-position: 100% 50% }
  100% { background-position: 0% 50% }
}

/* === Tooltip (Tippy) blur === */
.tippy-box {
  background: rgba(255,255,255,.5) !important;
  backdrop-filter: blur(10px) !important; -webkit-backdrop-filter: blur(10px) !important;
  color: #000 !important; border: 1px solid rgba(0,0,0,.1) !important;
}
html.dark .tippy-box, :root.dark .tippy-box {
  background: rgba(0,0,0,.5) !important;
  backdrop-filter: blur(10px) !important; -webkit-backdrop-filter: blur(10px) !important;
  color: #fff !important; border: 1px solid rgba(255,255,255,.1) !important;
  /* Ẩn text cũ "WynGPT (Open WebUI)" và "Open WebUI" */
#sidebar-webui-name,
[title="WynGPT (Open WebUI)"],
[content="WynGPT (Open WebUI)"],
[title="Open WebUI"],
[content="Open WebUI"] {
  color: transparent !important;  /* Ẩn text gốc */
  position: relative;
}

/* Hiển thị lại chữ "WynGPT" */
#sidebar-webui-name::after,
[title="WynGPT (Open WebUI)"]::after,
[content="WynGPT (Open WebUI)"]::after,
[title="Open WebUI"]::after,
[content="Open WebUI"]::after {
  content: "WynGPT";
  color: inherit;
  position: absolute;
  left: 0;
  top: 0;
}

/* Nếu muốn thay cả trong thẻ <title> hiển thị ở tab trình duyệt */
head > title::after {
  content: "WynGPT";
}