/* Kiptaş sanal tur geliştirme katmanı — 3DVista görüntüleyicinin (#viewer, z-index:1) üstünde çalışır. */
:root {
    --kt-kirmizi: #c8102e;
    --kt-kirmizi-koyu: #a00d25;
    --kt-wa: #1fa855;
    --kt-koyu: rgba(17, 17, 17, .62);
    --kt-yazi: #1a1a1a;
    --kt-ikincil: #5c5c5c;
    --kt-cizgi: #e6e6e6;
    --kt-font: 'Futura Std Medium', 'Futura Std Book', Arial, Helvetica, sans-serif;
    --kt-ust: env(safe-area-inset-top, 0px);
    --kt-alt: env(safe-area-inset-bottom, 0px);
    --kt-sol: env(safe-area-inset-left, 0px);
    --kt-sag: env(safe-area-inset-right, 0px);
}

#kt-arac, #kt-panel, #kt-aksiyon, #kt-kart, #kt-cerez, #kt-bildirim {
    position: fixed; z-index: 2147483000; font-family: var(--kt-font); box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
}
#kt-arac *, #kt-panel *, #kt-aksiyon *, #kt-kart *, #kt-cerez * { box-sizing: border-box; }
#kt-arac svg, #kt-panel svg, #kt-aksiyon svg, #kt-kart svg { width: 20px; height: 20px; flex: none; }

/* ---------- üst araç çubuğu ---------- */
#kt-arac { top: calc(16px + var(--kt-ust)); left: calc(16px + var(--kt-sol)); display: flex; gap: 8px; }
.kt-arac-btn {
    display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px;
    background: var(--kt-koyu); color: #fff; border: 1px solid rgba(255, 255, 255, .35); border-radius: 999px;
    font: 14px/1 var(--kt-font); letter-spacing: .3px; text-decoration: none; cursor: pointer;
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
    transition: background .15s ease, transform .1s ease;
}
.kt-arac-btn:hover, .kt-arac-btn[aria-expanded="true"] { background: rgba(17, 17, 17, .82); }
.kt-arac-btn:active { transform: scale(.96); }
.kt-dil { padding: 0 14px; font-weight: 700; }

:is(.kt-arac-btn, .kt-ikon-btn, #kt-panel button, #kt-kart a, #kt-aksiyon a, #kt-cerez button):focus-visible {
    outline: 3px solid #fff; outline-offset: 2px; box-shadow: 0 0 0 5px var(--kt-kirmizi);
}

/* ---------- hızlı git paneli ---------- */
#kt-panel {
    top: calc(66px + var(--kt-ust)); left: calc(16px + var(--kt-sol)); width: 300px; max-height: calc(100vh - 200px);
    display: flex; flex-direction: column; background: #fff; color: var(--kt-yazi);
    border-radius: 14px; box-shadow: 0 12px 40px rgba(0, 0, 0, .35); overflow: hidden;
    animation: kt-belir .16s ease-out;
}
#kt-panel[hidden] { display: none; }
.kt-panel-baslik { display: flex; align-items: center; justify-content: space-between; padding: 12px 12px 8px 18px; }
.kt-panel-baslik strong { font-size: 13px; letter-spacing: 1px; text-transform: uppercase; color: var(--kt-ikincil); }
.kt-panel-liste { list-style: none; margin: 0; padding: 0 8px; overflow-y: auto; }
.kt-panel-liste button {
    width: 100%; display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
    padding: 12px 10px; background: none; border: 0; border-radius: 8px; color: inherit;
    font: 16px/1.25 var(--kt-font); text-align: left; cursor: pointer;
}
.kt-panel-liste button:hover { background: #f4f4f4; }
.kt-panel-liste button[aria-current] { color: var(--kt-kirmizi); background: #fdf0f2; }
.kt-panel-liste small { font-size: 13px; color: var(--kt-ikincil); white-space: nowrap; }
.kt-paylas {
    display: flex; align-items: center; gap: 10px; margin: 8px; padding: 12px 10px; border: 0; border-top: 1px solid var(--kt-cizgi);
    background: none; color: var(--kt-yazi); font: 15px var(--kt-font); cursor: pointer; border-radius: 0 0 8px 8px;
}
.kt-paylas:hover { color: var(--kt-kirmizi); }

.kt-ikon-btn {
    display: inline-grid; place-items: center; width: 36px; height: 36px; padding: 0;
    background: none; border: 0; border-radius: 50%; color: inherit; cursor: pointer;
}
.kt-ikon-btn:hover { background: rgba(0, 0, 0, .07); }
.kt-ikon-btn svg { width: 18px !important; height: 18px !important; }

/* ---------- iletişim çubuğu ---------- */
#kt-aksiyon {
    right: calc(20px + var(--kt-sag)); bottom: calc(24px + var(--kt-alt));
    display: flex; align-items: center; gap: 10px;
}
.kt-yuvarlak {
    display: inline-grid; place-items: center; width: 52px; height: 52px; border-radius: 50%;
    color: #fff; border: 2px solid #fff; box-shadow: 0 6px 20px rgba(0, 0, 0, .35); text-decoration: none;
    transition: transform .15s ease, filter .15s ease;
}
.kt-yuvarlak svg { width: 24px !important; height: 24px !important; }
.kt-yuvarlak:hover { transform: scale(1.06); filter: brightness(1.08); }
.kt-yuvarlak:active { transform: scale(.96); }
.kt-wa { background: var(--kt-wa); }
.kt-tel {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    width: auto; padding: 0 16px; border-radius: 999px; background: #222;
    font: 700 14px Arial, Helvetica, sans-serif; white-space: nowrap;
}

#fiyat-al-btn {
    display: inline-flex; align-items: center; gap: 10px; padding: 14px 26px;
    background: var(--kt-kirmizi); color: #fff; font: 700 18px Arial, Helvetica, sans-serif; letter-spacing: .5px;
    text-transform: uppercase; text-decoration: none; white-space: nowrap;
    border: 2px solid #fff; border-radius: 999px; box-shadow: 0 6px 20px rgba(0, 0, 0, .35);
    animation: kt-nabiz 2s ease-out infinite; transition: transform .15s ease, background .15s ease;
}
#fiyat-al-btn:hover, #fiyat-al-btn:focus-visible { background: var(--kt-kirmizi-koyu); transform: scale(1.05); }
#fiyat-al-btn:active { transform: scale(.97); }
#fiyat-al-btn svg { width: 22px; height: 22px; }
@keyframes kt-nabiz {
    0% { box-shadow: 0 6px 20px rgba(0, 0, 0, .35), 0 0 0 0 rgba(200, 16, 46, .7); }
    70% { box-shadow: 0 6px 20px rgba(0, 0, 0, .35), 0 0 0 16px rgba(200, 16, 46, 0); }
    100% { box-shadow: 0 6px 20px rgba(0, 0, 0, .35), 0 0 0 0 rgba(200, 16, 46, 0); }
}

