/* ===== Yuksel Kontrol — Canlı Destek widget ===== */
.yk-chat { position: fixed; inset-inline-end: 22px; inset-block-end: 22px; z-index: 1080; font-size: 14px; }

.yk-chat-bubble {
    width: 58px; height: 58px; border-radius: 50%; border: 0; cursor: pointer;
    background: var(--brand, #062173); color: #fff; font-size: 1.6rem;
    box-shadow: 0 8px 24px rgba(6,33,115,.35); display: grid; place-items: center;
    transition: transform .15s, box-shadow .15s; margin-inline-start: auto;
}
.yk-chat-bubble:hover { transform: translateY(-2px); box-shadow: 0 12px 30px rgba(6,33,115,.45); }
.yk-chat-bubble.open { background: var(--brand-ink, #04165a); }

.yk-chat-panel {
    position: absolute; inset-block-end: 72px; inset-inline-end: 0;
    width: 350px; max-width: calc(100vw - 36px); height: 510px; max-height: calc(100vh - 120px);
    background: var(--surface-card, #fff); border-radius: 16px; overflow: hidden; display: flex; flex-direction: column;
    box-shadow: 0 18px 48px rgba(0,0,0,.22); border: 1px solid var(--line, #e6e8ef);
}

.yk-chat-head {
    background: var(--brand, #062173); color: #fff; padding: 14px 16px;
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
}
.yk-chat-title strong { display: block; font-size: 1.02rem; }
.yk-chat-sub { font-size: .8rem; opacity: .85; display: inline-flex; align-items: center; gap: 6px; }
.yk-chat-sub::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #ff6b6b; display: inline-block; }
.yk-chat-sub.is-online::before { background: #35d07f; }
.yk-chat-close { background: transparent; border: 0; color: #fff; font-size: 1rem; cursor: pointer; opacity: .85; }
.yk-chat-close:hover { opacity: 1; }

.yk-chat-body { flex: 1; overflow-y: auto; background: var(--bg-soft, #f5f7fb); }

.yk-msgs { padding: 14px; display: flex; flex-direction: column; gap: 10px; min-height: 100%; }
.yk-msg { max-width: 82%; }
.yk-msg .yk-bubble { padding: 9px 13px; border-radius: 14px; line-height: 1.45; word-wrap: break-word; }
.yk-msg .yk-meta { font-size: .68rem; color: var(--muted, #7a809a); margin-top: 3px; }
.yk-visitor { align-self: flex-end; text-align: end; }
.yk-visitor .yk-bubble { background: var(--brand, #062173); color: #fff; border-bottom-right-radius: 4px; }
.yk-agent { align-self: flex-start; }
.yk-agent .yk-bubble { background: var(--surface-card, #fff); border: 1px solid var(--line, #e6e8ef); border-bottom-left-radius: 4px; }
.yk-system { align-self: center; }
.yk-bubble-sys { background: #fff3cd; color: #6b5800; border-radius: 12px; padding: 6px 12px; font-size: .82rem; text-align: center; }

.yk-offline { padding: 16px; }
.yk-offline-msg { font-size: .9rem; color: var(--brand-ink, #04165a); margin-bottom: 12px; }
.yk-offline-form label { display: block; font-size: .82rem; font-weight: 600; color: var(--muted, #444); margin-bottom: 10px; }
.yk-offline-form .req { color: #dc3545; }
.yk-offline-form input[type=text], .yk-offline-form input[type=email], .yk-offline-form input[type=tel], .yk-offline-form textarea {
    width: 100%; margin-top: 4px; padding: 8px 10px; border: 1px solid var(--line, #e6e8ef);
    border-radius: 8px; font: inherit; font-weight: 400;
}
.yk-offline-form input:focus, .yk-offline-form textarea:focus { outline: none; border-color: var(--brand-2, #2647b0); box-shadow: 0 0 0 3px rgba(6,33,115,.1); }
.yk-kvkk { display: flex !important; align-items: flex-start; gap: 8px; font-weight: 400 !important; font-size: .8rem !important; }
.yk-kvkk input { margin-top: 3px; flex: 0 0 auto; }
.yk-kvkk a { color: var(--brand-2, #2647b0); }
.yk-btn-offline {
    width: 100%; border: 0; background: var(--brand, #062173); color: #fff; padding: 10px;
    border-radius: 8px; font-weight: 600; cursor: pointer; margin-top: 4px;
}
.yk-btn-offline:hover { background: var(--brand-ink, #04165a); }
.yk-offline-result { margin-top: 12px; padding: 10px 12px; border-radius: 8px; font-size: .85rem; }
.yk-offline-result.ok { background: #d1e7dd; color: #0f5132; }
.yk-offline-result.err { background: #f8d7da; color: #842029; }

.yk-chat-foot { border-top: 1px solid var(--line, #e6e8ef); background: var(--surface-card, #fff); padding: 8px; }
.yk-input-form { display: flex; gap: 8px; }
.yk-input { flex: 1; border: 1px solid var(--line, #e6e8ef); border-radius: 22px; padding: 9px 14px; font: inherit; }
.yk-input:focus { outline: none; border-color: var(--brand-2, #2647b0); }
.yk-input-send { border: 0; background: var(--brand, #062173); color: #fff; width: 40px; height: 40px; border-radius: 50%; cursor: pointer; flex: 0 0 auto; }
.yk-input-send:hover { background: var(--brand-ink, #04165a); }

/* Canlı-B: yazıyor, ek dosya, klips, puanlama */
.yk-typing { padding: 2px 14px 6px; font-size: .76rem; color: var(--muted, #7a809a); font-style: italic; }
.yk-att-img img { max-width: 200px; max-height: 160px; border-radius: 10px; display: block; margin-top: 4px; }
.yk-att-file { display: inline-flex; align-items: center; gap: 5px; margin-top: 4px; font-size: .82rem; text-decoration: none; color: inherit; }
.yk-visitor .yk-att-file { color: #fff; }
.yk-clip { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; cursor: pointer; color: var(--brand, #062173); flex: 0 0 auto; }
.yk-clip:hover { background: var(--bg-soft, #f5f7fb); }

.yk-rating { padding: 16px; text-align: center; }
.yk-rating-q { font-weight: 600; color: var(--brand-ink, #04165a); margin-bottom: 8px; }
.yk-stars { display: flex; justify-content: center; gap: 4px; margin-bottom: 10px; }
.yk-stars button { border: 0; background: transparent; font-size: 1.8rem; line-height: 1; color: #d6d9e3; cursor: pointer; padding: 0; }
.yk-stars button.on { color: #ffc107; }
.yk-rating-c { width: 100%; border: 1px solid var(--line, #e6e8ef); border-radius: 8px; padding: 8px; font: inherit; margin-bottom: 8px; }
.yk-rating-send { border: 0; background: var(--brand, #062173); color: #fff; border-radius: 8px; padding: 8px 16px; font-weight: 600; cursor: pointer; }
.yk-rating-done { margin-top: 10px; color: #0f5132; font-weight: 600; }

@media (max-width: 480px) {
    .yk-chat-panel { width: calc(100vw - 24px); height: calc(100vh - 110px); inset-inline-end: -6px; }
}
/* FAZ E — koyu tema: panel içi form alanları yüzey tokenlarını izler */
.yk-offline-form input[type=text], .yk-offline-form input[type=email], .yk-offline-form input[type=tel],
.yk-offline-form textarea, .yk-input, .yk-rating-c { background: var(--surface-card, #fff); color: var(--ink, #1b2335); }
[data-theme="dark"] .yk-bubble-sys { background: #3a3312; color: #ffe08a; }