/* AyChat.org - Kullanıcı Renk Ayarları + Okey Girişi */
:root{
  --aychat-c1:#fb7185;
  --aychat-c2:#a855f7;
  --aychat-c3:#facc15;
  --aychat-bg:#fff1fb;
  --aychat-soft:rgba(255,255,255,.88);
}

html,body{
  background:
    radial-gradient(circle at 12% 8%, color-mix(in srgb, var(--aychat-c3) 34%, transparent), transparent 36%),
    radial-gradient(circle at 88% 18%, color-mix(in srgb, var(--aychat-c1) 30%, transparent), transparent 42%),
    radial-gradient(circle at 52% 96%, color-mix(in srgb, var(--aychat-c2) 28%, transparent), transparent 48%),
    linear-gradient(145deg,var(--aychat-bg),#ffffff) !important;
}

.header{
  background:linear-gradient(120deg,#fff,var(--aychat-bg),color-mix(in srgb,var(--aychat-c2) 16%,#fff)) !important;
  border-color:color-mix(in srgb,var(--aychat-c1) 42%,transparent) !important;
  box-shadow:0 18px 46px color-mix(in srgb,var(--aychat-c1) 20%,transparent) !important;
}

.header .topbar-center{
  gap:8px;
  flex-wrap:wrap;
}
.header .room-pill{
  text-decoration:none;
  border:1px solid color-mix(in srgb,var(--aychat-c1) 32%,transparent) !important;
  box-shadow:0 8px 20px rgba(15,23,42,.08);
  transition:transform .16s ease, filter .16s ease, box-shadow .16s ease;
}
.header .room-pill:hover{
  transform:translateY(-2px);
  filter:saturate(1.12) brightness(1.02);
  box-shadow:0 12px 28px color-mix(in srgb,var(--aychat-c2) 20%,transparent);
}
.header .okeygiris{
  background:linear-gradient(135deg,#16a34a,#22c55e,#bef264) !important;
  color:#052e16 !important;
  font-weight:900;
  position:relative;
  overflow:hidden;
}
.header .okeygiris::after{
  content:"";
  position:absolute;
  inset:-60% -20%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);
  transform:translateX(-80%) rotate(25deg);
  animation:aychatShine 2.8s ease-in-out infinite;
}
.header .okeygiris span,.header .okeygiris i{position:relative;z-index:1;}
.header .renkayarbtn{
  background:linear-gradient(135deg,var(--aychat-c3),var(--aychat-c1),var(--aychat-c2)) !important;
  color:#fff !important;
  font-weight:900;
  border:none !important;
  cursor:pointer;
}
@keyframes aychatShine{
  0%,35%{transform:translateX(-90%) rotate(25deg);opacity:.2;}
  55%{opacity:.85;}
  100%{transform:translateX(105%) rotate(25deg);opacity:.1;}
}

.logo-mark,.brand-dot,.cta,.pencereler .kanallar .kactive,.pencereler .ozeller .oactive,.topicbolum .baslik b{
  background:linear-gradient(135deg,var(--aychat-c3),var(--aychat-c1),var(--aychat-c2)) !important;
}
.cta{
  box-shadow:0 20px 52px color-mix(in srgb,var(--aychat-c1) 38%,transparent),0 0 0 1px rgba(255,255,255,.36) inset !important;
}
.input:focus-within{
  border-color:color-mix(in srgb,var(--aychat-c1) 65%,transparent) !important;
  box-shadow:0 0 0 5px color-mix(in srgb,var(--aychat-c1) 18%,transparent) !important;
}
.input i{color:var(--aychat-c2) !important;}

.login-hero{
  background:
    radial-gradient(circle at 18% 18%, color-mix(in srgb,var(--aychat-c3) 68%,transparent), transparent 34%),
    radial-gradient(circle at 85% 22%, color-mix(in srgb,var(--aychat-c1) 70%,transparent), transparent 40%),
    radial-gradient(circle at 56% 92%, color-mix(in srgb,var(--aychat-c2) 60%,transparent), transparent 50%),
    linear-gradient(135deg,color-mix(in srgb,var(--aychat-c2) 70%,#111827),color-mix(in srgb,var(--aychat-c1) 72%,#111827),#f97316) !important;
}
.solbar,.pencereler,.nickler,.msg,.editor,.emojibar,.jconfirm .jconfirm-box{
  background:
    radial-gradient(circle at top left,color-mix(in srgb,var(--aychat-c3) 20%,transparent),transparent 48%),
    radial-gradient(circle at bottom right,color-mix(in srgb,var(--aychat-c1) 17%,transparent),transparent 52%),
    rgba(255,255,255,.98) !important;
  border-color:color-mix(in srgb,var(--aychat-c1) 28%,transparent) !important;
}
.kayanyazi,.topicbolum{
  background:linear-gradient(90deg,color-mix(in srgb,var(--aychat-c3) 22%,#fff),var(--aychat-bg),color-mix(in srgb,var(--aychat-c2) 18%,#fff)) !important;
  border-color:color-mix(in srgb,var(--aychat-c1) 28%,transparent) !important;
}
.kayanyazi::before,.kayanyazi::after{
  background:linear-gradient(90deg,var(--aychat-c3),var(--aychat-c1),var(--aychat-c2),#38bdf8,var(--aychat-c3)) !important;
}

.aychat-renk-panel{
  position:fixed;
  inset:0;
  z-index:999999;
  display:none;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(15,23,42,.42);
  backdrop-filter:blur(10px);
}
.aychat-renk-panel.active{display:flex;}
.aychat-renk-card{
  width:min(460px,96vw);
  border-radius:26px;
  padding:18px;
  color:#111827;
  background:
    radial-gradient(circle at 10% 10%,color-mix(in srgb,var(--aychat-c3) 26%,transparent),transparent 45%),
    radial-gradient(circle at 88% 20%,color-mix(in srgb,var(--aychat-c1) 22%,transparent),transparent 45%),
    linear-gradient(135deg,rgba(255,255,255,.96),color-mix(in srgb,var(--aychat-bg) 70%,#fff));
  border:1px solid color-mix(in srgb,var(--aychat-c1) 28%,transparent);
  box-shadow:0 28px 80px rgba(15,23,42,.28);
}
.aychat-renk-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-bottom:14px;
}
.aychat-renk-head strong{display:block;font-size:20px;}
.aychat-renk-head span{display:block;font-size:12px;color:#64748b;margin-top:3px;}
.aychat-renk-head button{
  width:38px;height:38px;border:0;border-radius:14px;background:#fff;color:#be123c;cursor:pointer;
  box-shadow:0 8px 18px rgba(15,23,42,.10);
}
.aychat-presets{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:14px;}
.aychat-presets button,.aychat-renk-actions button{
  border:0;
  border-radius:14px;
  padding:10px 8px;
  font-weight:800;
  cursor:pointer;
}
.aychat-presets button{
  background:linear-gradient(135deg,var(--aychat-c3),var(--aychat-c1),var(--aychat-c2));
  color:#fff;
  font-size:12px;
}
.aychat-renk-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.aychat-renk-grid label{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  border-radius:16px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(148,163,184,.24);
  font-size:13px;
  font-weight:700;
}
.aychat-renk-grid input[type="color"]{
  width:44px;height:34px;border:0;border-radius:10px;background:transparent;cursor:pointer;
}
.aychat-preview{
  display:flex;align-items:center;gap:12px;margin:14px 0;padding:14px;border-radius:18px;
  background:linear-gradient(135deg,var(--aychat-c3),var(--aychat-c1),var(--aychat-c2));
  color:#fff;
  box-shadow:0 16px 36px color-mix(in srgb,var(--aychat-c1) 25%,transparent);
}
.aychat-preview-logo{
  width:52px;height:52px;border-radius:18px;display:grid;place-items:center;background:rgba(255,255,255,.22);font-size:24px;font-weight:900;
}
.aychat-preview p{margin:4px 0 0;font-size:12px;opacity:.9;}
.aychat-renk-actions{display:flex;gap:10px;justify-content:flex-end;}
.aychat-renk-actions button:first-child{background:#fff;color:#475569;}
.aychat-renk-actions button:last-child{background:#111827;color:#fff;}

@media(max-width:760px){
  .header .topbar-center{display:flex;overflow-x:auto;max-width:calc(100vw - 20px);padding-bottom:4px;}
  .header .room-pill{white-space:nowrap;}
  .aychat-presets{grid-template-columns:1fr 1fr;}
  .aychat-renk-grid{grid-template-columns:1fr;}
}