/* WhatsApp sohbet modülü (site) — köşe penceresi + tur düğmesi. Renkler panelden: --wa1 / --wa2 */
.twa { --wa-alt: 24px; position: fixed; right: 20px; bottom: calc(var(--wa-alt) + var(--wa-alt-ek, 0px) + env(safe-area-inset-bottom, 0px)); z-index: 85; display: none; flex-direction: column; align-items: flex-end; gap: 12px; font-family: inherit; }
.twa--sol { right: auto; left: 20px; align-items: flex-start; }
.twa.is-gorunur { display: flex; animation: wa-gir .35s ease both; }
@keyframes wa-gir { from { opacity: 0; transform: translateY(12px); } }
.twa__dugme { display: inline-flex; align-items: center; gap: 10px; min-height: 56px; padding: 0 18px 0 16px; border: 0; border-radius: 99px; cursor: pointer; color: #fff; font: 700 15px/1 inherit; font-family: inherit;
	background: linear-gradient(135deg, var(--wa1), var(--wa2)); box-shadow: 0 14px 30px -12px var(--wa2), 0 0 0 0 color-mix(in srgb, var(--wa1) 50%, transparent); transition: transform .2s; animation: wa-nabiz 2.6s ease-out 1.2s 3; }
.twa__dugme:hover { transform: translateY(-2px); } .twa__dugme svg { width: 26px; height: 26px; flex: none; } .twa__dugme:not(:has(span)) { width: 58px; padding: 0; justify-content: center; }
@keyframes wa-nabiz { 70% { box-shadow: 0 14px 30px -12px var(--wa2), 0 0 0 14px transparent; } }
.twa__pencere { width: min(340px, calc(100vw - 32px)); max-height: min(70vh, 560px); display: flex; flex-direction: column; border-radius: 20px; overflow: hidden; background: var(--yuzey, #fff); color: var(--metin, #0f172a); box-shadow: 0 24px 60px -20px rgba(0, 0, 0, .45); animation: wa-gir .25s ease both; }
.twa__bas { position: relative; display: grid; gap: 4px; padding: 18px 44px 18px 18px; color: #fff; background: linear-gradient(135deg, var(--wa1), var(--wa2)); }
.twa__bas b { font-size: 16px; } .twa__bas small { font-size: 13px; opacity: .92; line-height: 1.4; }
.twa__kapat { position: absolute; top: 10px; right: 10px; width: 30px; height: 30px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .2); color: #fff; font-size: 20px; line-height: 1; cursor: pointer; }
.twa__liste { overflow-y: auto; display: grid; }
.twa__kisi { display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px 16px; border: 0; border-top: 1px solid var(--cizgi, #e5e7eb); background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.twa__kisi:first-child { border-top: 0; } .twa__kisi:hover { background: color-mix(in srgb, var(--wa1) 8%, transparent); }
.twa__kisi > svg { width: 22px; height: 22px; color: var(--wa1); flex: none; margin-left: auto; }
.twa__foto { position: relative; width: 46px; height: 46px; border-radius: 50%; background: var(--wa1) center / cover no-repeat; color: #fff; display: grid; place-items: center; font-style: normal; font-weight: 800; flex: none; }
.twa__nokta { position: absolute; right: 0; bottom: 1px; width: 12px; height: 12px; border-radius: 50%; background: #22c55e; border: 2px solid var(--yuzey, #fff); } .twa__nokta.is-kapali { background: #94a3b8; }
.twa__yazi { display: grid; gap: 1px; min-width: 0; } .twa__yazi b { font-size: 14.5px; } .twa__yazi small { font-size: 12.5px; color: var(--metin-2, #64748b); }
.twa__durum { color: #16a34a !important; font-weight: 600; } .is-disarida .twa__durum { color: var(--metin-2, #64748b) !important; font-weight: 400; }
.twa__kvkk { margin: 0; padding: 10px 16px 14px; border-top: 1px solid var(--cizgi, #e5e7eb); font-size: 11.5px; line-height: 1.45; color: var(--metin-2, #64748b); } .twa__kvkk a { color: inherit; text-decoration: underline; }
.twa-tur { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border: 0; border-radius: 99px; cursor: pointer; color: #fff; font: 700 14px/1 inherit; font-family: inherit; background: linear-gradient(135deg, var(--wa1), var(--wa2)); box-shadow: 0 10px 22px -12px var(--wa2); }
.twa-tur svg { width: 20px; height: 20px; flex: none; } .twa-tur:hover { filter: brightness(1.05); }
@media (max-width: 1100px) {
	.twa { --wa-alt: 86px; right: 14px; } .twa--sol { left: 14px; }
	.twa__dugme { min-height: 52px; } .twa__dugme span { display: none; } .twa__dugme { width: 54px; padding: 0; justify-content: center; }
	body:has(.alt-rez) .twa { --wa-alt: 96px; }
}
@media (prefers-reduced-motion: reduce) { .twa, .twa__dugme, .twa__pencere { animation: none !important; } }
