/* ======================================================================
   MODULE — AI LIVE CHAT WIDGET / PHASE 3 PREMIUM UI
   Prefix: .m-chat
   Goal: Tema uyumlu, lead-machine hazır, premium chat deneyimi.
   ====================================================================== */

:root {
    --m-chat-primary: var(--primary, #e85d04);
    --m-chat-primary-dark: color-mix(in srgb, var(--m-chat-primary) 82%, #111827);
    --m-chat-primary-soft: color-mix(in srgb, var(--m-chat-primary) 12%, #fff);
    --m-chat-primary-glow: color-mix(in srgb, var(--m-chat-primary) 38%, transparent);
    --m-chat-bg: var(--bg-page, #f7f4ef);
    --m-chat-card: var(--bg-card, #fff);
    --m-chat-text: var(--text, #171717);
    --m-chat-muted: var(--text-muted, #737373);
    --m-chat-border: var(--border, rgba(0, 0, 0, .08));
    --m-chat-radius: 28px;
    --m-chat-shadow: 0 26px 80px rgba(17, 24, 39, .24);
}

/* Widget izolasyonu: tema gövdesini, section gridlerini ve body akışını bozmasın. */
.m-chat-overlay,
.m-chat-panel-inner,
.m-chat-fab,
.m-chat-tooltip {
    box-sizing: border-box;
}
.m-chat-overlay *,
.m-chat-panel-inner *,
.m-chat-fab *,
.m-chat-tooltip * {
    box-sizing: border-box;
}

/* ─────────── Floating Action Button ─────────── */
.m-chat-fab {
    position: fixed;
    bottom: calc(var(--sp-5, 20px) + env(safe-area-inset-bottom, 0px));
    inset-inline-end: var(--sp-5, 20px);
    width: 64px;
    height: 64px;
    border-radius: 24px;
    border: 1px solid rgba(255, 255, 255, .28);
    background:
        radial-gradient(circle at 28% 18%, rgba(255,255,255,.55), transparent 28%),
        linear-gradient(135deg, var(--m-chat-primary) 0%, var(--m-chat-primary-dark) 100%);
    color: #fff;
    cursor: pointer;
    box-shadow:
        0 18px 44px var(--m-chat-primary-glow),
        0 8px 18px rgba(0, 0, 0, .18);
    z-index: var(--z-sticky, 200);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition:
        transform .22s cubic-bezier(.16, 1, .3, 1),
        box-shadow .22s cubic-bezier(.16, 1, .3, 1),
        bottom .28s cubic-bezier(.16, 1, .3, 1),
        border-radius .22s ease;
}
body.btt-visible .m-chat-fab {
    bottom: calc(var(--sp-5, 20px) + 56px + 10px + env(safe-area-inset-bottom, 0px));
}
.m-chat-fab[hidden] { display: none; }
.m-chat-fab:hover {
    transform: translateY(-3px) scale(1.045);
    border-radius: 28px;
    box-shadow:
        0 24px 60px color-mix(in srgb, var(--m-chat-primary) 48%, transparent),
        0 10px 24px rgba(0,0,0,.22);
}
.m-chat-fab:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--m-chat-primary) 42%, #fff);
    outline-offset: 4px;
}
.m-chat-fab-icon { display: inline-flex; align-items:center; justify-content:center; position: relative; z-index: 2; }
.m-chat-fab-icon[hidden] { display: none; }
.m-chat-fab-icon svg { width: 27px; height: 27px; filter: drop-shadow(0 2px 4px rgba(0,0,0,.16)); }
.m-chat-fab-icon img { width: 36px; height: 36px; border-radius: 16px; object-fit: cover; display:block; }
.m-chat-fab-ai-badge {
    /* 🎯 Notification-style badge — FAB'in sağ-üst köşesinde küçük rozet (FAB ikonunu kapatmaz) */
    position: absolute;
    top: -6px;
    right: -6px;
    inset-inline-end: -6px;
    inset-inline-start: auto;
    left: auto;
    transform: none;
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: .03em;
    color: #b45309;
    background: #fff;
    border: 2px solid #f59e0b;
    box-shadow: 0 4px 10px rgba(245, 158, 11, 0.35);
    z-index: 3;
    pointer-events: none;
}
.m-chat-fab-pulse {
    position:absolute;
    inset: -3px;
    border-radius: 26px;
    border: 2px solid color-mix(in srgb, var(--m-chat-primary) 65%, #fff);
    opacity: 0;
    animation: m-chat-pulse 2.6s ease-out infinite;
    pointer-events:none;
}
.m-chat-fab.is-open { display:inline-flex; z-index: calc(var(--z-modal, 400) + 2); transform: scale(.92); }
.m-chat-fab.is-open .m-chat-fab-pulse { display:none; }
body.m-chat-open { overflow: hidden; }
@keyframes m-chat-pulse {
    0% { opacity: .55; transform: scale(.98); }
    100% { opacity: 0; transform: scale(1.48); }
}

/* Tooltip */
.m-chat-tooltip {
    position: fixed;
    bottom: calc(var(--sp-5, 20px) + 78px + env(safe-area-inset-bottom, 0px));
    inset-inline-end: var(--sp-5, 20px);
    max-width: 250px;
    padding: 11px 14px;
    border-radius: 18px 18px 6px 18px;
    background: rgba(255,255,255,.94);
    color: var(--m-chat-text);
    border: 1px solid rgba(255,255,255,.65);
    box-shadow: 0 18px 50px rgba(17,24,39,.16);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
    z-index: calc(var(--z-sticky, 200) + 1);
    animation: m-chat-pop .28s cubic-bezier(.16,1,.3,1);
}
.m-chat-tooltip::after {
    content: '';
    position:absolute;
    bottom: -7px;
    inset-inline-end: 20px;
    width: 14px;
    height: 14px;
    background: rgba(255,255,255,.94);
    border-inline-end: 1px solid rgba(255,255,255,.65);
    border-bottom: 1px solid rgba(255,255,255,.65);
    transform: rotate(45deg);
}
.m-chat-tooltip[hidden] { display:none; }
body.btt-visible .m-chat-tooltip { bottom: calc(var(--sp-5, 20px) + 56px + 86px + env(safe-area-inset-bottom, 0px)); }

/* ─────────── Overlay / Panel ─────────── */
.m-chat-overlay {
    position: fixed;
    inset: 0;
    z-index: var(--z-modal, 400);
    display: flex;
    flex-direction: column;
    background:
        radial-gradient(circle at 80% 0%, color-mix(in srgb, var(--m-chat-primary) 18%, transparent), transparent 34%),
        linear-gradient(180deg, color-mix(in srgb, var(--m-chat-primary) 9%, #fff), #fff 44%);
    animation: m-chat-fade .2s ease-out;
}
.m-chat-overlay[hidden] { display:none; }
@keyframes m-chat-fade { from {opacity:0;} to {opacity:1;} }
@keyframes m-chat-pop { from {opacity:0; transform: translateY(8px) scale(.98);} to {opacity:1; transform: translateY(0) scale(1);} }

.m-chat-panel-inner {
    position: relative;
    width: 100%;
    height: 100%;
    background: var(--m-chat-card);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    isolation: isolate;
    animation: m-chat-slide .3s cubic-bezier(.16,1,.3,1);
}

/* 📱 MOBILE: Chat panel FULL SCREEN — viewport tam kaplasın (address bar safe)
 * NOT: #m-chat-panel ID selector + !important = MAX specificity, hiçbir kural ezemez */
@media (max-width: 639px) {
    #m-chat-panel.m-chat-overlay,
    #m-chat-panel {
        position: fixed !important;
        inset: 0 !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        width: 100vw !important;
        height: 100vh !important;
        height: 100dvh !important;
        max-width: 100vw !important;
        max-height: 100dvh !important;
        min-width: 100vw !important;
        pointer-events: auto !important;
        align-items: stretch !important;
        justify-content: flex-start !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        transform: none !important;
    }
    #m-chat-panel .m-chat-panel-inner {
        width: 100% !important;
        height: 100% !important;
        height: 100dvh !important;
        max-width: 100% !important;
        max-height: 100dvh !important;
        min-height: 100dvh !important;
        min-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        border-radius: 0 !important;
        border: none !important;
        box-shadow: none !important;
        flex: 1 1 100% !important;
        transform: none !important;
        inset: 0 !important;
    }
}
.m-chat-panel-inner::before {
    content:'';
    position:absolute;
    inset:0 0 auto 0;
    height: 170px;
    background:
        radial-gradient(circle at 14% 12%, rgba(255,255,255,.28), transparent 30%),
        radial-gradient(circle at 92% 4%, rgba(255,255,255,.20), transparent 28%),
        linear-gradient(135deg, var(--m-chat-primary), var(--m-chat-primary-dark));
    z-index: -1;
}
@keyframes m-chat-slide { from { opacity:0; transform: translateY(12px); } to { opacity:1; transform: translateY(0); } }

@media (min-width: 640px) {
    .m-chat-overlay {
        background: transparent;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        align-items: flex-end;
        justify-content: flex-end;
        padding: 0;
        pointer-events: none;
        inset: auto 0 0 auto;
        width: auto;
        height: auto;
    }
    .m-chat-panel-inner {
        pointer-events: auto;
        width: 430px;
        max-width: calc(100vw - 28px);
        height: 690px;
        max-height: calc(100vh - 116px);
        border-radius: var(--m-chat-radius);
        border: 1px solid rgba(255,255,255,.72);
        box-shadow: var(--m-chat-shadow);
        margin: 0 var(--sp-5, 20px) calc(var(--sp-5, 20px) + 64px + 14px) var(--sp-5, 20px);
        animation: m-chat-desktop .3s cubic-bezier(.16,1,.3,1);
    }
    @keyframes m-chat-desktop { from { opacity:0; transform: translateY(16px) scale(.97); } to { opacity:1; transform: translateY(0) scale(1); } }
    body.m-chat-open { overflow: auto !important; }
    body.btt-visible .m-chat-panel-inner { margin-bottom: calc(var(--sp-5, 20px) + 64px + 56px + 22px); }
}

/* ─────────── Header ─────────── */
.m-chat-header {
    display:flex;
    align-items:center;
    gap: 12px;
    padding: 18px 18px 16px;
    background:
        radial-gradient(circle at 8% 10%, rgba(255,255,255,.22), transparent 30%),
        linear-gradient(135deg, var(--m-chat-primary) 0%, var(--m-chat-primary-dark) 100%);
    color:#fff;
    flex-shrink:0;
    position: relative;
    overflow:hidden;
}
.m-chat-header::after {
    content:'';
    position:absolute;
    width: 170px;
    height: 170px;
    border-radius: 50%;
    right: -70px;
    top: -88px;
    background: rgba(255,255,255,.13);
    pointer-events:none;
}
.m-chat-header-avatar {
    width: 48px;
    height: 48px;
    border-radius: 18px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.22);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    overflow:hidden;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 10px 26px rgba(0,0,0,.14);
    position: relative;
    z-index: 1;
}
.m-chat-header-avatar svg { width: 25px; height: 25px; }
.m-chat-header-avatar img { width:100%; height:100%; object-fit:cover; display:block; border-radius:inherit; }
.m-chat-header-avatar.has-image { background: rgba(255,255,255,.18); }
.m-chat-header-text { flex:1; min-width:0; line-height:1.18; position:relative; z-index:1; }
.m-chat-header-kicker {
    display:block;
    font-size: 10.5px;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: rgba(255,255,255,.78);
    margin-bottom: 3px;
}
.m-chat-bot-name {
    display:block;
    font-size: 16px;
    font-weight: 900;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.m-chat-status {
    display:inline-flex;
    align-items:center;
    gap: 7px;
    margin-top: 5px;
    padding: 4px 8px;
    border-radius: 999px;
    background: rgba(255,255,255,.13);
    font-size: 11px;
    font-weight: 700;
    color: rgba(255,255,255,.92);
}
.m-chat-status-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #22c55e;
    box-shadow: 0 0 0 4px rgba(34,197,94,.16), 0 0 12px rgba(34,197,94,.9);
}
.m-chat-close,
.m-chat-clear {
    width: 36px;
    height: 36px;
    border: 1px solid rgba(255,255,255,.18);
    background: rgba(255,255,255,.12);
    color:#fff;
    border-radius: 14px;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    transition: transform .15s ease, background .15s ease;
    position:relative;
    z-index:1;
}
.m-chat-close:hover,
.m-chat-clear:hover { background: rgba(255,255,255,.22); transform: translateY(-1px); }
.m-chat-close svg,
.m-chat-clear svg { width: 17px; height: 17px; }
.m-chat-clear[hidden] { display:none; }

/* ─────────── Messages ─────────── */
.m-chat-messages {
    flex:1;
    overflow-y:auto;
    padding: 18px clamp(14px, 4vw, 24px);
    display:flex;
    flex-direction:column;
    gap: 11px;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--m-chat-primary) 8%, #fff) 0%, var(--m-chat-bg) 130px),
        var(--m-chat-bg);
    scroll-behavior:smooth;
}
.m-chat-messages::-webkit-scrollbar { width: 9px; }
.m-chat-messages::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--m-chat-primary) 26%, #c7c7c7); border-radius:999px; border: 2px solid transparent; background-clip: padding-box; }
.m-chat-messages > * { max-width: 760px; width:100%; margin-inline:auto; }
.m-chat-msg {
    max-width: 84% !important;
    width:auto !important;
    margin-inline:0 !important;
    padding: 12px 14px;
    border-radius: 20px;
    font-size: 14px;
    line-height: 1.52;
    word-wrap: break-word;
    overflow-wrap:anywhere;
    animation: m-chat-msg-in .22s ease-out;
}
@keyframes m-chat-msg-in { from {opacity:0; transform: translateY(6px);} to {opacity:1; transform: translateY(0);} }
.m-chat-msg-user {
    align-self:flex-end;
    margin-inline-start:auto !important;
    color:#fff;
    background:
        radial-gradient(circle at 82% 10%, rgba(255,255,255,.28), transparent 24%),
        linear-gradient(135deg, var(--m-chat-primary), var(--m-chat-primary-dark));
    border: 1px solid color-mix(in srgb, var(--m-chat-primary) 64%, #fff);
    border-top-right-radius: 7px;
    box-shadow: 0 10px 24px color-mix(in srgb, var(--m-chat-primary) 22%, transparent);
}
.m-chat-msg-bot {
    align-self:flex-start;
    margin-inline-end:auto !important;
    background: rgba(255,255,255,.94);
    color: var(--m-chat-text);
    border: 1px solid rgba(255,255,255,.74);
    border-top-left-radius: 7px;
    box-shadow: 0 10px 28px rgba(17,24,39,.07);
}
.m-chat-msg-bot p { margin: 0 0 8px; }
.m-chat-msg-bot p:last-child { margin-bottom:0; }
.m-chat-msg-bot strong { font-weight: 900; color: var(--m-chat-text); }
.m-chat-msg-bot em { font-style: italic; }
.m-chat-msg-bot code {
    background: var(--m-chat-primary-soft);
    border: 1px solid color-mix(in srgb, var(--m-chat-primary) 22%, #fff);
    padding: 1px 6px;
    border-radius: 7px;
    font-family: 'SF Mono', Menlo, Consolas, monospace;
    font-size: .9em;
    color: var(--m-chat-primary-dark);
}
.m-chat-msg-bot a:not(.m-chat-link-btn) { color: var(--m-chat-primary); font-weight:700; text-decoration: underline; }
.m-chat-msg-bot ul,
.m-chat-msg-bot ol { margin: 8px 0 10px; padding-inline-start: 22px; }
.m-chat-msg-bot li { margin: 4px 0; }
.m-chat-msg-bot li::marker { color: var(--m-chat-primary); }

/* Rich links / visual cards */
.m-chat-msg-bot .m-chat-link-btn {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap: 8px;
    margin: 6px 6px 0 0;
    padding: 9px 12px;
    border-radius: 999px;
    background: var(--m-chat-primary-soft);
    border: 1px solid color-mix(in srgb, var(--m-chat-primary) 28%, #fff);
    color: var(--m-chat-primary-dark) !important;
    text-decoration:none;
    font-weight:900;
    font-size: 12.8px;
    word-break: normal;
    box-shadow: 0 8px 18px rgba(17,24,39,.06);
    transition: transform .16s ease, background .16s ease, color .16s ease;
}
.m-chat-msg-bot .m-chat-link-btn::after { content:'↗'; font-size: 11px; opacity:.78; }
.m-chat-msg-bot .m-chat-link-btn:hover { transform: translateY(-1px); background: var(--m-chat-primary); color:#fff !important; }
.m-chat-media {
    display:block;
    margin: 10px 0;
    border-radius: 18px;
    overflow:hidden;
    border: 1px solid var(--m-chat-border);
    background:#fff;
    box-shadow: 0 12px 28px rgba(17,24,39,.08);
}
.m-chat-media img { width:100%; max-width: 260px; height:auto; display:block; object-fit:cover; }

/* Typing */
.m-chat-typing {
    align-self:flex-start;
    width: auto !important;
    margin-inline: 0 !important;
    padding: 12px 15px;
    border-radius: 18px;
    border-top-left-radius: 7px;
    background: rgba(255,255,255,.94);
    border: 1px solid rgba(255,255,255,.74);
    box-shadow: 0 10px 28px rgba(17,24,39,.07);
    display:inline-flex;
    align-items:center;
    gap:5px;
}
.m-chat-typing-dot { width:7px; height:7px; border-radius:50%; background: var(--m-chat-primary); opacity:.45; animation: m-chat-bounce 1.2s ease-in-out infinite; }
.m-chat-typing-dot:nth-child(2){ animation-delay:.15s; }
.m-chat-typing-dot:nth-child(3){ animation-delay:.3s; }
@keyframes m-chat-bounce { 0%,60%,100%{ transform: translateY(0); opacity:.45;} 30%{ transform: translateY(-5px); opacity:1;} }

/* ─────────── ChatGate ─────────── */
.m-chat-gate {
    margin: 0;
    padding: 14px clamp(14px, 4vw, 20px);
    background: rgba(255,255,255,.92);
    border-top: 1px solid rgba(0,0,0,.06);
    box-shadow: 0 -12px 30px rgba(17,24,39,.04);
    flex-shrink:0;
}
.m-chat-gate[hidden] { display:none; }
.m-chat-gate.is-completed { animation: m-chat-gate-out .2s ease forwards; }
@keyframes m-chat-gate-out { to { opacity:0; transform: translateY(8px); } }
.m-chat-gate-title { display:block; font-size:14px; font-weight:900; color:var(--m-chat-text); margin-bottom:4px; }
.m-chat-gate-message { margin: 0 0 11px; font-size: 12.8px; color:var(--m-chat-muted); line-height:1.35; }
.m-chat-gate-actions { display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap:9px; }
.m-chat-gate-btn {
    border: 1px solid color-mix(in srgb, var(--m-chat-primary) 26%, #fff);
    color: var(--m-chat-primary-dark);
    background: linear-gradient(180deg, #fff, color-mix(in srgb, var(--m-chat-primary) 5%, #fff));
    border-radius: 18px;
    padding: 11px 10px;
    font-size: 12.4px;
    font-weight: 900;
    cursor:pointer;
    display:flex;
    align-items:center;
    gap:8px;
    text-align:start;
    min-height: 48px;
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.m-chat-gate-btn:hover,
.m-chat-gate-btn.is-active { transform: translateY(-1px); border-color: var(--m-chat-primary); box-shadow: 0 10px 22px color-mix(in srgb, var(--m-chat-primary) 14%, transparent); }
.m-chat-gate-icon { font-size: 18px; line-height:1; flex:0 0 auto; }
.m-chat-gate-label { min-width:0; }

/* Quick replies */
.m-chat-quick-replies {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    padding: 12px clamp(14px, 4vw, 20px) 10px;
    background: rgba(255,255,255,.92);
    border-top: 1px solid rgba(0,0,0,.05);
    flex-shrink:0;
    justify-content:flex-start;
}
.m-chat-quick-replies[hidden] { display:none; }
.m-chat-quick {
    border: 1px solid color-mix(in srgb, var(--m-chat-primary) 28%, #fff);
    background: var(--m-chat-primary-soft);
    color: var(--m-chat-primary-dark);
    border-radius:999px;
    padding: 9px 13px;
    min-height: 38px;
    font-size: 12.8px;
    font-weight: 900;
    cursor:pointer;
    box-shadow: 0 8px 18px rgba(17,24,39,.04);
    transition: transform .16s ease, background .16s ease, color .16s ease;
}
.m-chat-quick:hover { transform: translateY(-1px); background: var(--m-chat-primary); color:#fff; }

/* Composer */
.m-chat-composer {
    display:flex;
    align-items:flex-end;
    gap:10px;
    padding: 13px clamp(14px, 4vw, 20px) calc(13px + env(safe-area-inset-bottom, 0px));
    background: rgba(255,255,255,.96);
    border-top: 1px solid rgba(0,0,0,.06);
    box-shadow: 0 -12px 32px rgba(17,24,39,.06);
    flex-shrink:0;
}
.m-chat-input {
    flex:1;
    min-width:0;
    border: 1px solid color-mix(in srgb, var(--m-chat-primary) 18%, var(--m-chat-border));
    background: color-mix(in srgb, var(--m-chat-primary) 3%, #fff);
    border-radius: 18px;
    padding: 12px 14px;
    font-family: inherit;
    font-size: 14px;
    line-height:1.4;
    color: var(--m-chat-text);
    resize:none;
    outline:none;
    max-height: 110px;
    transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.m-chat-input:focus { border-color: var(--m-chat-primary); background:#fff; box-shadow: 0 0 0 4px color-mix(in srgb, var(--m-chat-primary) 12%, transparent); }
.m-chat-send {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    border:0;
    border-radius: 17px;
    background: linear-gradient(135deg, var(--m-chat-primary), var(--m-chat-primary-dark));
    color:#fff;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    box-shadow: 0 12px 24px color-mix(in srgb, var(--m-chat-primary) 26%, transparent);
    transition: transform .16s ease, opacity .16s ease, box-shadow .16s ease;
}
.m-chat-send:hover:not(:disabled) { transform: translateY(-1px); box-shadow: 0 16px 30px color-mix(in srgb, var(--m-chat-primary) 32%, transparent); }
.m-chat-send:disabled { opacity:.42; cursor:not-allowed; box-shadow:none; }
.m-chat-send svg { width: 18px; height:18px; }

/* Error */
.m-chat-error {
    margin: 0 14px 9px;
    padding: 10px 13px;
    background: color-mix(in srgb, var(--danger, #dc2626) 10%, #fff);
    color: var(--danger, #dc2626);
    border: 1px solid color-mix(in srgb, var(--danger, #dc2626) 28%, #fff);
    border-radius: 14px;
    font-size: 12.7px;
    font-weight:700;
    line-height:1.4;
}
.m-chat-error[hidden] { display:none; }

/* Mobile refinements */
@media (max-width: 639px) {
    .m-chat-panel-inner { border-radius: 0; }
    .m-chat-header { padding-top: calc(16px + env(safe-area-inset-top, 0px)); }
    .m-chat-msg { max-width: 90% !important; }
    .m-chat-gate-actions { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
    .m-chat-fab { width:58px; height:58px; border-radius: 22px; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); inset-inline-end: 16px; }
    .m-chat-fab-icon svg { width:25px; height:25px; }
    .m-chat-tooltip { inset-inline-end: 16px; bottom: calc(16px + 72px + env(safe-area-inset-bottom, 0px)); }
}

/* RTL */
[dir="rtl"] .m-chat-msg-bot { border-top-left-radius: 20px; border-top-right-radius: 7px; }
[dir="rtl"] .m-chat-msg-user { border-top-right-radius: 20px; border-top-left-radius: 7px; }
[dir="rtl"] .m-chat-send svg { transform: scaleX(-1); }
[dir="rtl"] .m-chat-tooltip { border-radius: 18px 18px 18px 6px; }

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .m-chat-fab,
    .m-chat-panel-inner,
    .m-chat-msg,
    .m-chat-tooltip,
    .m-chat-typing-dot,
    .m-chat-fab-pulse { animation: none !important; transition: none !important; }
}


/* Phase 3.5 — rich card spacing / thumbnail polish */
.m-chat-rich-card {
    display:flex;
    gap: .8rem;
    align-items: stretch;
    overflow:hidden;
    border: 1px solid var(--m-chat-border);
    background: #fff;
    border-radius: 0.5rem;
    margin: 0 0 1rem;
    box-shadow: 0 12px 28px rgba(17,24,39,.08);
}
.m-chat-rich-card:last-child { margin-bottom: 0; }
.m-chat-rich-card-img {
    flex: 0 0 92px;
    min-height: 92px;
    background: var(--m-chat-primary-soft);
    display:block;
}
.m-chat-rich-card-img img { width:100%; height:100%; object-fit:cover; display:block; }
.m-chat-rich-card-body { padding: .75rem .8rem; min-width:0; flex:1; }
.m-chat-rich-card-body strong { display:block; margin-bottom:.25rem; }
.m-chat-rich-card-price { display:inline-flex; margin:.1rem 0 .3rem; font-weight:900; color:var(--m-chat-primary-dark); }
.m-chat-rich-card-body p { margin:.2rem 0 .55rem; font-size:.9em; color:var(--m-chat-muted); }
.m-chat-fab.is-open .m-chat-fab-icon-open { display:inline-flex !important; }
.m-chat-fab.is-open .m-chat-fab-icon-close { position:absolute; inset:auto -4px -4px auto; width:22px; height:22px; border-radius:999px; background:#fff; color:var(--m-chat-primary-dark); box-shadow:0 6px 14px rgba(0,0,0,.18); }
.m-chat-fab.is-open .m-chat-fab-icon-close svg { width:13px; height:13px; }


/* ─────────── Simple rich content blocks ─────────── */
.m-chat-msg-bot p { margin: 0 0 .65rem; }
.m-chat-msg-bot p:last-child { margin-bottom: 0; }
.m-chat-msg-bot ul,
.m-chat-msg-bot ol {
    margin: .55rem 0 .75rem 1.15rem;
    padding: 0;
}
.m-chat-msg-bot li { margin: .3rem 0; }
.m-chat-msg-bot strong { font-weight: 800; color: var(--m-chat-text); }

.m-chat-link-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    min-height: 34px;
    padding: .55rem .78rem;
    margin: .35rem .35rem .15rem 0;
    border-radius: 999px;
    background: var(--m-chat-primary);
    color: #fff !important;
    text-decoration: none !important;
    font-size: .82rem;
    font-weight: 800;
    box-shadow: 0 8px 22px color-mix(in srgb, var(--m-chat-primary) 26%, transparent);
}

.m-chat-rich-card {
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr);
    gap: .75rem;
    overflow: hidden;
    border: 1px solid var(--m-chat-border);
    border-radius: .5rem;
    margin-bottom: 1rem;
    background: #fff;
    box-shadow: 0 8px 26px rgba(17,24,39,.08);
}
.m-chat-rich-card-img {
    display: block;
    width: 82px;
    min-height: 82px;
    background: var(--m-chat-primary-soft);
}
.m-chat-rich-card-img img {
    width: 100%;
    height: 100%;
    min-height: 82px;
    object-fit: cover;
    display: block;
}
.m-chat-rich-card-body {
    min-width: 0;
    padding: .68rem .68rem .68rem 0;
}
.m-chat-rich-card-body strong {
    display: block;
    font-size: .9rem;
    line-height: 1.25;
    margin-bottom: .25rem;
}
.m-chat-rich-card-body p {
    margin: .25rem 0 .45rem;
    font-size: .78rem;
    line-height: 1.35;
    color: var(--m-chat-muted);
}
.m-chat-rich-card-price {
    display: inline-flex;
    margin-bottom: .25rem;
    color: var(--m-chat-primary-dark);
    font-weight: 900;
    font-size: .84rem;
}

.m-chat-media {
    display:block;
    overflow:hidden;
    border-radius:.75rem;
    margin:.65rem 0 .85rem;
    border:1px solid var(--m-chat-border);
}
.m-chat-media img {
    display:block;
    width:100%;
    height:auto;
    max-height:220px;
    object-fit:cover;
}

.m-chat-fab.is-open .m-chat-fab-icon-close {
    position: absolute;
    width: 22px;
    height: 22px;
    inset-inline-end: -5px;
    top: -5px;
    border-radius: 999px;
    background: #111827;
    color: #fff;
    border: 2px solid #fff;
    z-index: 4;
}
.m-chat-fab.is-open .m-chat-fab-icon-close svg {
    width: 12px;
    height: 12px;
}


/* Phase 3.8 stabilization: ChatGate kaldırıldı, quick hover okunabilirliği güçlendirildi */
.m-chat-gate { display: none !important; }
.m-chat-quick:hover,
.m-chat-quick:focus-visible {
    background: var(--m-chat-primary) !important;
    color: #fff !important;
    border-color: var(--m-chat-primary) !important;
}
.m-chat-quick:hover *,
.m-chat-quick:focus-visible * { color: #fff !important; }
.m-chat-rich-card { border-radius: .5rem; margin-bottom: 1rem; }


/* Final stability / readable controls */
.m-chat-link-btn,
.m-chat-quick-btn,
.m-chat-send,
.m-chat-clear,
.m-chat-close {
    transition: transform .14s ease, box-shadow .14s ease, background .14s ease, color .14s ease, border-color .14s ease;
}
.m-chat-link-btn:hover,
.m-chat-link-btn:focus-visible,
.m-chat-quick-btn:hover,
.m-chat-quick-btn:focus-visible {
    color: #fff !important;
    background: var(--primary, #2563eb) !important;
    border-color: var(--primary, #2563eb) !important;
    text-decoration: none !important;
}
.m-chat-rich-card {
    border-radius: .5rem !important;
    margin-bottom: 1rem !important;
    overflow: hidden;
}
.m-chat-inline-image {
    margin: 10px 0 14px;
    border-radius: .5rem;
    overflow: hidden;
    border: 1px solid rgba(15,23,42,.10);
    background: #fff;
}
.m-chat-inline-image img {
    display: block;
    width: 100%;
    max-height: 190px;
    object-fit: cover;
}
.m-chat-inline-image figcaption {
    padding: 8px 10px;
    font-size: 12px;
    font-weight: 800;
    color: var(--text-muted, #64748b);
}
.m-chat-msg-bot ul,
.m-chat-msg-bot ol {
    margin: 8px 0 10px 18px;
    padding: 0;
}
.m-chat-msg-bot li { margin: 4px 0; }
.m-chat-msg-bot strong { font-weight: 900; }
.m-chat-fab { display: inline-flex !important; }
.m-chat-fab[hidden] { display: none !important; }

/* Final floating stack: Chat FAB, BTT ve A11Y stack'lenir.
   BTT görünürken chat yukarı çıkar (yana DEĞİL — install/PWA butonuyla çakışmaz). */
.m-chat-fab {
    width: 56px !important;
    height: 56px !important;
    bottom: calc(var(--sp-5, 20px) + env(safe-area-inset-bottom, 0px)) !important;
    inset-inline-end: var(--sp-5, 20px) !important;
    border-radius: 20px !important;
}
body.btt-visible .m-chat-fab {
    /* BTT 56px + 10px gap → Chat FAB BTT'nin ÜSTÜNE stack'lenir */
    bottom: calc(var(--sp-5, 20px) + 56px + 10px + env(safe-area-inset-bottom, 0px)) !important;
    inset-inline-end: var(--sp-5, 20px) !important;
}
.m-chat-fab:hover {
    transform: translateY(-3px) scale(1.045) !important;
}
.m-chat-fab-icon svg { width: 24px !important; height: 24px !important; }
.m-chat-fab-icon img { width: 34px !important; height: 34px !important; border-radius: 14px !important; }
.m-chat-fab.is-open {
    display: inline-flex !important;
    z-index: calc(var(--z-modal, 400) + 2) !important;
    transform: scale(.94) !important;
}
body.btt-visible .m-chat-tooltip {
    /* Chat FAB BTT üstüne çıktığı için tooltip de daha yükseğe çıkar */
    bottom: calc(var(--sp-5, 20px) + 56px + 10px + 70px + env(safe-area-inset-bottom, 0px)) !important;
    inset-inline-end: var(--sp-5, 20px) !important;
}
@media (max-width: 480px) {
    .m-chat-fab {
        width: 52px !important;
        height: 52px !important;
        bottom: calc(16px + env(safe-area-inset-bottom, 0px)) !important;
        inset-inline-end: 16px !important;
        border-radius: 18px !important;
        transition:
            opacity .28s cubic-bezier(.16, 1, .3, 1),
            transform .28s cubic-bezier(.16, 1, .3, 1),
            box-shadow .22s ease !important;
    }
    /* Mobile: BTT görünürken Chat FAB üstüne stack (yana değil — install/PWA ile çakışmasın) */
    body.btt-visible .m-chat-fab {
        bottom: calc(16px + 52px + 10px + env(safe-area-inset-bottom, 0px)) !important;
        inset-inline-end: 16px !important;
    }
    /* Chat açıkken: yana itme YOK, yukarı doğru fade-out
       (chat kapanınca fade-in geri gelir — is-open sınıfı kalkar) */
    .m-chat-fab.is-open {
        opacity: 0 !important;
        pointer-events: none !important;
        transform: translateY(-28px) scale(.85) !important;
        inset-inline-end: 16px !important;
    }
    /* btt-visible iken de açıkken sadece fade-out, pozisyon aynı stack */
    body.btt-visible .m-chat-fab.is-open {
        inset-inline-end: 16px !important;
    }
}