/* hubbu Maana — marka renkleri, giriş sayfası ve ana sohbet ekranı tasarımı.
   Dockerfile bu dosyayı index.html'e ekler. Seçiciler LibreChat v0.8.8-rc3 yapısına göredir;
   LibreChat sürümü yükseltilirse bu dosya kontrol edilmeli.
   Logolar vektördür (uret_logo.py üretir), her boyutta keskin kalır.
   Marka renkleri: Brand Blue #0052E0, Cyan #00C6F7, Orange #FFB020, Pink #FF3B7A, Lacivert #0B1A4F. */

/* Logodaki yazı tipi: Montserrat ExtraBold (OFL), yalnızca Latin + Türkçe harfler (10 KB) */
@font-face {
  font-family: "hubbu Montserrat";
  src: url("montserrat-800.woff2?v=1") format("woff2");
  font-weight: 800;
  font-display: swap;
}

/* ---------- Renkler: LibreChat yeşili yerine marka mavisi ("R G B" biçiminde) ---------- */
html:root {
  --surface-submit: 0 82 224;
  --surface-submit-hover: 0 64 176;
  --accent-primary: 0 82 224;
  --accent-primary-hover: 0 64 176;
}
html.dark {
  --surface-submit: 0 82 224;
  --surface-submit-hover: 30 110 255;
  --accent-primary: 61 139 255;
  --accent-primary-hover: 0 198 247;
}

/* ---------- Giriş / kayıt sayfası: küçük logo yerine hubbu Maana logosu ---------- */
div:has(> img[src="assets/logo.svg"]) {
  height: 80px !important;       /* 2026-10-12: tüm girişlerde 112px "çok büyük" -> 80px (giriş standardı) */
  margin-top: 112px !important;  /* logo formun biraz üstünde dursun, ekranın en tepesinde değil */
  background: url("maana-logo-acik.svg?v=2") center / contain no-repeat;
}
html.dark div:has(> img[src="assets/logo.svg"]) {
  background-image: url("maana-logo-koyu.svg?v=2");
}
div:has(> img[src="assets/logo.svg"]) > img {
  visibility: hidden;
}

/* ---------- Ana sohbet ekranı (yeni sohbet karşılaması) ---------- */
/* Hafif marka ışıltısı: üstte mavi, sağ altta camgöbeği, sol altta turuncu/pembe dokunuş */
main[role="main"] {
  background:
    radial-gradient(900px 420px at 50% -8%, rgb(0 82 224 / 0.08), transparent 70%),
    radial-gradient(520px 360px at 100% 100%, rgb(0 198 247 / 0.09), transparent 70%),
    radial-gradient(420px 300px at 0% 100%, rgb(255 59 122 / 0.05), transparent 70%);
}
html.dark main[role="main"] {
  background:
    radial-gradient(900px 420px at 50% -8%, rgb(0 82 224 / 0.20), transparent 70%),
    radial-gradient(520px 360px at 100% 100%, rgb(0 198 247 / 0.10), transparent 70%),
    radial-gradient(420px 300px at 0% 100%, rgb(255 59 122 / 0.07), transparent 70%);
}

/* Karşılama yazısının üstünde küçük logo (2026-10-01: "çok büyük" geri bildirimi; 118px -> 44px) */
div.transform-gpu.flex-col.items-center.justify-center > div.flex.flex-col.items-center.gap-0.p-2::before {
  content: "";
  display: block;
  width: min(180px, 60vw);
  height: 44px;
  margin-bottom: 10px;
  background: url("maana-logo-acik.svg?v=2") center / contain no-repeat;
}
html.dark div.transform-gpu.flex-col.items-center.justify-center > div.flex.flex-col.items-center.gap-0.p-2::before {
  background-image: url("maana-logo-koyu.svg?v=2");
}
/* Karşılamadaki küçük robot simgesi gizlenir (büyük logoda simge zaten var) */
div.transform-gpu.flex-col.items-center.justify-center > div.flex.flex-col.items-center.gap-0.p-2 > div > div.relative.size-10 {
  display: none;
}

/* Sohbet kutusu: yazarken marka mavisi çerçeve */
div.rounded-3xl:has(#prompt-textarea) {
  transition: box-shadow 0.2s ease;
}
div.rounded-3xl:has(#prompt-textarea:focus) {
  box-shadow: 0 0 0 2px rgb(0 82 224 / 0.45), 0 8px 28px rgb(0 82 224 / 0.12);
}

/* Karşılama yazısında "Maana'ya" logodaki gibi renkli ("hubbu" kelimesi 2026-10-01'de cümleden çıkarıldı).
   LibreChat metni kelime kelime (span), her kelimeyi de harf harf (span) çizer; 1. kelime = "Maana'ya". */