/* ---------- depo bilgi kartı ---------- */
#kt-kart {
    right: calc(20px + var(--kt-sag)); bottom: calc(100px + var(--kt-alt)); width: 300px; padding: 18px 18px 16px;
    background: #fff; color: var(--kt-yazi); border-radius: 14px; border-top: 4px solid var(--kt-kirmizi);
    box-shadow: 0 12px 40px rgba(0, 0, 0, .35);
    opacity: 0; transform: translateY(12px); pointer-events: none; visibility: hidden;
    transition: opacity .2s ease, transform .2s ease, visibility 0s .2s;
}
#kt-kart.kt-gorunur { opacity: 1; transform: none; pointer-events: auto; visibility: visible; transition: opacity .2s ease, transform .2s ease; }
.kt-kart-kapat { position: absolute; top: 8px; right: 8px; }
#kt-kart h2 { margin: 0 32px 12px 0; font: 22px/1.2 var(--kt-font); color: var(--kt-kirmizi); }
#kt-kart p { margin: 0 0 14px; font-size: 15px; line-height: 1.45; color: var(--kt-ikincil); }
#kt-kart dl { margin: 0 0 14px; display: grid; gap: 6px; }
#kt-kart dl div { display: flex; justify-content: space-between; gap: 12px; padding-bottom: 6px; border-bottom: 1px solid var(--kt-cizgi); }
#kt-kart dt { font-size: 14px; color: var(--kt-ikincil); }
#kt-kart dd { margin: 0; font-size: 15px; font-weight: 700; font-family: Arial, Helvetica, sans-serif; font-variant-numeric: tabular-nums; }
.kt-kart-aksiyon { display: flex; gap: 8px; }
.kt-kart-fiyat {
    flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 14px;
    background: var(--kt-kirmizi); color: #fff; border-radius: 10px; text-decoration: none;
    font: 700 15px Arial, Helvetica, sans-serif;
}
.kt-kart-fiyat:hover { background: var(--kt-kirmizi-koyu); }
.kt-kart-wa { display: inline-grid; place-items: center; width: 44px; height: 44px; background: var(--kt-wa); color: #fff; border-radius: 10px; }

/* 3DVista menüsü açıkken */
body.kt-menu-acik #kt-kart, body.kt-panel-acik #kt-kart { opacity: 0; visibility: hidden; pointer-events: none; }

/* ---------- çerez bildirimi / bildirim ---------- */
#kt-cerez {
    left: calc(16px + var(--kt-sol)); bottom: calc(16px + var(--kt-alt)); width: 360px; max-width: calc(100vw - 32px);
    padding: 16px; background: #fff; color: var(--kt-yazi); border-radius: 12px; box-shadow: 0 12px 40px rgba(0, 0, 0, .35);
    font-size: 14px; line-height: 1.45; z-index: 2147483600;
}
#kt-cerez p { margin: 0 0 12px; }
#kt-cerez a { color: var(--kt-kirmizi); }
#kt-cerez div { display: flex; gap: 8px; justify-content: flex-end; }
#kt-cerez button { min-height: 40px; padding: 0 16px; border-radius: 8px; font: 700 14px Arial, Helvetica, sans-serif; cursor: pointer; }
.kt-cerez-red { background: #fff; color: var(--kt-yazi); border: 1px solid #bbb; }
.kt-cerez-kabul { background: var(--kt-kirmizi); color: #fff; border: 1px solid var(--kt-kirmizi); }

#kt-bildirim {
    top: calc(20px + var(--kt-ust)); left: 50%; transform: translate(-50%, -8px); padding: 10px 18px;
    background: rgba(17, 17, 17, .88); color: #fff; border-radius: 999px; font-size: 14px;
    opacity: 0; pointer-events: none; transition: opacity .2s ease, transform .2s ease;
}
#kt-bildirim.kt-gorunur { opacity: 1; transform: translate(-50%, 0); }

@keyframes kt-belir { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

/* ---------- mobil ---------- */
@media (max-width: 600px) {
    #kt-arac { top: calc(12px + var(--kt-ust)); left: calc(12px + var(--kt-sol)); flex-direction: column; }
    .kt-arac-btn { width: 44px; height: 44px; padding: 0; justify-content: center; }
    .kt-arac-btn span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
    .kt-dil { font-size: 13px; }

    #kt-panel { top: calc(12px + var(--kt-ust)); left: calc(64px + var(--kt-sol)); right: calc(12px + var(--kt-sag)); width: auto; max-height: calc(100vh - 220px); }

    /* İki satır: [☎ 444 0 771][WhatsApp] / [Şimdi Fiyat Al] — numara her zaman okunur. */
    #kt-aksiyon {
        left: calc(12px + var(--kt-sol)); right: calc(12px + var(--kt-sag));
        bottom: calc(64px + var(--kt-alt)); display: grid;
        grid-template-columns: minmax(0, 1fr) 48px; gap: 8px;
    }
    .kt-yuvarlak { width: 48px; height: 48px; }
    .kt-tel { width: auto; gap: 8px; font-size: 17px; letter-spacing: .3px; }
    .kt-tel svg { width: 20px !important; height: 20px !important; }
    #fiyat-al-btn { grid-column: 1 / -1; justify-content: center; min-height: 48px; padding: 10px; font-size: 16px; gap: 8px; letter-spacing: .3px; }

    /* Karşılama ekranının altındaki başlat düğmesine yer bırak. */
    body.kt-karsilama-acik #kt-aksiyon {
        top: calc(12px + var(--kt-ust)); bottom: auto; left: auto;
        width: min(260px, calc(100vw - 80px - var(--kt-sol) - var(--kt-sag)));
    }
    body.kt-karsilama-acik .kt-tel { font-size: 15px; }
    body.kt-karsilama-acik #fiyat-al-btn { font-size: 14px; }

    #kt-kart { left: calc(12px + var(--kt-sol)); right: calc(12px + var(--kt-sag)); width: auto; bottom: calc(184px + var(--kt-alt)); padding: 14px 14px 12px; }
    #kt-kart h2 { font-size: 19px; margin-bottom: 8px; }
    #kt-kart dl { grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 12px; }
    #kt-kart dl div { flex-direction: column; gap: 2px; border: 0; padding: 0; }
    #kt-kart dt { font-size: 12px; }

    #kt-cerez { left: 12px; right: 12px; width: auto; bottom: calc(12px + var(--kt-alt)); }
}
@media (max-width: 340px) {
    .kt-tel { font-size: 15px; gap: 6px; }
}
/* Yatay telefon: yükseklik az, tek satır */
@media (max-width: 900px) and (max-height: 450px) {
    #kt-aksiyon, body.kt-karsilama-acik #kt-aksiyon {
        top: auto; bottom: calc(12px + var(--kt-alt)); left: auto; right: calc(12px + var(--kt-sag)); width: auto;
        display: flex; gap: 8px;
    }
    .kt-tel { padding: 0 14px; font-size: 15px; }
    #fiyat-al-btn { padding: 0 18px; font-size: 14px; }
    #kt-kart { bottom: calc(72px + var(--kt-alt)); }
}

@media (prefers-reduced-motion: reduce) {
    #fiyat-al-btn { animation: none; }
    #kt-panel { animation: none; }
    #kt-kart, #kt-bildirim { transition: none; }
}