div.transform-gpu p.split-parent > span:nth-child(1) > span {
  font-family: "hubbu Montserrat", system-ui, sans-serif;
  font-weight: 800;
  letter-spacing: -0.01em;
}
/* "Ma" lacivert, "ana" parlak mavi, "'ya" normal yazı rengi */
div.transform-gpu p.split-parent > span:nth-child(1) > span:nth-child(-n + 2) { color: #0E1B4D; }
div.transform-gpu p.split-parent > span:nth-child(1) > span:nth-child(n + 3):nth-child(-n + 5) { color: #004BFF; }
html.dark div.transform-gpu p.split-parent > span:nth-child(1) > span:nth-child(-n + 2) { color: #FFFFFF; }
html.dark div.transform-gpu p.split-parent > span:nth-child(1) > span:nth-child(n + 3):nth-child(-n + 5) { color: #3D7BFF; }

/* Giriş sayfası tek giriş bölümü (Keycloak, 2026-10-06): ayırıcıdaki "Or" (büyük harfle "OR") -> "veya",
   tek giriş butonu marka çerçeveli. Buton yazısı compose'taki OPENID_BUTTON_LABEL'dan gelir. */
div.relative.mt-6.uppercase:has(> div.absolute) { text-transform: none; }
div.relative.mt-6.uppercase > div.absolute { font-size: 0 !important; }
div.relative.mt-6.uppercase > div.absolute::after { content: "Yönetici girişi"; font-size: 12px; }
a[data-testid="openid"] {
  justify-content: center;
  border-width: 1.5px;
  font-weight: 600;
}
a[data-testid="openid"]:hover { border-color: #004BFF; }

/* Standart "Şirket hesabıyla giriş yap" butonu (2026-10-06; Knowledge/Gateway/Seeyr ile aynı ölçü ve renk, kilit simgesi) */
/* 2026-10-12 giriş sırası (kullanıcı): ana yol şirket hesabı -> mavi ve en üstte; yerel kullanıcı adı/şifre altta
   "Yönetici girişi" başlığıyla, ikincil (çerçeveli) düğme. Sıra yalnız CSS ile (flex order), LibreChat'e dokunulmaz. */
a[data-testid="openid"] {
  height: 48px; border-radius: 16px !important; border: 0 !important;
  background: #0052E0 !important; color: #ffffff !important; gap: 10px;
}
a[data-testid="openid"]:hover { background: #0047c4 !important; }
a[data-testid="openid"] img { content: url("sirket-giris.svg?v=1"); width: 22px; height: 22px; }
a[data-testid="openid"] p { font-size: 15px; font-weight: 600; }
div.w-authPageWidth:has(> form):has(a[data-testid="openid"]) { display: flex; flex-direction: column; }
div.w-authPageWidth:has(> form):has(a[data-testid="openid"]) > h1 { order: 1; }
div.w-authPageWidth:has(> form) > div:has(a[data-testid="openid"]) { order: 2; margin-top: 8px !important; }
div.w-authPageWidth:has(> form):has(a[data-testid="openid"]) > div.relative.mt-6 { order: 3; margin-top: 32px !important; }
div.w-authPageWidth:has(> form):has(a[data-testid="openid"]) > form { order: 4; margin-top: 28px !important; }
div.w-authPageWidth:has(> form):has(a[data-testid="openid"]) > div.mt-8:empty { display: none; }
div.w-authPageWidth:has(a[data-testid="openid"]) button[data-testid="login-button"] {
  font-size: 0 !important; background: #ffffff !important; border: 1.5px solid #c9d6ef !important; color: #0b3a8f !important;
}
div.w-authPageWidth:has(a[data-testid="openid"]) button[data-testid="login-button"]:hover { background: #f4f8ff !important; border-color: #0052d9 !important; }
div.w-authPageWidth:has(a[data-testid="openid"]) button[data-testid="login-button"]::after { content: "Giriş yap"; font-size: 15px; font-weight: 600; }
html.dark div.w-authPageWidth:has(a[data-testid="openid"]) button[data-testid="login-button"] {
  background: #1f2633 !important; border-color: #3a4a66 !important; color: #dbe6ff !important;
}
/* Tarayıcı kayıtlı e-postayı sayfa açılırken doldurunca etiket alanın içinde kalıp yazının üstüne biniyordu:
   otomatik doldurulmuş alanda etiket de yukarı çıkar */
div.w-authPageWidth input:-webkit-autofill + label { top: 0.375rem !important; transform: translateY(-1rem) scale(0.75) !important; }
/* Alan etiketleri ("E-posta adresi", "Şifre"): koyu temada beyaz, öbür giriş ekranlarıyla aynı (2026-10-13) */
html.dark div.w-authPageWidth form label { color: #ececec !important; }
/* Karşılama yazısı ("Maana'ya hoş geldiniz! ...") küçük */
div.transform-gpu p.split-parent { font-size: 1.35rem !important; line-height: 1.4 !important; }

/* Karttaki butonların sohbete yazdığı teknik mesaj (2026-10-12): LibreChat tıklamayı kullanıcı mesajı olarak gönderir
   ("The user clicked a button in an embedded UI Resource ..."). Bizim kartlarımız (hol-ai-seatunnel izin-mcp) bu mesaja
   boş bir #hubbu-ui-eylem bağlantısı ekler; yalnız EKRANDA gizlenir. Mesaj veritabanında ve Seeyr izinde kalır, model
   okumaya devam eder. Kural tutmazsa mesaj yalnız görünür olur (kozmetik). */
div:has(> .message-render a[href="#hubbu-ui-eylem"]),
.message-render:has(a[href="#hubbu-ui-eylem"]) { display: none !important; }

/* Kullanılmış onay kartı (2026-10-13): kart (iframe, yalnız allow-scripts) kararını sayfa yenilenince unutur ve tekrar
   tıklanabilir olurdu (sunucu ikinci onayı zaten reddediyor; bu yalnız görünüm). Kartın tıklaması sohbete gizli bir
   #hubbu-ui-eylem mesajı bırakır ve o mesaj kalıcıdır: kendisinden SONRA böyle bir mesaj gelen kart kilitlenir.
   rc3'te mesaj satırları kardeştir (MultiMessage alt satırları fragment olarak yan yana çizer). Yalnız bizim kartlar
   (srcdoc içinde hubbu-ui-eylem geçen iframe). Tıklama düşmüşse (gizli mesaj yoksa) kart açık kalır, doğru olan bu. */
main *:has(iframe[srcdoc*="hubbu-ui-eylem"]):has(~ * a[href="#hubbu-ui-eylem"]) iframe[srcdoc*="hubbu-ui-eylem"] {
  pointer-events: none !important; opacity: .5; filter: grayscale(1);
}