/* ============================================================
   AtmoSpace Admin Panel — Tema
   Mobil uygulamanın renk paletinden türetildi:
   koyu navy zemin + teal/emerald accent
   ============================================================ */

:root {
    /* Zemin */
    --bg-deep:        #0a1420;
    --bg-base:        #0e1a28;
    --bg-surface:     #142436;
    --bg-surface-2:   #18293d;
    --bg-elevated:    #1d3044;

    /* Accent — mobildeki yeşil/teal */
    --accent:         #2dd4a7;
    --accent-bright:  #34e0b0;
    --accent-dim:     #1f9d7c;
    --accent-soft:    rgba(45, 212, 167, 0.12);
    --accent-glow:    rgba(45, 212, 167, 0.35);

    /* İkincil aksan — mavi (linkler, aktif durumlar, alt nav) */
    --accent2:        #4a93ff;
    --accent2-soft:   rgba(74, 147, 255, 0.14);

    /* Yüzeye özel */
    --topbar-bg:      rgba(14, 26, 40, 0.72);
    --logo-glow:      rgba(45, 212, 167, 0.45);

    /* Metin */
    --text-primary:   #eef4f2;
    --text-secondary: #9fb2c0;
    --text-muted:     #61788a;

    /* Çizgi/kenar */
    --border:         rgba(255, 255, 255, 0.06);
    --border-strong:  rgba(255, 255, 255, 0.12);

    /* Durum */
    --danger:         #f0556d;
    --warning:        #f0b429;
    --info:           #4aa8ff;

    /* Ölçü */
    --sidebar-w:      264px;
    --radius:         16px;
    --radius-sm:      10px;
    --shadow:         0 12px 32px rgba(0, 0, 0, 0.35);

    --font-display: "Sora", -apple-system, sans-serif;
    --font-body:    "Plus Jakarta Sans", -apple-system, sans-serif;
}

/* ===== Açık tema ===== */
:root[data-theme="light"] {
    --bg-deep:        #eaeef4;
    --bg-base:        #ffffff;
    --bg-surface:     #ffffff;
    --bg-surface-2:   #f3f6fb;
    --bg-elevated:    #e8edf5;

    --accent:         #14b489;
    --accent-bright:  #0fa17b;
    --accent-dim:     #0d8f6e;
    --accent-soft:    rgba(20, 180, 137, 0.12);
    --accent-glow:    rgba(20, 180, 137, 0.28);

    --accent2:        #2563eb;
    --accent2-soft:   rgba(37, 99, 235, 0.10);

    --text-primary:   #0f1b2d;
    --text-secondary: #51627a;
    --text-muted:     #8493a6;

    --border:         rgba(15, 27, 45, 0.09);
    --border-strong:  rgba(15, 27, 45, 0.16);

    --topbar-bg:      rgba(255, 255, 255, 0.8);
    --logo-glow:      rgba(20, 180, 137, 0.3);
    --shadow:         0 10px 30px rgba(20, 40, 80, 0.10);
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html, body {
    height: 100%;
    background: var(--bg-deep);
    color: var(--text-primary);
    font-family: var(--font-body);
    font-size: 15px;
    -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; border: none; background: none; color: inherit; }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--bg-elevated); border-radius: 8px; border: 2px solid var(--bg-deep); }
::-webkit-scrollbar-thumb:hover { background: var(--accent-dim); }

/* ============================================================
   LAYOUT
   ============================================================ */
.app-shell {
    display: grid;
    grid-template-columns: var(--sidebar-w) 1fr;
    min-height: 100vh;
    background:
        radial-gradient(900px 500px at 80% -10%, rgba(45, 212, 167, 0.08), transparent 60%),
        var(--bg-deep);
}

/* ---------- Sidebar ---------- */
.sidebar {
    background: linear-gradient(180deg, var(--bg-base), var(--bg-deep));
    border-right: 1px solid var(--border);
    padding: 24px 16px;
    display: flex;
    flex-direction: column;
    position: sticky;
    top: 0;
    height: 100vh;
}

.brand {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 6px 10px 22px;
    color: inherit;
    text-decoration: none;
}
.brand-mark {
    width: 40px; height: 40px;
    border-radius: 12px;
    object-fit: cover;
    background: var(--bg-elevated);
    box-shadow: 0 6px 18px var(--accent-glow);
    display: block;
    /* metin fallback (görsel yüklenmezse) */
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 20px;
    color: var(--accent-bright);
    text-align: center;
    line-height: 40px;
}
.brand-text { font-family: var(--font-display); font-weight: 700; font-size: 18px; letter-spacing: -0.3px; }
.brand-text span { color: var(--accent); }

.nav-group { margin-top: 10px; }
.nav-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 1.4px;
    color: var(--text-muted);
    padding: 14px 12px 8px;
    font-weight: 600;
}
.nav-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 12px;
    border-radius: var(--radius-sm);
    color: var(--text-secondary);
    font-weight: 500;
    font-size: 14.5px;
    transition: all .18s ease;
    position: relative;
}
.nav-item svg { width: 19px; height: 19px; stroke-width: 2; flex-shrink: 0; }
.nav-item:hover { background: var(--bg-surface); color: var(--text-primary); }
.nav-item.active {
    background: var(--accent-soft);
    color: var(--accent-bright);
}
.nav-item.active::before {
    content: "";
    position: absolute;
    left: -16px; top: 50%;
    transform: translateY(-50%);
    width: 3px; height: 22px;
    background: var(--accent);
    border-radius: 0 3px 3px 0;
}

/* Nav orta kısmı kaydırılabilir — logo üstte, çıkış altta sabit kalır.
   İleride menü eklendikçe taşmadan kayar. */
.sidebar-scroll {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    margin: 0 -6px;
    padding: 0 6px;
}
.sidebar-scroll::-webkit-scrollbar { width: 6px; }
.sidebar-scroll::-webkit-scrollbar-thumb { background: var(--bg-elevated); border-radius: 6px; border: none; transition: background .15s ease; }
.sidebar-scroll::-webkit-scrollbar-thumb:hover { background: var(--accent-dim); }
.sidebar-scroll::-webkit-scrollbar-track { background: transparent; }

.sidebar-footer {
    flex-shrink: 0;
    margin-top: auto;
    padding-top: 16px;
    border-top: 1px solid var(--border);
}
.user-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: var(--radius-sm);
    transition: background .18s ease;
}
.user-card:hover { background: var(--bg-surface); }
.user-avatar {
    width: 38px; height: 38px;
    border-radius: 11px;
    background: linear-gradient(135deg, var(--accent), var(--accent-dim));
    display: grid; place-items: center;
    color: #07221b; font-weight: 700;
}
.user-meta { line-height: 1.3; overflow: hidden; }
.user-meta .name { font-weight: 600; font-size: 14px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.user-meta .role { font-size: 12px; color: var(--text-muted); }

/* ---------- Main ---------- */
.main { display: flex; flex-direction: column; min-width: 0; }

.topbar {
    height: 72px;
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 0 32px;
    border-bottom: 1px solid var(--border);
    background: var(--topbar-bg);
    backdrop-filter: blur(12px);
    position: sticky; top: 0; z-index: 90;   /* içerik açılırlarının (dash-search 30 / ds-results 60) üstünde; bildirim paneli topbar bağlamında olduğundan panel de üstte kalır */
}
.search-bar {
    flex: 1;
    max-width: 520px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 16px;
    background: var(--bg-surface);
    border: 1px solid var(--border);
    border-radius: 12px;
    transition: border-color .18s ease;
}
.search-bar:focus-within { border-color: var(--accent-dim); }
.search-bar svg { width: 18px; height: 18px; color: var(--text-muted); }
.search-bar input {
    flex: 1; background: none; border: none; outline: none;
    color: var(--text-primary); font-size: 14px;
}
.search-bar input::placeholder { color: var(--text-muted); }

.topbar-actions { display: flex; align-items: center; gap: 8px; }
.icon-btn {
    width: 42px; height: 42px;
    border-radius: 11px;
    display: grid; place-items: center;
    color: var(--text-secondary);
    background: var(--bg-surface);
    border: 1px solid var(--border);
    transition: all .18s ease;
    position: relative;
}
.icon-btn:hover { color: var(--accent-bright); border-color: var(--accent-dim); }
.icon-btn svg { width: 19px; height: 19px; }
.icon-btn .dot {
    position: absolute; top: 9px; right: 10px;
    width: 7px; height: 7px; border-radius: 50%;
    background: var(--accent); box-shadow: 0 0 0 2px var(--bg-surface);
}

/* ===== Bildirim çanı + paneli ===== */
.notif-wrap { position: relative; }
.notif-badge {
    position: absolute; top: -5px; right: -5px; min-width: 18px; height: 18px;
    padding: 0 5px; border-radius: 9px; background: var(--danger); color: #fff;
    font-size: 11px; font-weight: 700; line-height: 18px; text-align: center;
    box-shadow: 0 0 0 2px var(--bg-base);
}
.notif-panel {
    position: absolute; top: calc(100% + 10px); right: 0; z-index: 120;
    width: 370px; max-width: 90vw;
    background: var(--bg-elevated); border: 1px solid var(--border-strong);
    border-radius: 14px; box-shadow: 0 20px 50px rgba(0,0,0,.5); overflow: hidden;
    animation: rise .2s ease both;
}
.notif-head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 13px 16px; border-bottom: 1px solid var(--border);
    font-weight: 700; font-size: 14px; font-family: var(--font-display);
}
.notif-head span { display: flex; align-items: center; gap: 8px; }
.notif-head svg { width: 16px; height: 16px; color: var(--accent); }
.notif-readall { font-size: 12px; color: var(--accent-bright); font-weight: 600; }
.notif-readall:hover { text-decoration: underline; }
.notif-list { max-height: 62vh; overflow: auto; }
.notif-loading, .notif-empty { text-align: center; color: var(--text-muted); padding: 30px 16px; font-size: 13px; }
.notif-empty i, .notif-empty svg { width: 30px; height: 30px; display: inline-block; margin-bottom: 6px; }
.notif-item {
    display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px;
    border-bottom: 1px solid var(--border); transition: background .15s ease;
}
.notif-item:last-child { border-bottom: none; }
.notif-item:hover { background: var(--bg-surface); }
.notif-item.unread { background: var(--accent-soft); cursor: pointer; }
.notif-item.unread:hover { background: rgba(45, 212, 167, 0.18); }
.notif-udot { flex-shrink: 0; width: 8px; height: 8px; border-radius: 50%; margin-top: 6px; background: transparent; }
.notif-item.unread .notif-udot { background: var(--accent); }
.notif-main { flex: 1; min-width: 0; }
.notif-title { font-weight: 650; font-size: 13.5px; }
.notif-msg { font-size: 12.5px; color: var(--text-secondary); margin-top: 2px; line-height: 1.45; }
.notif-time { font-size: 11.5px; color: var(--text-muted); margin-top: 4px; }
.notif-del { flex-shrink: 0; color: var(--text-muted); width: 26px; height: 26px; border-radius: 6px; display: grid; place-items: center; }
.notif-del:hover { color: var(--danger); background: var(--bg-surface-2); }
.notif-del svg { width: 15px; height: 15px; }

.content { padding: 32px; flex: 1; }

/* ---------- Page header ---------- */
.page-head { margin-bottom: 28px; }
.greeting { font-size: 13px; letter-spacing: 1.6px; text-transform: uppercase; color: var(--text-muted); font-weight: 600; }
.page-title {
    font-family: var(--font-display);
    font-size: 28px; font-weight: 700;
    letter-spacing: -0.5px;
    margin-top: 4px;
    display: flex; align-items: center; gap: 10px;
}

/* ============================================================
   COMPONENTS
   ============================================================ */
.section { margin-bottom: 36px; }
.section-head {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 16px;
}
.section-title {
    font-family: var(--font-display);
    font-size: 17px; font-weight: 650;
    display: flex; align-items: center; gap: 9px;
}
.section-title svg { width: 18px; height: 18px; color: var(--accent); }
.section-link { font-size: 13px; color: var(--accent); font-weight: 600; }
.section-link:hover { color: var(--accent-bright); }

/* Stat cards */
.stat-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
}
.stat-card {
    background: var(--bg-surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 22px;
    position: relative;
    overflow: hidden;
    transition: transform .18s ease, border-color .18s ease;
}
.stat-card:hover { transform: translateY(-3px); border-color: var(--accent-dim); }
.stat-card .ic {
    width: 44px; height: 44px;
    border-radius: 12px;
    display: grid; place-items: center;
    background: var(--accent-soft);
    color: var(--accent-bright);
    margin-bottom: 16px;
}
.stat-card .ic svg { width: 22px; height: 22px; }
.stat-card .val { font-family: var(--font-display); font-size: 30px; font-weight: 700; line-height: 1; }
.stat-card .lbl { color: var(--text-secondary); font-size: 13.5px; margin-top: 6px; }
.stat-card .trend { position: absolute; top: 22px; right: 22px; font-size: 12px; color: var(--accent); font-weight: 600; }

/* Quick actions */
.qa-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 16px;
}
.qa-card {
    background: var(--bg-surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 22px 16px;
    display: flex; flex-direction: column; align-items: center; gap: 14px;
    text-align: center;
    transition: all .18s ease;
}
.qa-card:hover { background: var(--bg-surface-2); border-color: var(--accent-dim); transform: translateY(-3px); }
.qa-card .ic {
    width: 52px; height: 52px;
    border-radius: 14px;
    display: grid; place-items: center;
    background: linear-gradient(135deg, var(--accent-soft), transparent);
    border: 1px solid var(--border-strong);
    color: var(--accent-bright);
}
.qa-card .ic svg { width: 24px; height: 24px; }
.qa-card .t { font-size: 13px; font-weight: 600; letter-spacing: .3px; }

/* Workspace cards */
.ws-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 16px;
}
.ws-card {
    background: var(--bg-surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 18px;
    transition: all .18s ease;
}
.ws-card:hover { border-color: var(--accent-dim); transform: translateY(-3px); }
.ws-card .top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.ws-folder {
    width: 42px; height: 42px;
    border-radius: 11px;
    background: var(--accent-soft);
    display: grid; place-items: center;
    color: var(--accent-bright);
}
.ws-folder svg { width: 22px; height: 22px; }
.ws-star { color: var(--accent); }
.ws-star svg { width: 18px; height: 18px; fill: var(--accent); }
.ws-card .name { font-weight: 650; font-size: 15px; }
.ws-card .cat { font-size: 11px; letter-spacing: 1px; color: var(--text-muted); margin-top: 4px; text-transform: uppercase; }

/* Recent list */
.recent-list { display: flex; flex-direction: column; gap: 12px; }
.recent-row {
    display: flex; align-items: center; gap: 16px;
    background: var(--bg-surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 16px 20px;
    transition: all .18s ease;
}
.recent-row:hover { border-color: var(--accent-dim); background: var(--bg-surface-2); }
.recent-row .ws-folder { width: 46px; height: 46px; }
.recent-row .info { flex: 1; }
.recent-row .info .name { font-weight: 650; font-size: 15px; }
.recent-row .info .meta { font-size: 12px; color: var(--text-muted); margin-top: 3px; letter-spacing: .4px; }
.recent-row .chev { color: var(--text-muted); }
.recent-row .chev svg { width: 20px; height: 20px; }

/* ============================================================
   LOGIN
   ============================================================ */
.auth-wrap {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    background: var(--bg-deep);
}
.auth-hero {
    background:
        radial-gradient(700px 500px at 30% 20%, rgba(45, 212, 167, 0.14), transparent 60%),
        linear-gradient(160deg, var(--bg-base), var(--bg-deep));
    border-right: 1px solid var(--border);
    padding: 56px;
    display: flex; flex-direction: column; justify-content: space-between;
    position: relative; overflow: hidden;
}
.auth-hero::after {
    content: "";
    position: absolute; bottom: -120px; right: -120px;
    width: 380px; height: 380px; border-radius: 50%;
    background: radial-gradient(circle, var(--accent-glow), transparent 70%);
    filter: blur(40px);
}
.auth-hero .brand { padding: 0; }
.auth-hero .pitch { position: relative; z-index: 1; }
.auth-hero .pitch h1 {
    font-family: var(--font-display);
    font-size: 44px; font-weight: 700;
    line-height: 1.1; letter-spacing: -1px;
    margin-bottom: 18px;
}
.auth-hero .pitch h1 span { color: var(--accent); }
.auth-hero .pitch p { color: var(--text-secondary); font-size: 16px; max-width: 420px; line-height: 1.6; }
.auth-feats { display: flex; gap: 28px; margin-top: 32px; position: relative; z-index: 1; }
.auth-feat { display: flex; align-items: center; gap: 10px; color: var(--text-secondary); font-size: 14px; }
.auth-feat svg { width: 18px; height: 18px; color: var(--accent); }
.auth-foot { color: var(--text-muted); font-size: 13px; position: relative; z-index: 1; }

.auth-panel { display: grid; place-items: center; padding: 40px; }
.auth-card { width: 100%; max-width: 400px; }
.auth-card h2 { font-family: var(--font-display); font-size: 26px; font-weight: 700; margin-bottom: 6px; }
.auth-card .sub { color: var(--text-secondary); margin-bottom: 32px; font-size: 14.5px; }

.field { margin-bottom: 18px; }
.field label { display: block; font-size: 13px; font-weight: 600; color: var(--text-secondary); margin-bottom: 8px; }
.field input,
.field select,
.field textarea {
    width: 100%;
    padding: 13px 15px;
    background: var(--bg-surface);
    border: 1px solid var(--border-strong);
    border-radius: 11px;
    color: var(--text-primary);
    font-size: 14.5px;
    font-family: inherit;
    transition: border-color .18s ease;
    outline: none;
}
.field textarea { resize: vertical; min-height: 96px; line-height: 1.5; }
.field input:focus,
.field select:focus,
.field textarea:focus { border-color: var(--accent); }
.field input::placeholder,
.field textarea::placeholder { color: var(--text-muted); }

/* Select'i input tasarımına uydur: native oku gizle, özel chevron ekle */
.field select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    cursor: pointer;
    padding-right: 42px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2361788a' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
}
.field select:hover { border-color: var(--accent-dim); }
.field select:disabled { opacity: .55; cursor: not-allowed; color: var(--text-muted); }
/* Açılır liste ögeleri (destekleyen tarayıcılarda tema uyumu) */
.field select option { background: var(--bg-surface-2); color: var(--text-primary); }
.field-validation-error, .text-danger { color: var(--danger); font-size: 12.5px; margin-top: 6px; display: block; }

.row-between { display: flex; align-items: center; justify-content: space-between; margin-bottom: 24px; }
.check { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--text-secondary); }
.check input { width: 16px; height: 16px; accent-color: var(--accent); }
.link-accent { color: var(--accent); font-size: 13.5px; font-weight: 600; }
.link-btn { background: none; border: 0; padding: 0; font: inherit; cursor: pointer; }
.link-btn:disabled, .link-btn.is-disabled { opacity: .55; cursor: not-allowed; }

.btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    padding: 13px 20px;
    border-radius: 11px;
    font-weight: 650; font-size: 15px;
    transition: all .18s ease;
}
.btn-primary {
    width: 100%;
    background: linear-gradient(135deg, var(--accent), var(--accent-dim));
    color: #07221b;
    box-shadow: 0 8px 22px var(--accent-glow);
}
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 12px 28px var(--accent-glow); }
.auth-alt { text-align: center; margin-top: 24px; color: var(--text-muted); font-size: 13.5px; }

/* 409 — başka cihazda aktif oturum onayı */
.auth-notice {
    display: flex; align-items: flex-start; gap: 10px;
    padding: 12px 14px; margin-bottom: 20px;
    background: rgba(240, 180, 41, 0.10);
    border: 1px solid rgba(240, 180, 41, 0.35);
    border-radius: 11px;
    color: var(--warning);
    font-size: 13px; line-height: 1.5;
}
.auth-notice i { width: 18px; height: 18px; flex-shrink: 0; margin-top: 1px; }
.auth-notice-ok {
    background: rgba(22, 179, 100, 0.10);
    border-color: rgba(22, 179, 100, 0.35);
    color: #16b364;
}

/* ============================================================
   PLACEHOLDER PAGES
   ============================================================ */
.placeholder {
    display: grid; place-items: center;
    min-height: 60vh; text-align: center;
}
.placeholder .ic {
    width: 88px; height: 88px; border-radius: 24px;
    background: var(--accent-soft); color: var(--accent-bright);
    display: grid; place-items: center; margin: 0 auto 24px;
}
.placeholder .ic svg { width: 40px; height: 40px; }
.placeholder h2 { font-family: var(--font-display); font-size: 24px; margin-bottom: 10px; }
.placeholder p { color: var(--text-secondary); max-width: 380px; }

/* ---------- Animation ---------- */
@keyframes rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
.rise { animation: rise .5s ease both; }
.rise-1 { animation-delay: .05s; }
.rise-2 { animation-delay: .12s; }
.rise-3 { animation-delay: .19s; }
.rise-4 { animation-delay: .26s; }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
    .stat-grid { grid-template-columns: repeat(2, 1fr); }
    .qa-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 860px) {
    .app-shell { grid-template-columns: 1fr; }
    .sidebar { position: fixed; left: -280px; z-index: 100; transition: left .25s ease; }
    .sidebar.open { left: 0; }
    .auth-wrap { grid-template-columns: 1fr; }
    .auth-hero { display: none; }
    /* Üst bar taşmasını önle: dolguyu küçült, aramayı daralt, ikincil ikonları gizle */
    .topbar { padding: 0 16px; gap: 12px; }
    .search-bar { min-width: 0; }
    .search-bar input { min-width: 0; width: 100%; }
    .topbar-actions { gap: 6px; }
    .topbar-actions > .icon-btn { display: none; }
    /* Sekme şeridi sayfayı taşırmasın — kendi içinde yatay kaydırılsın */
    .tabs { overflow-x: auto; flex-wrap: nowrap; }
    .tabs::-webkit-scrollbar { height: 0; }
    .tab { white-space: nowrap; flex-shrink: 0; }
}

/* Mobil menü arka örtüsü */
.sidebar-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 99; opacity: 0; visibility: hidden; transition: opacity .25s ease, visibility .25s ease; }
.sidebar-backdrop.show { opacity: 1; visibility: visible; }
@media (min-width: 861px) { .sidebar-backdrop { display: none; } }
@media (max-width: 560px) {
    .stat-grid, .qa-grid { grid-template-columns: repeat(2, 1fr); }
    .content { padding: 20px; }
}

/* ============================================================
   WORKSPACES / TABLES — entegrasyon bileşenleri
   ============================================================ */

/* Flash mesajları */
.flash {
    display: flex; align-items: center; gap: 10px;
    padding: 12px 16px; margin-bottom: 22px;
    border-radius: var(--radius-sm);
    font-size: 14px; font-weight: 500;
    animation: rise .35s ease both;
}
.flash svg { width: 18px; height: 18px; flex-shrink: 0; }
.flash span { flex: 1; }
.flash-ok  { background: var(--accent-soft); border: 1px solid var(--accent-dim); color: var(--accent-bright); }
.flash-err { background: rgba(240, 85, 109, 0.12); border: 1px solid rgba(240, 85, 109, 0.4); color: var(--danger); }
.flash-x { color: inherit; opacity: .6; }
.flash-x:hover { opacity: 1; }
.flash-x svg { width: 16px; height: 16px; }

/* Başlık satırı + inline buton */
.head-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.btn-inline { width: auto; padding: 11px 18px; font-size: 14px; }
.page-title svg { width: 28px; height: 28px; vertical-align: -5px; }
.back-link { display: inline-flex; align-items: center; gap: 6px; color: var(--text-muted); font-size: 13px; font-weight: 600; margin-bottom: 14px; }
.back-link:hover { color: var(--accent); }
.back-link svg { width: 16px; height: 16px; }

/* Sekmeler */
.tabs { display: flex; gap: 6px; border-bottom: 1px solid var(--border); margin-bottom: 26px; }
.tab {
    display: flex; align-items: center; gap: 8px;
    padding: 11px 16px; color: var(--text-secondary);
    font-size: 14px; font-weight: 600;
    border-bottom: 2px solid transparent; margin-bottom: -1px;
}
.tab:hover { color: var(--text-primary); }
.tab.active { color: var(--accent-bright); border-bottom-color: var(--accent); }
.tab-count { font-size: 12px; color: var(--text-muted); background: var(--bg-surface); padding: 1px 8px; border-radius: 20px; }
.tab.active .tab-count { color: var(--accent); background: var(--accent-soft); }
.tab-badge { font-size: 11px; font-weight: 700; color: #07221b; background: var(--warning); padding: 1px 7px; border-radius: 20px; }

.tab-panel { display: none; }
.tab-panel.active { display: block; }

/* Workspace kart eklentileri */
.ws-card .ws-link { display: block; }
.ws-menu { display: flex; gap: 4px; }
.ws-card.archived { opacity: .85; }
.icon-mini {
    width: 30px; height: 30px; border-radius: 8px;
    display: inline-grid; place-items: center;
    color: var(--text-muted); border: 1px solid transparent;
}
.icon-mini:hover { color: var(--accent-bright); background: var(--bg-surface-2); }
.icon-mini.danger:hover { color: var(--danger); }
.icon-mini svg { width: 16px; height: 16px; }

.pill { font-size: 11px; font-weight: 600; letter-spacing: .4px; text-transform: uppercase; color: var(--text-muted); background: var(--bg-surface-2); padding: 3px 10px; border-radius: 20px; }
.pill-warn { color: #07221b; background: var(--warning); }

.card-actions { display: flex; gap: 8px; margin-top: 14px; }
.btn-sm {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    width: 100%; padding: 9px 12px; border-radius: 9px;
    font-size: 13px; font-weight: 600; transition: all .15s ease;
}
.btn-sm svg { width: 15px; height: 15px; }
.btn-sm-ok { background: var(--accent-soft); color: var(--accent-bright); border: 1px solid var(--accent-dim); }
.btn-sm-ok:hover { background: var(--accent-dim); color: #07221b; }
.btn-sm-ghost { background: var(--bg-surface); color: var(--text-secondary); border: 1px solid var(--border-strong); }
.btn-sm-ghost:hover { color: var(--text-primary); border-color: var(--text-muted); }
.btn-sm-ghost.danger:hover { color: var(--danger); border-color: var(--danger); }

/* Detay düzeni */
.detail-grid { display: grid; grid-template-columns: 1fr 360px; gap: 24px; align-items: start; }
.ws-head { display: flex; align-items: center; gap: 14px; }
.ws-folder.lg { width: 56px; height: 56px; border-radius: 14px; }
.ws-folder.lg svg { width: 28px; height: 28px; }
.ws-folder.sm { width: 38px; height: 38px; border-radius: 9px; }
.ws-folder.sm svg { width: 18px; height: 18px; }
.ws-desc { color: var(--text-secondary); margin-top: 14px; max-width: 700px; font-size: 14px; }
.grid-hint { color: var(--text-muted); font-size: 12.5px; display: flex; align-items: center; gap: 7px; }
.grid-hint svg { width: 16px; height: 16px; }
.grid-hint code { background: var(--bg-surface); padding: 2px 7px; border-radius: 6px; color: var(--accent-bright); font-size: 12px; }

/* Tablo listesi */
.table-list { display: flex; flex-direction: column; gap: 8px; }
.table-row {
    display: flex; align-items: center; justify-content: space-between;
    background: var(--bg-surface); border: 1px solid var(--border);
    border-radius: var(--radius-sm); padding: 12px 14px; transition: all .15s ease;
}
.table-row:hover { border-color: var(--accent-dim); }
.table-info { display: flex; align-items: center; gap: 12px; flex: 1; }
.table-row .name { font-weight: 600; font-size: 14.5px; }
.table-row .meta { font-size: 12px; color: var(--text-muted); margin-top: 2px; }
.row-actions { display: flex; gap: 4px; }
.chev { color: var(--text-muted); }

.placeholder.sm { min-height: 220px; }
.placeholder.sm .ic { width: 60px; height: 60px; }

/* Paylaşım kutusu */
.share-box { background: var(--bg-surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 18px; }
.share-form { display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px; }
.share-form input, .share-form select { padding: 11px 13px; background: var(--bg-base); border: 1px solid var(--border-strong); border-radius: var(--radius-sm); color: var(--text-primary); font-size: 14px; outline: none; }
.share-form input:focus, .share-form select:focus { border-color: var(--accent); }
.muted-note { color: var(--text-muted); font-size: 13px; text-align: center; padding: 10px 0; }
.share-hint { text-align: left; padding: 0 0 14px; margin-top: -8px; font-size: 12.5px; line-height: 1.5; }
.field-hint { display: block; margin-top: 6px; color: var(--text-muted); font-size: 12px; line-height: 1.45; }
.collab-list { display: flex; flex-direction: column; gap: 8px; border-top: 1px solid var(--border); padding-top: 14px; }
.collab-row { display: flex; align-items: center; gap: 11px; }
.collab-avatar { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent-bright); font-weight: 700; font-size: 14px; }
.collab-meta { flex: 1; }
.collab-meta .name { font-weight: 600; font-size: 14px; }
.collab-meta .meta { font-size: 12px; color: var(--text-muted); }

/* Modal */
.modal-overlay {
    position: fixed; inset: 0; z-index: 200;
    background: rgba(7, 14, 22, 0.66); backdrop-filter: blur(4px);
    display: none; align-items: center; justify-content: center; padding: 20px;
}
.modal-overlay.open { display: flex; }
.modal {
    width: 100%; max-width: 440px;
    background: var(--bg-elevated); border: 1px solid var(--border-strong);
    border-radius: var(--radius); padding: 22px;
    animation: rise .3s ease both;
    /* Uzun formlar viewport'u aşınca içeriden kaydır; alt buton (Kaydet) hep erişilebilir kalsın. */
    max-height: calc(100vh - 40px);
    overflow-y: auto;
}
.modal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.modal-head h3 { display: flex; align-items: center; gap: 9px; font-family: var(--font-display); font-size: 18px; }
.modal-head h3 svg { width: 20px; height: 20px; color: var(--accent); }
.modal .field { margin-bottom: 14px; }
.modal .field label { display: block; font-size: 13px; color: var(--text-secondary); margin-bottom: 6px; font-weight: 500; }
.modal .field input, .modal .field select, .modal .field textarea {
    width: 100%; padding: 11px 13px; background: var(--bg-base);
    border: 1px solid var(--border-strong); border-radius: var(--radius-sm);
    color: var(--text-primary); font-size: 14px; outline: none; font-family: inherit;
}
.modal .field input:focus, .modal .field select:focus, .modal .field textarea:focus { border-color: var(--accent); }
.modal .field textarea { resize: vertical; }
/* Modal select'leri de özel chevron + native ok gizleme ile input'lara uydur */
.modal .field select {
    appearance: none; -webkit-appearance: none; -moz-appearance: none;
    cursor: pointer; padding-right: 40px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2361788a' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 12px center;
}
.modal .field select:disabled { opacity: .55; cursor: not-allowed; color: var(--text-muted); }
.modal .field select option { background: var(--bg-surface-2); color: var(--text-primary); }
.color-input { height: 44px; padding: 4px; cursor: pointer; }
.field-row { display: flex; gap: 12px; }
.field-row .field { flex: 1; }
.modal-foot { display: flex; align-items: center; justify-content: flex-end; gap: 10px; margin-top: 8px; }
.modal-foot .btn-sm { width: auto; padding: 10px 16px; }

/* ============================================================
   TABLO EDİTÖRÜ (Excel benzeri spreadsheet)
   ============================================================ */
.sheet-head { margin-bottom: 12px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.sheet-head .back-link { margin-bottom: 0; }
.embed-preview-btn { width: auto; flex-shrink: 0; }

#sheetApp {
    --cellw: 116px; --cellh: 28px; --rowhdr: 50px;
    --smono: ui-monospace, "Cascadia Code", "SF Mono", Consolas, monospace;
    display: flex; flex-direction: column;
    height: calc(100vh - 150px); min-height: 440px;
    background: var(--bg-surface);
    border: 1px solid var(--border-strong);
    border-radius: var(--radius); overflow: hidden;
}

/* Araç çubuğu */
.s-toolbar {
    display: flex; align-items: center; gap: 10px;
    padding: 6px 12px; background: var(--bg-elevated);
    border-bottom: 1px solid var(--border);
}
.s-title { display: flex; align-items: center; gap: 7px; font-family: var(--font-display); font-weight: 700; font-size: 13px; white-space: nowrap; flex-shrink: 0; }
.s-title svg { width: 16px; height: 16px; color: var(--accent); }
.s-name-edit { display: inline-grid; place-items: center; width: 26px; height: 26px; margin-left: 2px; padding: 0; border: 0; background: none; color: var(--text-muted); border-radius: 7px; cursor: pointer; transition: .14s; flex-shrink: 0; }
.s-name-edit:hover { color: var(--accent); background: var(--bg-elevated); }
.s-name-edit svg { width: 15px; height: 15px; color: inherit; }

/* Kurumsal onay akışı: taslak (Onaya Gönder) çubuğu */
.draft-bar { position: fixed; left: 50%; transform: translateX(-50%); bottom: 18px; z-index: 3500; display: flex; align-items: center; gap: 12px; padding: 10px 14px; border-radius: 14px; background: var(--bg-elevated); border: 1px solid var(--accent); box-shadow: 0 12px 40px rgba(0,0,0,.35); max-width: 94vw; }
.draft-bar[hidden] { display: none; }
.draft-bar > svg { width: 18px; height: 18px; color: var(--accent); flex-shrink: 0; }
.draft-info { font-size: 13.5px; color: var(--text-primary); white-space: nowrap; }
.draft-info b { color: var(--accent-bright); }
.draft-bar #draftNote { flex: 1; min-width: 120px; padding: 8px 11px; border: 1px solid var(--border-strong); border-radius: 9px; background: var(--bg-surface); color: var(--text-primary); font-size: 13px; }
@media (max-width: 620px) { .draft-bar #draftNote { display: none; } .draft-info { white-space: normal; } }

/* Meşgul kilidi uyarı şeridi (salt okunur) */
.busy-banner { display: flex; align-items: center; gap: 9px; padding: 10px 14px; margin: 0 0 8px; border-radius: 11px; background: rgba(217,83,79,.12); border: 1px solid rgba(217,83,79,.4); color: #d9534f; font-size: 13.5px; font-weight: 600; }
.busy-banner svg { width: 17px; height: 17px; flex-shrink: 0; }
.s-tools { display: flex; align-items: center; gap: 5px; flex-wrap: nowrap; flex: 1; min-width: 0; overflow-x: auto; }
.s-tools::-webkit-scrollbar { height: 0; }
.s-btn {
    display: inline-flex; align-items: center; gap: 5px; flex-shrink: 0;
    background: var(--bg-surface-2); border: 1px solid var(--border-strong);
    color: var(--text-secondary); padding: 5px 10px; border-radius: 7px;
    font-size: 12.5px; font-weight: 600; transition: all .15s ease;
}
.s-btn:hover { color: var(--text-primary); border-color: var(--text-muted); }
.s-btn svg { width: 14px; height: 14px; }
.s-btn.primary { background: linear-gradient(135deg, var(--accent), var(--accent-dim)); color: #07221b; border: none; }
.s-btn.primary:hover { filter: brightness(1.08); }
.s-btn.blue { background: var(--accent-soft); color: var(--accent-bright); border-color: var(--accent-dim); }
.s-grp { display: flex; gap: 2px; background: var(--bg-surface-2); border: 1px solid var(--border-strong); border-radius: 7px; padding: 2px; flex-shrink: 0; }
.s-grp button { padding: 4px 9px; border-radius: 5px; color: var(--text-secondary); font-size: 12.5px; }
.s-grp button:hover { background: var(--bg-base); color: var(--text-primary); }
.s-grp button.on { background: var(--accent); color: #07221b; }
/* Renk butonları */
/* Renk butonları artık .s-btn gibi (ikon + yazı, aynı yükseklik); gizli color input üstte */
.s-color-lbl { position: relative; cursor: pointer; }
.s-color-lbl .s-color-a { font-weight: 800; font-size: 13px; line-height: 1; }
.s-color-lbl input[type=color] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; border: none; padding: 0; background: none; }

/* Satır başlığı "Form" butonu */
.rh-form {
    position: absolute; top: 50%; right: 2px; transform: translateY(-50%);
    width: 17px; height: 17px; border-radius: 4px; cursor: pointer; z-index: 3;
    display: grid; place-items: center; color: var(--accent-bright); background: var(--bg-surface);
    opacity: 0; transition: opacity .12s ease; border: 1px solid var(--border);
}
#grid tbody tr:hover .rh-form, #grid th.rowhdr.sel .rh-form { opacity: 1; }
.rh-form:hover { background: var(--accent-soft); }
.rh-form::before { content: ''; width: 9px; height: 8px; background:
    linear-gradient(currentColor,currentColor) 0 0/100% 1.6px no-repeat,
    linear-gradient(currentColor,currentColor) 0 50%/100% 1.6px no-repeat,
    linear-gradient(currentColor,currentColor) 0 100%/100% 1.6px no-repeat; }

/* Satır → Form modalı */
.rowform-modal { max-width: 460px; }
.rowform-body { display: flex; flex-direction: column; gap: 12px; max-height: 62vh; overflow: auto; padding: 4px 2px 10px; }
.rf-field { display: flex; flex-direction: column; gap: 5px; }
.rf-field label { font-size: 12.5px; color: var(--text-secondary); font-weight: 500; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.rf-col { font-size: 11px; color: var(--text-muted); font-family: var(--smono); }
.rf-lock { font-size: 11px; color: var(--warning); }
.rf-input { padding: 11px 13px; background: var(--bg-base); border: 1px solid var(--border-strong); border-radius: var(--radius-sm); color: var(--text-primary); font-size: 15px; outline: none; }
.rf-input:focus { border-color: var(--accent); }
.rf-input[readonly] { opacity: .55; cursor: not-allowed; }
.rowform-foot { justify-content: space-between; }
.rf-nav { display: flex; align-items: center; gap: 6px; }
.rf-nav button { width: 34px; height: 34px; border-radius: 8px; display: grid; place-items: center; color: var(--text-secondary); background: var(--bg-surface-2); border: 1px solid var(--border-strong); }
.rf-nav button:hover:not(:disabled) { color: var(--accent-bright); border-color: var(--accent-dim); }
.rf-nav button:disabled { opacity: .35; cursor: not-allowed; }
.rf-nav button svg { width: 16px; height: 16px; }
.rf-pos { font-size: 12.5px; color: var(--text-muted); font-family: var(--smono); min-width: 52px; text-align: center; }
.rf-actions { display: flex; align-items: center; gap: 10px; }
.s-hint { color: var(--text-muted); font-size: 11.5px; }
.s-hint b { color: var(--accent-bright); font-weight: 600; }
.s-icon-btn {
    flex-shrink: 0; width: 30px; height: 30px; border-radius: 7px;
    display: inline-grid; place-items: center; margin-left: 4px;
    background: var(--bg-surface-2); border: 1px solid var(--border-strong);
    color: var(--text-secondary); transition: all .15s ease;
}
.s-icon-btn:hover { color: var(--accent-bright); border-color: var(--accent-dim); }
.s-icon-btn svg { width: 16px; height: 16px; }

/* Değişiklik geçmişi modalı */
.hist-modal { max-width: 560px; padding: 0; overflow: hidden; }
.hist-modal .modal-head { padding: 16px 20px; border-bottom: 1px solid var(--border); margin: 0; }
.hist-body { max-height: 64vh; overflow: auto; padding: 8px 14px 14px; }

/* ---- Tablo analizi paneli ---- */
.s-analyze-btn { background: linear-gradient(135deg, #7c3aed 0%, #4f46e5 100%); border-color: transparent; color: #fff; }
.s-analyze-btn:hover { filter: brightness(1.08); }
.analysis-modal { max-width: 720px; width: 92vw; padding: 0; overflow: hidden; }
.analysis-modal .modal-head { padding: 15px 18px; border-bottom: 1px solid var(--border); margin: 0; display: flex; align-items: center; justify-content: space-between; }
.analysis-head-actions { display: inline-flex; align-items: center; gap: 8px; }
.analysis-body { max-height: 70vh; overflow: auto; padding: 16px 18px 20px; }
.analysis-loading, .analysis-error { text-align: center; color: var(--text-muted); padding: 40px 16px; font-size: 14px; }
.analysis-error { color: #ef4444; }
.an-spin { width: 30px; height: 30px; margin: 0 auto 12px; border: 3px solid var(--accent-dim); border-top-color: var(--accent-bright); border-radius: 50%; animation: an-rot 0.8s linear infinite; }
@keyframes an-rot { to { transform: rotate(360deg); } }
.an-sec-title { font-size: 12px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--accent-bright); margin: 18px 0 8px; }
.an-sec-title:first-child { margin-top: 0; }
.an-summary { font-size: 14.5px; line-height: 1.6; color: var(--text-primary); }
.an-metrics { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.an-metric { background: var(--bg-surface-2); border: 1px solid var(--border); border-radius: 9px; padding: 8px 12px; min-width: 90px; }
.an-metric b { display: block; font-size: 17px; color: var(--text-primary); }
.an-metric span { font-size: 11.5px; color: var(--text-muted); }
.an-insights { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.an-insights li { position: relative; padding-left: 20px; font-size: 13.5px; line-height: 1.5; color: var(--text-primary); }
.an-insights li::before { content: "✦"; position: absolute; left: 0; top: 0; color: var(--accent-bright); }
.an-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.an-table th, .an-table td { text-align: left; padding: 7px 9px; border-bottom: 1px solid var(--border); }
.an-table th { color: var(--text-muted); font-weight: 700; font-size: 11px; text-transform: uppercase; letter-spacing: .03em; }
.an-table td.an-num { text-align: right; font-variant-numeric: tabular-nums; }
.an-badge { display: inline-block; padding: 1px 8px; border-radius: 20px; font-size: 11px; font-weight: 700; background: var(--accent-soft); color: var(--accent-bright); }
.an-badge.num { background: rgba(16,185,129,.15); color: #10b981; }
.an-badge.date { background: rgba(245,158,11,.15); color: #f59e0b; }
.hist-loading, .hist-empty { text-align: center; color: var(--text-muted); padding: 36px 16px; font-size: 13.5px; }
.hist-empty i { width: 34px; height: 34px; display: inline-block; margin-bottom: 8px; }
.hist-empty svg { width: 34px; height: 34px; }
.hist-list { display: flex; flex-direction: column; }
.hist-item { display: flex; gap: 12px; padding: 12px 6px; border-bottom: 1px solid var(--border); }
.hist-item:last-child { border-bottom: none; }
.hist-av {
    flex-shrink: 0; width: 34px; height: 34px; border-radius: 50%;
    display: grid; place-items: center; font-weight: 700; font-size: 14px;
    background: var(--accent-soft); color: var(--accent-bright);
}
.hist-main { flex: 1; min-width: 0; }
.hist-top { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.hist-top b { font-size: 13.5px; }
.hist-when { font-size: 12px; color: var(--text-muted); white-space: nowrap; }
.hist-change { margin-top: 4px; font-size: 13px; color: var(--text-secondary); font-family: var(--smono); display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.hist-cell { font-weight: 700; color: var(--accent-bright); background: var(--bg-base); padding: 1px 7px; border-radius: 5px; }
.hist-arrow { width: 14px; height: 14px; color: var(--text-muted); }
.hv-empty { color: var(--text-muted); font-style: italic; }
.hv-formula { color: var(--text-primary); }
.hv-calc { color: var(--accent); }
.hist-more { text-align: center; color: var(--text-muted); font-size: 12px; padding: 12px 0 4px; }

/* Formül çubuğu */
.s-fbar { display: flex; align-items: center; background: var(--bg-surface); border-bottom: 1px solid var(--border); }
.s-namebox { width: 80px; text-align: center; font-family: var(--smono); font-weight: 700; padding: 8px; border-right: 1px solid var(--border); color: var(--accent-bright); }
.s-fx {
    padding: 0 14px; min-width: 56px; height: 100%; align-self: stretch;
    color: var(--text-muted); font-style: italic; font-family: var(--smono); font-size: 13px;
    border: none; border-right: 1px solid var(--border); background: transparent;
    cursor: pointer; transition: all .15s ease; display: inline-flex; align-items: center; gap: 5px;
}
.s-fx:hover { color: var(--text-primary); background: var(--bg-surface-2); }
.s-fx.ai {
    color: #07221b; font-style: normal; font-weight: 700;
    background: linear-gradient(135deg, var(--accent-bright), var(--accent2, #1f9d7c));
}
.s-mic {
    width: 42px; align-self: stretch; display: inline-grid; place-items: center;
    background: transparent; border: none; border-right: 1px solid var(--border);
    color: var(--text-muted); cursor: pointer; transition: all .15s ease;
}
.s-mic:hover { color: var(--accent-bright); background: var(--bg-surface-2); }
.s-mic svg { width: 16px; height: 16px; }
.s-mic.rec { color: #fff; background: var(--danger); }
.s-mic.rec svg { animation: micpulse 1s ease-in-out infinite; }
@keyframes micpulse { 0%,100% { opacity: 1; transform: scale(1); } 50% { opacity: .45; transform: scale(1.18); } }

#formulaInput { flex: 1; background: transparent; border: none; outline: none; color: var(--text-primary); padding: 8px 12px; font-family: var(--smono); font-size: 13px; }
#formulaInput.ai { font-family: var(--sans, "Plus Jakarta Sans", sans-serif); font-style: normal; color: var(--accent-bright); }
#formulaInput:disabled { opacity: .6; }
.s-ai-go {
    display: inline-grid; place-items: center; width: 38px; align-self: stretch;
    background: linear-gradient(135deg, var(--accent), var(--accent-dim)); color: #07221b;
    border: none; border-left: 1px solid var(--border); cursor: pointer;
}
.s-ai-go:hover { filter: brightness(1.1); }
.s-ai-go svg { width: 16px; height: 16px; }

/* fx mod seçici (dropdown) */
.s-fx-wrap { position: relative; align-self: stretch; display: flex; }
.s-fx { gap: 6px; }
.s-fx-caret { width: 13px; height: 13px; opacity: .7; }
.s-fx-menu {
    position: absolute; top: 100%; left: 0; z-index: 60; min-width: 230px;
    background: var(--bg-elevated); border: 1px solid var(--border-strong);
    border-radius: 10px; padding: 6px; margin-top: 4px;
    box-shadow: 0 16px 40px rgba(0,0,0,.5);
}
.s-fx-menu button {
    display: flex; align-items: baseline; gap: 10px; width: 100%; text-align: left;
    padding: 9px 11px; border-radius: 7px; color: var(--text-primary); font-size: 13px;
}
.s-fx-menu button:hover { background: var(--bg-surface-2); }
.s-fx-menu button b { font-family: var(--smono); color: var(--accent-bright); min-width: 78px; font-weight: 700; }
.s-fx-menu button span { color: var(--text-muted); font-size: 12px; }

/* AI sonuç paneli */
.ai-panel {
    background: var(--bg-surface); border-bottom: 1px solid var(--border);
    max-height: 42vh; display: flex; flex-direction: column; animation: rise .25s ease both;
}
/* hidden attribute'u .ai-panel'in display:flex'ini ezebilsin diye açık override */
.ai-panel[hidden] { display: none; }
.ai-hint { color: var(--text-secondary); font-size: 13px; line-height: 1.6; }
.ai-hint b { color: var(--accent-bright); font-weight: 600; }
.ai-panel-head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 9px 14px; background: var(--bg-elevated); border-bottom: 1px solid var(--border);
    font-weight: 700; font-size: 13px; color: var(--accent-bright); font-family: var(--font-display);
}
.ai-panel-x { color: var(--text-muted); display: grid; place-items: center; width: 26px; height: 26px; border-radius: 6px; }
.ai-panel-x:hover { color: var(--text-primary); background: var(--bg-surface-2); }
.ai-panel-x svg { width: 15px; height: 15px; }
.ai-panel-body { overflow: auto; padding: 14px; }

.ai-summary { font-size: 13.5px; line-height: 1.55; color: var(--text-primary); margin-bottom: 12px; }
.ai-meta { font-size: 12px; color: var(--text-muted); margin-bottom: 12px; font-family: var(--smono); }
.ai-err { color: var(--danger); font-size: 13.5px; padding: 8px 0; }
.ai-loading { color: var(--text-muted); font-size: 13px; padding: 6px 0; }

.ai-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.ai-table th, .ai-table td { text-align: left; padding: 7px 10px; border-bottom: 1px solid var(--border); }
.ai-table th { color: var(--text-muted); font-weight: 600; }
.ai-table td.num, .ai-table th.num { text-align: right; font-family: var(--smono); }
.ai-table tr.fc-pred td { color: var(--accent-bright); }

.ai-kpis { display: flex; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; }
.ai-kpis .kpi { flex: 1; min-width: 120px; background: var(--bg-base); border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px; }
.ai-kpis .kpi span { display: block; font-size: 11px; color: var(--text-muted); text-transform: uppercase; letter-spacing: .5px; }
.ai-kpis .kpi b { font-size: 17px; font-family: var(--smono); }
.ai-kpis .kpi.pos b { color: var(--accent-bright); }
.ai-kpis .kpi.neg b { color: var(--danger); }

/* Sohbet baloncukları */
.chat-list { display: flex; flex-direction: column; gap: 8px; }
.chat-msg { max-width: 78%; padding: 9px 13px; border-radius: 12px; font-size: 13.5px; line-height: 1.5; white-space: pre-wrap; }
.chat-u { align-self: flex-end; background: linear-gradient(135deg, var(--accent), var(--accent-dim)); color: #07221b; border-bottom-right-radius: 4px; }
.chat-a { align-self: flex-start; background: var(--bg-surface-2); color: var(--text-primary); border-bottom-left-radius: 4px; position: relative; padding-right: 34px; }
.chat-tts { position: absolute; right: 5px; bottom: 5px; width: 24px; height: 24px; border-radius: 6px; display: grid; place-items: center; color: var(--text-muted); transition: all .15s ease; }
.chat-tts:hover { color: var(--accent-bright); background: var(--bg-base); }
.chat-tts svg { width: 15px; height: 15px; }
.chat-tts.playing { color: #07221b; background: var(--accent); }
.chat-tts.playing svg { animation: ttspulse 1s ease-in-out infinite; }
@keyframes ttspulse { 0%,100% { opacity: 1; } 50% { opacity: .45; } }
.chat-e { align-self: flex-start; background: rgba(240,85,109,.12); border: 1px solid rgba(240,85,109,.4); color: var(--danger); }
.chat-loading { display: flex; gap: 4px; }
.chat-loading span { width: 6px; height: 6px; border-radius: 50%; background: var(--text-muted); animation: chatdot 1.2s infinite; }
.chat-loading span:nth-child(2) { animation-delay: .2s; }
.chat-loading span:nth-child(3) { animation-delay: .4s; }
@keyframes chatdot { 0%,60%,100% { opacity: .3; } 30% { opacity: 1; } }

/* Izgara */
.s-gridwrap { flex: 1; overflow: auto; background: var(--bg-base); position: relative; -webkit-overflow-scrolling: touch; }
#grid { user-select: none; -webkit-user-select: none; }
#grid td input { user-select: text; -webkit-user-select: text; }
#grid { border-collapse: separate; border-spacing: 0; table-layout: fixed; }
#grid th, #grid td { border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); height: var(--cellh); overflow: hidden; white-space: nowrap; }
#grid thead th { position: sticky; top: 0; z-index: 3; background: var(--bg-surface-2); color: var(--text-muted); font-weight: 600; text-align: center; width: var(--cellw); user-select: none; }
#grid thead th.corner { left: 0; z-index: 5; width: var(--rowhdr); }
#grid th.rowhdr { position: sticky; left: 0; z-index: 2; background: var(--bg-surface-2); color: var(--text-muted); font-weight: 600; text-align: center; width: var(--rowhdr); user-select: none; }
#grid th.colhdr.sel, #grid th.rowhdr.sel { background: var(--accent-soft); color: var(--accent-bright); }
#grid td { width: var(--cellw); padding: 0; cursor: cell; position: relative; }
#grid td .cv { padding: 4px 7px; height: 100%; overflow: hidden; text-overflow: ellipsis; font-family: var(--smono); font-size: 12.5px; line-height: 20px; }
#grid td.num .cv { text-align: right; }
#grid td.err .cv { color: var(--danger); }
#grid td.bold .cv { font-weight: 700; }
#grid td.italic .cv { font-style: italic; }
#grid td.sel { outline: 2px solid var(--accent); outline-offset: -2px; background: var(--accent-soft); z-index: 1; }
#grid td.inrange { background: var(--accent-soft); }
#grid td input { width: 100%; height: 100%; border: none; outline: none; background: var(--bg-elevated); color: var(--text-primary); font-family: var(--smono); font-size: 12.5px; padding: 4px 7px; }
#grid col.cg-rowhdr { width: var(--rowhdr); }
/* Sütun genişliği tutamacı */
#grid th.colhdr { position: sticky; }
.col-resize { position: absolute; top: 0; right: 0; width: 6px; height: 100%; cursor: col-resize; z-index: 4; }
.col-resize:hover { background: var(--accent); opacity: .55; }
body.col-resizing { cursor: col-resize; user-select: none; }
/* Birleşmiş hücre */
#grid td.merged { background: var(--bg-surface); }
#grid td.merged .cv { white-space: normal; }

/* Hücre bağlam menüsü (sağ tık / uzun basma) */
.cell-menu {
    position: fixed; z-index: 400; min-width: 188px;
    background: var(--bg-elevated); border: 1px solid var(--border-strong);
    border-radius: 10px; padding: 6px; box-shadow: 0 16px 40px rgba(0,0,0,.5);
    animation: rise .12s ease both;
}
.cell-menu button { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; padding: 9px 11px; border-radius: 7px; color: var(--text-primary); font-size: 13px; }
.cell-menu button:hover { background: var(--bg-surface-2); }
.cell-menu button svg { width: 15px; height: 15px; color: var(--text-muted); }
.cm-sep { height: 1px; background: var(--border); margin: 5px 6px; }

/* ===== Hücre korumaları (kilit / maske / gizleme / not) göstergeleri ===== */
#grid td.cell-locked { box-shadow: inset 3px 0 0 var(--warning); }
#grid td.cell-locked::before { content: "🔒"; position: absolute; top: 0; left: 2px; font-size: 8px; opacity: .85; line-height: 1; pointer-events: none; }
#grid td.cell-masked { background: repeating-linear-gradient(45deg, transparent, transparent 5px, rgba(255,255,255,.04) 5px, rgba(255,255,255,.04) 10px); }
#grid td.cell-masked .cv { color: var(--text-muted); letter-spacing: 1px; }
#grid td.cell-hidden { opacity: .4; }
#grid td.has-note::after { content: ""; position: absolute; top: 0; right: 0; border-width: 5px; border-style: solid; border-color: var(--danger) var(--danger) transparent transparent; pointer-events: none; }
#grid th.colhdr.col-hidden, #grid th.rowhdr.row-hidden { color: var(--danger); opacity: .7; text-decoration: line-through; }

/* ===== Not popup'ı ===== */
.note-pop { position: fixed; z-index: 350; width: 290px; background: var(--bg-elevated); border: 1px solid var(--border-strong); border-radius: 12px; box-shadow: 0 16px 40px rgba(0,0,0,.5); overflow: hidden; }
.note-pop-head { display: flex; align-items: center; justify-content: space-between; padding: 10px 12px; background: var(--bg-surface-2); border-bottom: 1px solid var(--border); font-weight: 700; font-size: 13px; }
.note-list { max-height: 200px; overflow: auto; padding: 8px 10px; }
.note-empty { color: var(--text-muted); font-size: 12.5px; text-align: center; padding: 14px 0; }
.note-item { display: flex; gap: 8px; align-items: flex-start; padding: 7px 0; border-bottom: 1px solid var(--border); }
.note-item:last-child { border-bottom: none; }
.note-text { flex: 1; font-size: 12.5px; line-height: 1.45; color: var(--text-primary); }
.note-del { flex-shrink: 0; color: var(--text-muted); width: 22px; height: 22px; border-radius: 5px; display: grid; place-items: center; }
.note-del:hover { color: var(--danger); background: var(--bg-surface); }
.note-del svg { width: 13px; height: 13px; }
.note-add { display: flex; gap: 6px; padding: 8px 10px; border-top: 1px solid var(--border); }
.note-add textarea { flex: 1; resize: none; background: var(--bg-base); border: 1px solid var(--border-strong); border-radius: 8px; color: var(--text-primary); font-size: 12.5px; padding: 7px 9px; font-family: inherit; }
.note-add .btn-sm { width: auto; padding: 7px 10px; }

/* ===== Güvenlik modalı (owner) ===== */
.sec-modal { max-width: 520px; }
.sec-body { display: flex; flex-direction: column; gap: 20px; }
.sec-section { display: flex; flex-direction: column; gap: 8px; }
.sec-label { font-size: 13px; font-weight: 700; color: var(--text-primary); }
.sec-row { display: flex; gap: 8px; }
.sec-row input { flex: 1; padding: 10px 12px; background: var(--bg-base); border: 1px solid var(--border-strong); border-radius: var(--radius-sm); color: var(--text-primary); font-size: 14px; outline: none; }
.sec-row input:focus { border-color: var(--accent); }
.sec-hint { font-size: 12px; color: var(--text-muted); }
.sec-hint b { color: var(--accent-bright); }
.prot-list { display: flex; flex-direction: column; gap: 8px; max-height: 38vh; overflow: auto; }
.prot-empty { color: var(--text-muted); font-size: 13px; text-align: center; padding: 16px 0; }
.prot-item { position: relative; background: var(--bg-base); border: 1px solid var(--border); border-radius: 10px; padding: 10px 36px 10px 12px; }
.prot-main { font-size: 13px; }
.prot-exc-row { font-size: 12px; color: var(--text-secondary); margin-top: 6px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.prot-exc { background: var(--accent-soft); color: var(--accent-bright); border-radius: 12px; padding: 2px 8px; }
.prot-exc a { color: var(--danger); cursor: pointer; font-weight: 700; margin-left: 2px; }
.prot-grant { background: var(--bg-surface-2); border: 1px solid var(--border-strong); border-radius: 7px; color: var(--text-secondary); font-size: 12px; padding: 4px 6px; }
.prot-del { position: absolute; top: 8px; right: 8px; color: var(--text-muted); width: 26px; height: 26px; border-radius: 6px; display: grid; place-items: center; }
.prot-del:hover { color: var(--danger); background: var(--bg-surface); }
.prot-del svg { width: 15px; height: 15px; }
.muted { color: var(--text-muted); }

/* Durum çubuğu */
.s-status { display: flex; justify-content: space-between; align-items: center; padding: 6px 14px; background: var(--bg-elevated); border-top: 1px solid var(--border); color: var(--text-muted); font-size: 12px; }
.s-stats { display: flex; gap: 18px; font-family: var(--smono); }

/* Toast */
.s-toast { position: fixed; bottom: 28px; left: 50%; transform: translateX(-50%) translateY(20px); background: var(--accent-dim); color: #07221b; padding: 10px 18px; border-radius: 9px; opacity: 0; transition: .28s ease; pointer-events: none; font-weight: 600; box-shadow: 0 10px 30px rgba(0,0,0,.45); max-width: 80%; z-index: 300; font-size: 13px; }
.s-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
.s-toast.err { background: var(--danger); color: #fff; }

@media (max-width: 860px) {
    .detail-grid { grid-template-columns: 1fr; }
    .s-hint { display: none; }
}

/* Tablo editörü — mobil / dokunmatik uyum */
@media (max-width: 640px) {
    #sheetApp { --cellw: 90px; --cellh: 40px; --rowhdr: 48px; }
    .rh-form { opacity: .9; }                 /* dokunmatikte hover yok → her zaman görünür */
    #grid th.rowhdr .rh-num { font-size: 10px; }
    /* Araç çubuğu: tek satır, yatay kaydırılır (tüm butonlar erişilebilir kalır) */
    .s-toolbar { gap: 7px; padding: 8px 10px; overflow-x: auto; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; }
    .s-toolbar::-webkit-scrollbar { height: 0; }
    .s-title { font-size: 12.5px; flex-shrink: 0; }
    .s-title span { display: inline-block; max-width: 82px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom; }
    .s-tools { flex-wrap: nowrap; gap: 6px; flex: 0 0 auto; }
    .s-btn { padding: 9px 11px; font-size: 12px; white-space: nowrap; }
    .s-grp button { padding: 8px 12px; }
    .s-icon-btn { width: 40px; height: 40px; }
    /* Formül çubuğu: kompakt, dokunmatik dostu */
    .s-namebox { width: 50px; font-size: 12px; padding: 9px 3px; }
    .s-fx { padding: 0 9px; min-width: 0; }
    .s-fx-caret { display: none; }
    .s-mic, .s-ai-go { width: 40px; }
    #formulaInput { font-size: 16px; padding: 11px 10px; }   /* 16px: iOS/WebView odakta otomatik zoom yapmaz */
    .s-fx-menu { min-width: 210px; }
    /* Hücreler ve başlıklar */
    #grid td .cv { padding: 9px 7px; font-size: 13px; line-height: 20px; }
    #grid td input { font-size: 16px; padding: 9px 7px; }
    #grid thead th, #grid th.rowhdr { font-size: 11px; }
    /* Durum çubuğu kompakt */
    .s-status { padding: 6px 10px; font-size: 11px; }
    .s-stats { gap: 12px; }
    .ai-panel { max-height: 52vh; }
    /* Detay sayfasında üst başlık + embed butonu mobilde küçülsün */
    .sheet-head { margin-bottom: 8px; }
    .embed-preview-btn { padding: 8px 10px; font-size: 12px; }
}

/* ============================================================
   EMBED (mobil WebView — tam ekran tablo editörü)
   ============================================================ */
.embed-body { height: 100vh; height: 100dvh; overflow: hidden; }
.embed-body #sheetApp {
    height: 100vh; height: 100dvh;
    border: none; border-radius: 0;
}
.embed-msg { display: grid; place-items: center; height: 100vh; height: 100dvh; padding: 24px; }
.embed-msg-card {
    text-align: center; max-width: 360px;
    background: var(--bg-surface); border: 1px solid var(--border-strong);
    border-radius: var(--radius); padding: 36px 28px;
}
.embed-msg-card > i { color: var(--text-muted); width: 40px; height: 40px; display: inline-block; }
.embed-msg-card svg { width: 40px; height: 40px; }
.embed-msg-card h2 { font-family: var(--font-display); font-size: 22px; margin: 14px 0 8px; }
.embed-msg-card p { color: var(--text-secondary); font-size: 14px; }
.embed-msg-hint { display: block; margin-top: 16px; color: var(--text-muted); font-size: 12.5px; }

/* ============================================================
   HESAP MAKİNESİ
   ============================================================ */
.calc-wrap { display: grid; grid-template-columns: minmax(0,420px) 1fr; gap: 20px; align-items: start; max-width: 920px; }
.calc-card { background: var(--bg-surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 14px; }
.calc-tabs { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 10px; margin-bottom: 8px; border-bottom: 1px solid var(--border); }
.calc-tabs::-webkit-scrollbar { height: 0; }
.calc-tab { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border-radius: 9px; background: var(--bg-surface-2); color: var(--text-secondary); font-size: 13px; font-weight: 600; white-space: nowrap; flex-shrink: 0; }
.calc-tab.active { background: #1f6feb; color: #fff; }
.calc-tab-x { opacity: .7; font-size: 15px; line-height: 1; }
.calc-tab-x:hover { opacity: 1; }
.calc-tab-add { width: 32px; height: 32px; border-radius: 9px; background: var(--bg-surface-2); color: var(--text-secondary); font-size: 18px; flex-shrink: 0; }
.calc-tab-add:hover { color: var(--accent-bright); }

.calc-display { text-align: right; padding: 14px 12px 8px; }
.calc-expr { font-family: var(--smono); color: var(--text-muted); font-size: 15px; min-height: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.calc-result { font-family: var(--font-display); font-weight: 700; font-size: 40px; color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1.1; margin-top: 4px; }

.calc-sci-bar { display: flex; align-items: center; justify-content: space-between; padding: 4px 4px 10px; }
.calc-deg { font-size: 11px; font-weight: 700; letter-spacing: .5px; color: var(--text-secondary); background: var(--bg-surface-2); border: 1px solid var(--border-strong); border-radius: 7px; padding: 5px 10px; }
.calc-deg:hover { color: var(--accent-bright); }
.calc-sci-toggle { display: inline-flex; align-items: center; gap: 6px; color: #2f81f7; font-size: 12px; font-weight: 700; letter-spacing: 1px; margin: 0 auto; }
.calc-sci-toggle svg { width: 14px; height: 14px; transition: transform .2s ease; }
.calc-sci-toggle.open svg { transform: rotate(180deg); }

.calc-sci { display: grid; grid-template-columns: repeat(5, 1fr); gap: 7px; margin-bottom: 8px; }
.calc-sci[hidden] { display: none; }
.calc-keys { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.ck { height: 56px; border-radius: 14px; background: var(--bg-surface-2); color: var(--text-primary); font-size: 20px; font-weight: 600; display: grid; place-items: center; transition: all .12s ease; }
.ck:hover { background: var(--bg-elevated); }
.ck:active { transform: scale(.96); }
.ck svg { width: 20px; height: 20px; }
.ck.sci { height: 44px; font-size: 14px; background: var(--bg-base); color: var(--text-secondary); }
.ck.sci:hover { color: var(--accent-bright); }
.ck.fn { background: var(--bg-base); color: var(--text-secondary); }
.ck.op { background: var(--accent-soft); color: #2f81f7; font-size: 22px; }
.ck.op:hover { background: rgba(31,111,235,.22); }
.ck.eq { background: linear-gradient(135deg, var(--accent), var(--accent-dim)); color: #07221b; }
.ck.eq:hover { filter: brightness(1.08); }

.calc-history { background: var(--bg-surface); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; position: sticky; top: 0; }
.calc-history-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid var(--border); font-weight: 700; font-size: 14px; }
.calc-history-head span { display: flex; align-items: center; gap: 8px; }
.calc-history-head svg { width: 16px; height: 16px; color: var(--accent); }
.calc-history-head button { color: var(--text-muted); width: 30px; height: 30px; border-radius: 7px; display: grid; place-items: center; }
.calc-history-head button:hover { color: var(--danger); background: var(--bg-surface-2); }
.calc-history-list { max-height: 64vh; overflow: auto; }
.calc-hist-empty { color: var(--text-muted); text-align: center; padding: 30px 16px; font-size: 13px; }
.calc-hist-item { position: relative; padding: 12px 36px 12px 16px; border-bottom: 1px solid var(--border); cursor: pointer; }
.calc-hist-item:hover { background: var(--bg-surface-2); }
.chi-expr { font-family: var(--smono); font-size: 13px; color: var(--text-secondary); }
.chi-res { font-family: var(--smono); font-size: 16px; font-weight: 700; color: var(--accent-bright); margin-top: 2px; }
.chi-del { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); color: var(--text-muted); width: 24px; height: 24px; border-radius: 6px; font-size: 16px; opacity: 0; }
.calc-hist-item:hover .chi-del { opacity: 1; }
.chi-del:hover { color: var(--danger); background: var(--bg-base); }

@media (max-width: 820px) {
    .calc-wrap { grid-template-columns: 1fr; }
    .calc-history { position: static; }
    .ck { height: 52px; }
    .calc-result { font-size: 34px; }
}

/* Hesap makinesi — hafıza tuşları / sürükle-sırala / tekrar hesapla */
.calc-mem { display: flex; align-items: center; gap: 6px; padding: 0 2px 10px; }
.calc-mem-ind { font-size: 11px; font-weight: 800; color: #2f81f7; width: 16px; text-align: center; opacity: 0; transition: opacity .15s ease; }
.calc-mem.has-mem .calc-mem-ind { opacity: 1; }
.mk { flex: 1; height: 34px; border-radius: 9px; background: var(--bg-base); color: var(--text-secondary); font-size: 12.5px; font-weight: 700; letter-spacing: .3px; transition: all .12s ease; }
.mk:hover { color: var(--accent-bright); background: var(--bg-surface-2); }
.mk:active { transform: scale(.95); }

.calc-tab { cursor: grab; }
.calc-tab:active { cursor: grabbing; }
.calc-tab.dragging { opacity: .4; }
.calc-tab.drop-target { box-shadow: inset 3px 0 0 #2f81f7; }

.calc-hist-item { display: flex; align-items: center; gap: 8px; padding: 10px 10px 10px 16px; }
.chi-main { flex: 1; min-width: 0; }
.chi-main .chi-expr, .chi-main .chi-res { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chi-actions { display: flex; gap: 2px; flex-shrink: 0; opacity: 0; transition: opacity .12s ease; }
.calc-hist-item:hover .chi-actions { opacity: 1; }
.chi-recalc, .chi-del { position: static; transform: none; top: auto; right: auto; opacity: 1; width: 28px; height: 28px; border-radius: 7px; display: grid; place-items: center; font-size: 15px; color: var(--text-muted); }
.chi-recalc { font-size: 16px; }
.chi-recalc:hover { color: var(--accent-bright); background: var(--bg-base); }
.chi-del:hover { color: var(--danger); background: var(--bg-base); }
@media (hover: none), (max-width: 820px) { .chi-actions { opacity: 1; } }
.calc-tab { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.calc-tab-edit { opacity: .75; font-size: 12px; line-height: 1; cursor: pointer; padding: 0 1px; }
.calc-tab-edit:hover { opacity: 1; }

/* ============================================================
   DÖNÜŞTÜRÜCÜ
   ============================================================ */
.page-sub { color: var(--text-secondary); font-size: 13.5px; margin-top: 4px; }

.conv-tabs { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; margin: 18px 0 18px; }
.conv-tabs::-webkit-scrollbar { height: 0; }
.conv-tab { display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; border-radius: 12px; background: var(--bg-surface); border: 1px solid var(--border); color: var(--text-secondary); font-size: 13.5px; font-weight: 600; white-space: nowrap; flex-shrink: 0; transition: all .15s ease; }
.conv-tab svg { width: 16px; height: 16px; }
.conv-tab:hover { color: var(--text-primary); border-color: var(--border-strong); }
.conv-tab.active { background: var(--accent); color: #07221b; border-color: transparent; }

.conv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; }
.conv-card { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 18px; border-radius: 16px; background: var(--bg-surface); border: 1px solid var(--border); text-align: left; transition: all .15s ease; }
.conv-card:hover { transform: translateY(-3px); border-color: var(--border-strong); box-shadow: 0 14px 30px rgba(0,0,0,.18); }
.conv-ic { width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center; }
.conv-ic svg { width: 23px; height: 23px; }
.conv-card-title { font-size: 15.5px; font-weight: 700; color: var(--text-primary); }
.conv-card-sub { font-size: 11.5px; letter-spacing: .4px; color: var(--text-muted); font-weight: 600; }

.tile-red    { background: rgba(248,81,73,.14);  color: #ff7b72; }
.tile-blue   { background: rgba(47,129,247,.15); color: #4493f8; }
.tile-green  { background: rgba(63,185,80,.15);  color: #56d364; }
.tile-amber  { background: rgba(240,180,40,.16); color: #e3a008; }
.tile-purple { background: rgba(163,113,247,.16);color: #bc8cff; }
.tile-pink   { background: rgba(240,98,178,.16); color: #f778ba; }
.tile-sky    { background: rgba(56,189,248,.16); color: #56c6f0; }
.tile-teal   { background: rgba(45,212,191,.16); color: #2dd4bf; }

/* Modal */
.conv-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.55); backdrop-filter: blur(3px); display: grid; place-items: center; z-index: 1000; padding: 20px; }
.conv-modal-overlay[hidden] { display: none; }
.conv-modal { width: min(480px, 100%); background: var(--bg-surface); border: 1px solid var(--border); border-radius: 18px; padding: 20px; box-shadow: 0 30px 70px rgba(0,0,0,.5); }
.conv-modal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.cm-title { font-family: var(--font-display); font-size: 19px; font-weight: 700; }
.cm-close { width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; color: var(--text-muted); }
.cm-close:hover { background: var(--bg-surface-2); color: var(--text-primary); }

.cm-drop { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 30px 20px; border: 2px dashed var(--border-strong); border-radius: 14px; cursor: pointer; transition: all .15s ease; text-align: center; }
.cm-drop:hover, .cm-drop.over { border-color: var(--accent); background: var(--accent-soft); }
.cm-drop svg { width: 34px; height: 34px; color: var(--accent); }
.cm-drop-main { font-weight: 600; color: var(--text-primary); font-size: 14px; }
.cm-drop-hint { font-size: 12px; color: var(--text-muted); }

.cm-file { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 12px; background: var(--bg-surface-2); border: 1px solid var(--border); }
.cm-file > svg { width: 20px; height: 20px; color: var(--accent); flex-shrink: 0; }
.cm-file-name { flex: 1; min-width: 0; font-size: 13.5px; color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cm-file-x { width: 28px; height: 28px; border-radius: 7px; display: grid; place-items: center; color: var(--text-muted); flex-shrink: 0; }
.cm-file-x:hover { background: var(--bg-base); color: var(--danger); }
.cm-file-x svg { width: 16px; height: 16px; }

.cm-status { margin-top: 14px; padding: 12px 14px; border-radius: 11px; font-size: 13.5px; display: flex; align-items: center; gap: 9px; }
.cm-status svg { width: 18px; height: 18px; flex-shrink: 0; }
.cm-status.loading { background: var(--bg-surface-2); color: var(--text-secondary); }
.cm-status.ok { background: rgba(63,185,80,.13); color: #56d364; }
.cm-status.err { background: rgba(248,81,73,.13); color: #ff7b72; }
.cm-status b { font-weight: 700; }
.cm-spin { width: 16px; height: 16px; border: 2px solid var(--border-strong); border-top-color: var(--accent); border-radius: 50%; display: inline-block; animation: convspin .7s linear infinite; flex-shrink: 0; }
@keyframes convspin { to { transform: rotate(360deg); } }

.cm-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 18px; }
.btn-ghost { padding: 11px 18px; border-radius: 11px; background: var(--bg-surface-2); color: var(--text-secondary); font-weight: 600; font-size: 13.5px; }
.btn-ghost:hover { color: var(--text-primary); background: var(--bg-elevated); }
.cm-actions .btn-primary { display: inline-flex; align-items: center; gap: 8px; }
.cm-actions .btn-primary svg { width: 16px; height: 16px; }
.btn-primary.loading { opacity: .7; pointer-events: none; }
.btn-primary:disabled { opacity: .5; pointer-events: none; transform: none; box-shadow: none; }

@media (max-width: 640px) {
    .conv-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
    .conv-card { padding: 14px; }
    .conv-card-title { font-size: 14px; }
}

/* ============================================================
   MARKET
   ============================================================ */
.mk-wrap { display: grid; grid-template-columns: minmax(0,1fr) 320px; gap: 20px; align-items: start; margin-top: 18px; }
.mk-main { min-width: 0; }

.mk-cats { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.mk-cat { padding: 8px 15px; border-radius: 10px; background: var(--bg-surface); border: 1px solid var(--border); color: var(--text-secondary); font-size: 13px; font-weight: 600; transition: all .14s ease; }
.mk-cat:hover { color: var(--text-primary); border-color: var(--border-strong); }
.mk-cat.active { background: var(--accent); color: #07221b; border-color: transparent; }

.mk-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 14px; }
.mk-loading { grid-column: 1/-1; display: flex; align-items: center; gap: 10px; color: var(--text-muted); padding: 28px; font-size: 14px; }
.mk-card { display: flex; flex-direction: column; gap: 9px; padding: 16px; border-radius: 15px; background: var(--bg-surface); border: 1px solid var(--border); transition: all .15s ease; }
.mk-card:hover { transform: translateY(-3px); border-color: var(--border-strong); box-shadow: 0 14px 30px rgba(0,0,0,.18); }
.mk-card-ic { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; }
.mk-card-ic svg { width: 21px; height: 21px; }
.mk-card-name { font-size: 15px; font-weight: 700; color: var(--text-primary); line-height: 1.25; }
.mk-card-sub { font-size: 12px; color: var(--text-muted); flex: 1; line-height: 1.4; }
.mk-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 4px; }
.mk-price { font-size: 18px; font-weight: 800; color: var(--text-primary); }
.mk-price.tok { color: #e3a008; font-size: 16px; }
.mk-price small { font-size: 11px; font-weight: 600; color: var(--text-muted); }
.mk-buy { padding: 8px 14px; border-radius: 10px; background: var(--accent); color: #07221b; font-weight: 700; font-size: 12.5px; white-space: nowrap; transition: all .14s ease; }
.mk-buy:hover { filter: brightness(1.08); transform: translateY(-1px); }

/* Sağ kolon */
.mk-side { display: flex; flex-direction: column; gap: 16px; position: sticky; top: 0; }
.mk-wallet { background: linear-gradient(150deg, var(--accent), var(--accent-dim)); border-radius: 16px; padding: 18px; color: #07221b; }
.mk-wallet-top { display: flex; align-items: center; justify-content: space-between; }
.mk-wallet-label { display: inline-flex; align-items: center; gap: 7px; font-weight: 700; font-size: 13px; opacity: .85; }
.mk-wallet-label svg { width: 16px; height: 16px; }
.mk-wallet-balance { font-family: var(--font-display); font-size: 34px; font-weight: 800; margin: 8px 0 6px; }
.mk-wallet-meta { display: flex; flex-direction: column; gap: 3px; font-size: 12px; font-weight: 600; opacity: .8; }
.mk-wallet-meta span { display: inline-flex; align-items: center; gap: 6px; }
.mk-wallet-meta svg { width: 13px; height: 13px; }

.mk-panel { background: var(--bg-surface); border: 1px solid var(--border); border-radius: 16px; overflow: hidden; }
.mk-panel-head { display: flex; align-items: center; gap: 8px; padding: 13px 15px; border-bottom: 1px solid var(--border); font-weight: 700; font-size: 13.5px; }
.mk-panel-head svg { width: 16px; height: 16px; color: var(--accent); }
.mk-empty { padding: 18px 15px; color: var(--text-muted); font-size: 12.5px; text-align: center; }

.mk-ent-list { padding: 6px; display: flex; flex-direction: column; gap: 2px; }
.mk-ent { display: flex; align-items: center; gap: 10px; padding: 8px 9px; border-radius: 10px; }
.mk-ent:hover { background: var(--bg-surface-2); }
.mk-ent-ic { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; flex-shrink: 0; }
.mk-ent-ic svg { width: 15px; height: 15px; }
.mk-ent-name { flex: 1; min-width: 0; font-size: 12.5px; color: var(--text-secondary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mk-ent-q { font-weight: 800; color: var(--accent-bright); font-size: 14px; }

.mk-pur-list { padding: 4px; }
.mk-pur { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 11px; border-radius: 10px; }
.mk-pur:hover { background: var(--bg-surface-2); }
.mk-pur-name { font-size: 12.5px; color: var(--text-primary); font-weight: 600; }
.mk-pur-date { font-size: 11px; color: var(--text-muted); }
.mk-pur-cost { font-size: 12.5px; font-weight: 700; color: var(--text-secondary); white-space: nowrap; }

/* Satın alma modalı (dönüştürücüdeki .cm-* sınıflarını paylaşır) */
.mk-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.55); backdrop-filter: blur(3px); display: grid; place-items: center; z-index: 1000; padding: 20px; }
.mk-modal-overlay[hidden] { display: none; }
.mk-modal { width: min(440px, 100%); background: var(--bg-surface); border: 1px solid var(--border); border-radius: 18px; padding: 20px; box-shadow: 0 30px 70px rgba(0,0,0,.5); }
.mk-modal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.mk-modal-title { font-family: var(--font-display); font-size: 18px; font-weight: 700; }
.bm-body { display: flex; flex-direction: column; gap: 2px; }
.bm-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; padding: 9px 0; border-bottom: 1px solid var(--border); font-size: 13.5px; }
.bm-row span { color: var(--text-muted); flex-shrink: 0; }
.bm-row b { color: var(--text-primary); text-align: right; }
.bm-row.bm-cost b { font-size: 18px; color: var(--accent-bright); }
.bm-note { display: flex; gap: 8px; margin-top: 12px; padding: 11px 13px; border-radius: 11px; background: var(--bg-surface-2); color: var(--text-secondary); font-size: 12px; line-height: 1.45; }
.bm-note svg { width: 16px; height: 16px; flex-shrink: 0; color: var(--accent); }

/* Plan dönemi seçimi (aylık / 3 / 6 / 12 aylık + KDV) */
.pl-periods { display: flex; flex-direction: column; gap: 10px; margin-top: 14px; }
.pl-period { display: flex; align-items: center; gap: 12px; padding: 13px 15px; border: 1.5px solid var(--border-strong); border-radius: 13px; cursor: pointer; transition: .14s; }
.pl-period:hover { border-color: var(--accent); }
.pl-period.sel { border-color: var(--accent); background: var(--accent-soft, rgba(20,184,166,.10)); }
.pl-period input { accent-color: var(--accent); width: 17px; height: 17px; flex-shrink: 0; }
.pl-period-main { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.pl-period-main b { font-size: 14.5px; color: var(--text-primary); }
.pl-period-main small { font-size: 12px; color: var(--text-muted); }
.pl-period-total { font-family: var(--font-display); font-weight: 800; font-size: 17px; color: var(--accent-bright); flex-shrink: 0; }

/* Kurumsal (enterprise) koltuk seçimi */
.ent-rows { display: flex; flex-direction: column; gap: 10px; margin: 6px 0 4px; }
.ent-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border: 1.5px solid var(--border-strong); border-radius: 13px; }
.ent-row-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ent-row-main b { font-size: 14.5px; color: var(--text-primary); }
.ent-row-main small { font-size: 12px; color: var(--text-muted); }
.ent-step { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.ent-btn { width: 32px; height: 32px; border-radius: 9px; border: 1px solid var(--border-strong); background: var(--bg-elevated); color: var(--text-primary); font-size: 19px; line-height: 1; font-weight: 700; cursor: pointer; display: grid; place-items: center; transition: .14s; }
.ent-btn:hover { border-color: var(--accent); color: var(--accent); }
.ent-count { min-width: 26px; text-align: center; font-family: var(--font-display); font-weight: 800; font-size: 16px; color: var(--text-primary); }
.ent-summary { margin-top: 14px; }

@media (max-width: 880px) {
    .mk-wrap { grid-template-columns: 1fr; }
    .mk-side { position: static; }
}

/* ============================================================
   PLANLAR / ABONELİK
   ============================================================ */
.head-link { display: inline-flex; align-items: center; gap: 7px; flex-shrink: 0; }
.head-link svg { width: 15px; height: 15px; }

.pl-current { display: flex; align-items: center; gap: 9px; margin: 16px 0 18px; padding: 12px 16px; border-radius: 12px; background: var(--accent-soft); border: 1px solid var(--border); color: var(--text-secondary); font-size: 13.5px; }
.pl-current svg { width: 18px; height: 18px; color: var(--accent); flex-shrink: 0; }
.pl-current b { color: var(--text-primary); }

.pl-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(205px, 1fr)); gap: 14px; margin-bottom: 28px; }
.pl-card { position: relative; display: flex; flex-direction: column; padding: 20px 18px; border-radius: 16px; background: var(--bg-surface); border: 1px solid var(--border); transition: all .15s ease; }
.pl-card:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(0,0,0,.18); }
.pl-card.popular { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent); }
.pl-card.current { border-color: var(--accent-bright); }
.pl-badge { position: absolute; top: -10px; left: 50%; transform: translateX(-50%); background: var(--accent); color: #07221b; font-size: 11px; font-weight: 800; padding: 3px 12px; border-radius: 20px; white-space: nowrap; }
.pl-name { font-family: var(--font-display); font-size: 18px; font-weight: 700; color: var(--text-primary); }
.pl-price { font-size: 24px; font-weight: 800; color: var(--text-primary); margin: 6px 0 14px; }
.pl-price small { font-size: 12px; font-weight: 600; color: var(--text-muted); }
.pl-feats { list-style: none; padding: 0; margin: 0 0 16px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.pl-feats li { display: flex; align-items: flex-start; gap: 8px; font-size: 12.5px; color: var(--text-secondary); line-height: 1.35; }
.pl-feats svg { width: 15px; height: 15px; color: var(--accent); flex-shrink: 0; margin-top: 1px; }
.pl-btn { padding: 11px 14px; border-radius: 11px; background: var(--accent); color: #07221b; font-weight: 700; font-size: 13.5px; width: 100%; transition: all .14s ease; }
.pl-btn:hover { filter: brightness(1.08); transform: translateY(-1px); }
.pl-btn.cur { background: var(--bg-surface-2); color: var(--text-muted); cursor: default; }
.pl-btn.cur:hover { transform: none; filter: none; }

.pl-compare-wrap { margin-top: 8px; }
.pl-compare-title { display: flex; align-items: center; gap: 9px; font-family: var(--font-display); font-size: 18px; font-weight: 700; margin-bottom: 14px; }
.pl-compare-title svg { width: 19px; height: 19px; color: var(--accent); }
.pl-compare-scroll { overflow-x: auto; border: 1px solid var(--border); border-radius: 14px; }
.pl-compare { width: 100%; border-collapse: collapse; min-width: 640px; font-size: 13px; }
.pl-compare th, .pl-compare td { padding: 11px 14px; text-align: center; border-bottom: 1px solid var(--border); white-space: nowrap; }
.pl-compare thead th { background: var(--bg-surface-2); font-weight: 700; color: var(--text-primary); position: sticky; top: 0; }
.pl-compare thead th .cmp-price { display: block; font-size: 11.5px; font-weight: 600; color: var(--text-muted); margin-top: 2px; }
.pl-compare .cmp-feat { text-align: left; color: var(--text-secondary); font-weight: 600; position: sticky; left: 0; background: var(--bg-surface); z-index: 1; }
.pl-compare thead .cmp-feat { background: var(--bg-surface-2); z-index: 2; }
.pl-compare tbody tr:hover td { background: var(--bg-surface-2); }
.pl-compare tbody tr:hover .cmp-feat { background: var(--bg-elevated); }
.pl-compare td.cmp-cur, .pl-compare th.cmp-cur { background: var(--accent-soft); color: var(--text-primary); }
.cmp-yes { width: 17px; height: 17px; color: #56d364; }
.cmp-no { width: 16px; height: 16px; color: var(--text-muted); opacity: .5; }

/* ============================================================
   YENİDEN TASARIM — selamlama topbar + alt navigasyon
   ============================================================ */
.topbar-user { display: flex; align-items: center; gap: 12px; margin-right: auto; min-width: 0; }
.tb-avatar { width: 42px; height: 42px; border-radius: 50%; background: linear-gradient(140deg, var(--accent), var(--accent-dim)); color: #07221b; font-weight: 800; font-size: 17px; display: grid; place-items: center; flex-shrink: 0; }
.tb-greet { display: flex; flex-direction: column; line-height: 1.15; min-width: 0; }
.tb-hi { font-size: 11px; letter-spacing: 1.4px; text-transform: uppercase; color: var(--accent2); font-weight: 700; }
.tb-name { font-family: var(--font-display); font-weight: 800; font-size: 18px; color: var(--text-primary); text-transform: uppercase; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Alt navigasyon (mobil) */
.bottom-nav { display: none; }
@media (max-width: 860px) {
    .bottom-nav {
        display: flex; align-items: center; justify-content: space-around;
        position: fixed; left: 0; right: 0; bottom: 0; z-index: 80;
        height: 62px; padding-bottom: env(safe-area-inset-bottom);
        background: var(--bg-base); border-top: 1px solid var(--border);
        box-shadow: 0 -8px 24px rgba(0,0,0,.18);
    }
    .content { padding-bottom: calc(78px + env(safe-area-inset-bottom)); }
    .tb-name { font-size: 16px; }
    .tb-avatar { width: 38px; height: 38px; font-size: 15px; }
}
.bn-item { display: flex; flex-direction: column; align-items: center; gap: 3px; flex: 1; color: var(--text-muted); font-size: 10.5px; font-weight: 600; padding: 6px 0; }
.bn-item svg { width: 22px; height: 22px; }
.bn-item.active { color: var(--accent2); }
.bn-center { flex: 0 0 auto; }
.bn-logo {
    width: 60px; height: 60px; border-radius: 50%;
    display: grid; place-items: center; margin-top: -28px;
    background: var(--bg-base);
    box-shadow: 0 0 0 5px var(--bg-deep), 0 0 22px var(--logo-glow);
    border: 2px solid var(--accent);
}
.bn-logo img { width: 34px; height: 34px; }

/* ============================================================
   YENİDEN TASARIM — Dashboard
   ============================================================ */
.dash-hero { display: flex; flex-wrap: wrap; align-items: stretch; background: var(--bg-surface); border: 1px solid var(--border); border-radius: 18px; padding: 16px 6px; margin-bottom: 16px; }
.dh-brand { flex: 0 0 auto; display: grid; place-items: center; padding: 0 14px; }
.dh-brand img { width: 62px; height: 62px; object-fit: contain; }
.dh-stat { flex: 1 1 100px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 8px 4px; border-left: 1px solid var(--border); text-align: center; min-width: 96px; }
.dh-ic { width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center; }
.dh-ic svg { width: 20px; height: 20px; }
.dh-val { font-family: var(--font-display); font-size: 26px; font-weight: 800; color: var(--text-primary); line-height: 1; }
.dh-lim { font-size: 16px; font-weight: 700; color: var(--text-muted); }
.dh-lbl { font-size: 12px; color: var(--text-muted); }
.dh-rem { font-size: 11px; font-weight: 600; color: var(--accent); background: var(--accent-soft); padding: 2px 8px; border-radius: 999px; }

.dash-search { display: flex; gap: 10px; margin-bottom: 14px; }
.ds-input { flex: 1; display: flex; align-items: center; gap: 10px; background: var(--bg-surface); border: 1px solid var(--border); border-radius: 14px; padding: 13px 16px; min-width: 0; }
.ds-input svg { width: 18px; height: 18px; color: var(--text-muted); flex-shrink: 0; }
.ds-input input { flex: 1; min-width: 0; background: none; border: none; outline: none; color: var(--text-primary); font-size: 14px; font-family: inherit; }
.ds-input input::placeholder { color: var(--text-muted); }
.ds-filter { width: 50px; flex-shrink: 0; background: var(--bg-surface); border: 1px solid var(--border); border-radius: 14px; display: grid; place-items: center; color: var(--text-secondary); }
.ds-filter:hover { color: var(--accent2); border-color: var(--border-strong); }
.ds-filter svg { width: 20px; height: 20px; }

.dash-chips { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; margin-bottom: 26px; }
.dash-chips::-webkit-scrollbar { height: 0; }
.dchip { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 11px; background: var(--bg-surface); border: 1px solid var(--border); color: var(--text-secondary); font-size: 13px; font-weight: 600; white-space: nowrap; flex-shrink: 0; }
.dchip svg { width: 15px; height: 15px; }
.dchip:hover { color: var(--text-primary); }
.dchip.active { color: var(--accent2); border-color: var(--accent2); background: var(--accent2-soft); }

.dash-block { margin-bottom: 28px; }
.db-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.db-head h2 { font-family: var(--font-display); font-size: 18px; font-weight: 700; color: var(--text-primary); }
.db-link { display: inline-flex; align-items: center; gap: 5px; color: var(--accent2); font-size: 13.5px; font-weight: 600; }
.db-link svg { width: 14px; height: 14px; }

.qa-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.qa-tile { display: flex; flex-direction: column; align-items: center; gap: 9px; padding: 16px 8px; border-radius: 16px; background: var(--bg-surface); border: 1px solid var(--border); transition: all .15s ease; text-align: center; }
.qa-tile:hover { transform: translateY(-3px); border-color: var(--border-strong); box-shadow: var(--shadow); }
.qa-ic { width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center; }
.qa-ic svg { width: 23px; height: 23px; }
.qa-t { font-size: 11.5px; font-weight: 700; color: var(--text-primary); letter-spacing: .2px; text-transform: uppercase; line-height: 1.2; }

.dash-recent { display: flex; flex-direction: column; gap: 10px; }
.dr-row { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px; background: var(--bg-surface); border: 1px solid var(--border); transition: all .15s ease; }
.dr-row:hover { border-color: var(--border-strong); }
.dr-ic { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; flex-shrink: 0; }
.dr-ic svg { width: 20px; height: 20px; }
.dr-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.dr-name { font-weight: 700; font-size: 14.5px; color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dr-meta { font-size: 12px; color: var(--text-muted); }
.dr-share { color: var(--text-muted); display: grid; place-items: center; flex-shrink: 0; }
.dr-share svg { width: 19px; height: 19px; }
.dr-more { width: 32px; height: 32px; border-radius: 8px; color: var(--text-muted); display: grid; place-items: center; flex-shrink: 0; }
.dr-more:hover { background: var(--bg-surface-2); color: var(--text-primary); }
.dr-more svg { width: 18px; height: 18px; }

.dash-ai { display: flex; align-items: center; gap: 16px; padding: 18px; border-radius: 18px; background: linear-gradient(135deg, var(--accent-soft), transparent 60%), var(--bg-surface); border: 1px solid var(--border); transition: all .15s ease; }
.dash-ai:hover { border-color: var(--accent-dim); transform: translateY(-2px); }
.dai-logo { width: 62px; height: 62px; border-radius: 50%; display: grid; place-items: center; flex-shrink: 0; background: radial-gradient(circle, var(--accent-soft), transparent 70%); box-shadow: 0 0 22px var(--logo-glow); }
.dai-logo img { width: 38px; height: 38px; }
.dai-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.dai-title { font-family: var(--font-display); font-size: 17px; font-weight: 700; color: var(--text-primary); }
.dai-desc { font-size: 12.5px; color: var(--text-secondary); line-height: 1.4; }
.dai-btn { flex-shrink: 0; display: inline-flex; align-items: center; gap: 5px; padding: 11px 16px; border-radius: 12px; border: 1px solid var(--accent2); color: var(--accent2); font-weight: 700; font-size: 13px; white-space: nowrap; }
.dai-btn svg { width: 15px; height: 15px; }

@media (max-width: 560px) {
    .dh-brand { padding: 0 8px; } .dh-brand img { width: 50px; height: 50px; }
    .dh-val { font-size: 21px; } .dh-ic { width: 34px; height: 34px; } .dh-ic svg { width: 17px; height: 17px; } .dh-lbl { font-size: 10.5px; }
    .dh-lim { font-size: 13px; } .dh-rem { font-size: 9.5px; padding: 2px 6px; }
    .qa-grid { gap: 9px; } .qa-tile { padding: 13px 5px; } .qa-ic { width: 42px; height: 42px; }
    .dash-ai { flex-wrap: wrap; } .dai-btn { width: 100%; justify-content: center; }
}
.dr-empty { display: flex; align-items: center; gap: 9px; padding: 16px; border-radius: 14px; background: var(--bg-surface); border: 1px dashed var(--border-strong); color: var(--text-muted); font-size: 13px; }
.dr-empty svg { width: 18px; height: 18px; color: var(--accent); flex-shrink: 0; }

/* ============================================================
   YENİDEN TASARIM — Workspaces (renkli liste)
   ============================================================ */
.ws-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.ws-title { font-family: var(--font-display); font-size: 26px; font-weight: 800; color: var(--text-primary); }
.ws-view-toggle { width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center; color: var(--accent2); background: var(--accent2-soft); }
.ws-view-toggle svg { width: 20px; height: 20px; }

.ws-toolbar { display: flex; gap: 10px; margin-bottom: 16px; }
.ws-search { flex: 1; display: flex; align-items: center; gap: 10px; background: var(--bg-surface); border: 1px solid var(--border); border-radius: 13px; padding: 12px 15px; min-width: 0; }
.ws-search svg { width: 18px; height: 18px; color: var(--text-muted); flex-shrink: 0; }
.ws-search input { flex: 1; min-width: 0; background: none; border: none; outline: none; color: var(--text-primary); font-size: 14px; font-family: inherit; }
.ws-search input::placeholder { color: var(--text-muted); }
.ws-filter { width: 48px; flex-shrink: 0; background: var(--bg-surface); border: 1px solid var(--border); border-radius: 13px; display: grid; place-items: center; color: var(--text-secondary); }
.ws-filter:hover { color: var(--accent2); }
.ws-filter svg { width: 19px; height: 19px; }

.ws-tabs { display: flex; gap: 8px; margin-bottom: 18px; overflow-x: auto; }
.ws-tabs::-webkit-scrollbar { height: 0; }
.wtab { display: inline-flex; align-items: center; gap: 7px; padding: 8px 15px; border-radius: 11px; background: var(--bg-surface); border: 1px solid var(--border); color: var(--text-secondary); font-size: 13px; font-weight: 600; white-space: nowrap; flex-shrink: 0; }
.wtab:hover { color: var(--text-primary); }
.wtab.active { background: var(--accent2); border-color: transparent; color: #fff; }
.wtab-c { font-size: 11px; background: rgba(0,0,0,.12); padding: 1px 7px; border-radius: 20px; }
.wtab.active .wtab-c { background: rgba(255,255,255,.25); color: #fff; }
.wtab-badge { font-size: 10px; font-weight: 800; background: var(--warning); color: #07221b; padding: 1px 6px; border-radius: 20px; }

.ws-list { display: flex; flex-direction: column; gap: 10px; }
.wsrow { display: flex; align-items: center; gap: 13px; padding: 12px 14px; border-radius: 15px; background: var(--bg-surface); border: 1px solid var(--border); transition: all .14s ease; }
.wsrow:hover { border-color: var(--border-strong); transform: translateY(-1px); }
.wsrow-folder { width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center; flex-shrink: 0; color: #fff; }
.wsrow-folder svg { width: 23px; height: 23px; }
.wsrow-folder.muted { background: var(--bg-elevated) !important; color: var(--text-muted); }
.wsrow-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.wsrow-name { font-weight: 700; font-size: 15px; color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wsrow-sub { font-size: 12.5px; color: var(--text-muted); text-transform: lowercase; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wsrow-pill { flex-shrink: 0; font-size: 12px; font-weight: 700; padding: 5px 12px; border-radius: 20px; white-space: nowrap; }
.wsrow-pill.pill-muted { background: var(--bg-elevated); color: var(--text-muted); }
.wsrow-star { flex-shrink: 0; width: 32px; height: 32px; border-radius: 9px; display: grid; place-items: center; color: var(--text-muted); }
.wsrow-star svg { width: 18px; height: 18px; }
.wsrow-star:hover, .wsrow-star.on { color: var(--warning); }
.wsrow-star.on svg { fill: var(--warning); }

.wsrow-menu { position: relative; flex-shrink: 0; }
.wsrow-more { width: 32px; height: 32px; border-radius: 9px; display: grid; place-items: center; color: var(--text-muted); }
.wsrow-more:hover { color: var(--text-primary); background: var(--bg-surface-2); }
.wsrow-more svg { width: 18px; height: 18px; }
.wsrow-pop { position: absolute; right: 0; top: calc(100% + 6px); min-width: 172px; background: var(--bg-elevated); border: 1px solid var(--border-strong); border-radius: 12px; box-shadow: var(--shadow); padding: 6px; z-index: 30; display: none; flex-direction: column; gap: 2px; }
.wsrow-menu.open .wsrow-pop { display: flex; }
.wsrow-pop a, .wsrow-pop button { display: flex; align-items: center; gap: 9px; width: 100%; padding: 9px 11px; border-radius: 9px; font-size: 13px; font-weight: 600; color: var(--text-secondary); text-align: left; background: none; }
.wsrow-pop a:hover, .wsrow-pop button:hover { background: var(--bg-surface-2); color: var(--text-primary); }
.wsrow-pop button.danger:hover { color: var(--danger); }
.wsrow-pop svg { width: 16px; height: 16px; }
.wsrow-pop form { width: 100%; }

.wsrow-accept { display: flex; gap: 7px; flex-shrink: 0; }
.wsrow-ok, .wsrow-no { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; }
.wsrow-ok { background: rgba(34,197,94,.16); color: #22c55e; }
.wsrow-ok:hover { background: rgba(34,197,94,.28); }
.wsrow-no { background: rgba(240,85,109,.14); color: var(--danger); }
.wsrow-no:hover { background: rgba(240,85,109,.24); }
.wsrow-ok svg, .wsrow-no svg { width: 18px; height: 18px; }
.wsrow-open { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; color: var(--accent2); background: var(--accent2-soft); flex-shrink: 0; }
.wsrow-open svg { width: 18px; height: 18px; }

.ws-list.compact .wsrow { padding: 8px 12px; gap: 11px; }
.ws-list.compact .wsrow-folder { width: 38px; height: 38px; border-radius: 11px; }
.ws-list.compact .wsrow-folder svg { width: 19px; height: 19px; }
.ws-list.compact .wsrow-name { font-size: 14px; }

.ws-fab { position: fixed; right: 28px; bottom: 28px; width: 58px; height: 58px; border-radius: 50%; background: var(--accent2); color: #fff; display: grid; place-items: center; box-shadow: 0 10px 28px rgba(74,147,255,.45); z-index: 70; transition: transform .15s ease, filter .15s ease; }
.ws-fab:hover { transform: translateY(-2px); filter: brightness(1.05); }
.ws-fab svg { width: 26px; height: 26px; }
@media (max-width: 860px) { .ws-fab { bottom: calc(80px + env(safe-area-inset-bottom)); right: 18px; } }

.share-ws-name { color: var(--text-secondary); font-size: 13px; margin-bottom: 6px; }

/* ============================================================
   AIChat — hazır soru baloncukları
   ============================================================ */
.ai-bubbles-intro { font-size: 13px; color: var(--text-secondary); margin-bottom: 12px; }
.ai-bubbles { display: flex; flex-direction: column; gap: 8px; }
.ai-bubble { display: flex; align-items: center; gap: 10px; padding: 11px 14px; border-radius: 14px; background: var(--accent-soft); border: 1px solid var(--accent-dim); color: var(--text-primary); font-size: 13.5px; font-weight: 600; text-align: left; transition: all .14s ease; }
.ai-bubble:hover { background: var(--accent2-soft); border-color: var(--accent); transform: translateY(-1px); }
.ai-bubble svg { width: 17px; height: 17px; color: var(--accent-bright); flex-shrink: 0; }
.ai-bubble span { line-height: 1.3; }
.ai-bubble-other { background: var(--bg-surface-2); border: 1px dashed var(--border-strong); color: var(--text-secondary); }
.ai-bubble-other svg { color: var(--text-muted); }
.ai-bubble-other:hover { background: var(--bg-base); color: var(--text-primary); border-color: var(--text-muted); }

/* Tablo araç çubuğu — fareyle sürükleyerek yatay kaydırma */
.s-tools { cursor: grab; }
.s-tools.dragging { cursor: grabbing; user-select: none; }
.s-tools.dragging * { pointer-events: none; }
.s-icon-btn:disabled { opacity: .4; pointer-events: none; }

/* Giriş formu üstü marka (logo + AtmoSpace / WEB) */
.auth-brand { display: flex; align-items: center; justify-content: center; gap: 12px; margin-bottom: 26px; }
.auth-brand .brand-mark { width: 46px; height: 46px; }
.auth-brand-text { display: flex; flex-direction: column; line-height: 1.1; }
.auth-brand-name { font-family: var(--font-display); font-weight: 800; font-size: 20px; letter-spacing: -0.3px; color: var(--text-primary); }
.auth-brand-name span { color: var(--accent); }
.auth-brand-sub { font-size: 11.5px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase; color: var(--accent-bright); margin-top: 2px; }
/* hidden özniteliği display:flex'i ezmesin (dosya satırı / durum gizlenebilsin) */
.cm-file[hidden], .cm-status[hidden] { display: none; }
/* 3-nokta menüsü açık olan satır öne gelsin (popup alttaki satırın altında kalmasın) */
.wsrow.menu-open { position: relative; z-index: 40; }

/* Tablolar — workspace'e göre gruplama başlığı */
.tbl-group { margin-bottom: 22px; }
.tbl-group-head { display: flex; align-items: center; gap: 10px; padding: 8px 6px; margin-bottom: 10px; border-bottom: 1px solid var(--border); transition: color .14s ease; }
.tgh-ic { width: 32px; height: 32px; border-radius: 9px; background: var(--accent-soft); color: var(--accent); display: grid; place-items: center; flex-shrink: 0; }
.tgh-ic svg { width: 17px; height: 17px; }
.tgh-name { font-family: var(--font-display); font-weight: 700; font-size: 15px; color: var(--text-primary); }
.tgh-count { font-size: 12px; font-weight: 600; color: var(--text-muted); background: var(--bg-surface-2); padding: 2px 10px; border-radius: 20px; }
.tgh-arrow { margin-left: auto; color: var(--text-muted); display: grid; place-items: center; }
.tgh-arrow svg { width: 15px; height: 15px; }
a.tbl-group-head:hover .tgh-name { color: var(--accent-bright); }
a.tbl-group-head:hover .tgh-arrow { color: var(--accent); }

/* ============================================================
   HATIRLATICILAR (Todos)
   ============================================================ */
.rem-add { display: flex; gap: 10px; margin-bottom: 20px; flex-wrap: wrap; }
.rem-add .rem-add-title { flex: 1 1 260px; min-width: 0; background: var(--bg-surface); border: 1px solid var(--border); border-radius: 12px; padding: 12px 15px; color: var(--text-primary); font-size: 14px; font-family: inherit; outline: none; }
.rem-add .rem-add-title:focus { border-color: var(--accent-dim); }
.rem-add input[type=datetime-local], .rem-add select { background: var(--bg-surface); border: 1px solid var(--border); border-radius: 12px; padding: 11px 13px; color: var(--text-primary); font-size: 13.5px; font-family: inherit; outline: none; }
.rem-add input[type=datetime-local]:focus, .rem-add select:focus { border-color: var(--accent-dim); }
.rem-add .btn-inline { flex-shrink: 0; }

.rem-list { display: flex; flex-direction: column; gap: 10px; }
.rem-row { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px; background: var(--bg-surface); border: 1px solid var(--border); transition: all .14s ease; }
.rem-row:hover { border-color: var(--border-strong); }
.rem-row.done { opacity: .62; }
.rem-inline { display: flex; flex-shrink: 0; }
.rem-check { width: 30px; height: 30px; border-radius: 50%; border: 2px solid var(--border-strong); color: var(--text-muted); display: grid; place-items: center; }
.rem-check svg { width: 15px; height: 15px; }
.rem-check:hover { border-color: var(--accent); color: var(--accent); }
.rem-check.on { background: var(--accent); border-color: transparent; color: #07221b; }
.rem-main { flex: 1; min-width: 0; }
.rem-title { font-weight: 650; font-size: 14.5px; color: var(--text-primary); }
.rem-row.done .rem-title { text-decoration: line-through; }
.rem-desc { font-size: 12.5px; color: var(--text-muted); margin-top: 2px; }
.rem-due { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; color: var(--text-secondary); background: var(--bg-surface-2); padding: 4px 10px; border-radius: 20px; white-space: nowrap; flex-shrink: 0; }
.rem-due svg { width: 13px; height: 13px; }
.rem-due.overdue { background: rgba(240,85,109,.14); color: var(--danger); }
.rem-pr { font-size: 11px; font-weight: 700; padding: 3px 10px; border-radius: 20px; white-space: nowrap; flex-shrink: 0; }
.rem-pr.pr-low { background: var(--bg-surface-2); color: var(--text-muted); }
.rem-pr.pr-norm { background: var(--accent2-soft); color: var(--accent2); }
.rem-pr.pr-high { background: rgba(240,176,41,.16); color: var(--warning); }
.rem-del { width: 32px; height: 32px; border-radius: 8px; color: var(--text-muted); display: grid; place-items: center; flex-shrink: 0; }
.rem-del:hover { color: var(--danger); background: var(--bg-surface-2); }
.rem-del svg { width: 17px; height: 17px; }

/* ============================================================
   GEÇMİŞ (History)
   ============================================================ */
.hist-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.hfil { padding: 7px 14px; border-radius: 10px; background: var(--bg-surface); border: 1px solid var(--border); color: var(--text-secondary); font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.hfil:hover { color: var(--text-primary); border-color: var(--border-strong); }
.hfil.active { background: var(--accent2); border-color: transparent; color: #fff; }

.hist-list { display: flex; flex-direction: column; gap: 8px; }
.hist-row { display: flex; align-items: center; gap: 12px; padding: 11px 14px; border-radius: 13px; background: var(--bg-surface); border: 1px solid var(--border); }
.hist-row:hover { border-color: var(--border-strong); }
.hist-ic { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; flex-shrink: 0; }
.hist-ic svg { width: 18px; height: 18px; }
.hist-main { flex: 1; min-width: 0; }
.hist-title { font-weight: 600; font-size: 14px; color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hist-meta { font-size: 12px; color: var(--text-muted); margin-top: 1px; }
.hist-time { font-size: 12px; color: var(--text-muted); white-space: nowrap; flex-shrink: 0; }

/* ============================================================
   NOTLARIM (Todos — not kartları)
   ============================================================ */
.note-add { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 20px; align-items: flex-start; }
.note-add input[name=title] { flex: 1 1 240px; min-width: 0; background: var(--bg-surface); border: 1px solid var(--border); border-radius: 12px; padding: 12px 15px; color: var(--text-primary); font-size: 14px; font-family: inherit; outline: none; }
.note-add textarea { flex: 2 1 320px; min-width: 0; background: var(--bg-surface); border: 1px solid var(--border); border-radius: 12px; padding: 11px 14px; color: var(--text-primary); font-size: 13.5px; font-family: inherit; outline: none; resize: vertical; }
.note-add input[name=title]:focus, .note-add textarea:focus { border-color: var(--accent-dim); }

.note-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; }
.note-card { display: flex; flex-direction: column; gap: 8px; padding: 15px; border-radius: 15px; background: var(--bg-surface); border: 1px solid var(--border); transition: all .14s ease; }
.note-card:hover { border-color: var(--border-strong); }
.note-card.done { opacity: .6; }
.note-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.note-title { font-weight: 700; font-size: 15px; color: var(--text-primary); line-height: 1.3; }
.note-card.done .note-title { text-decoration: line-through; }
.note-del { width: 28px; height: 28px; border-radius: 7px; color: var(--text-muted); display: grid; place-items: center; flex-shrink: 0; }
.note-del:hover { color: var(--danger); background: var(--bg-surface-2); }
.note-del svg { width: 15px; height: 15px; }
.note-body { font-size: 13px; color: var(--text-secondary); line-height: 1.45; white-space: pre-wrap; flex: 1; }
.note-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 4px; padding-top: 8px; border-top: 1px solid var(--border); }
.note-date { font-size: 11.5px; color: var(--text-muted); }
.note-check { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; color: var(--text-secondary); }
.note-check svg { width: 15px; height: 15px; }
.note-check:hover { color: var(--accent-bright); }
.note-check.on { color: var(--accent-bright); }

/* ============================================================
   AYARLAR
   ============================================================ */
.set-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }
.set-card { background: var(--bg-surface); border: 1px solid var(--border); border-radius: 16px; padding: 18px; display: flex; flex-direction: column; }
.set-card-head { display: flex; align-items: center; gap: 8px; font-weight: 700; font-size: 14px; color: var(--text-primary); margin-bottom: 14px; }
.set-card-head svg { width: 17px; height: 17px; color: var(--accent); }
.set-muted { color: var(--text-muted); font-size: 12.5px; }

.set-profile { display: flex; align-items: center; gap: 14px; }
.set-avatar { width: 54px; height: 54px; border-radius: 50%; background: linear-gradient(140deg, var(--accent), var(--accent-dim)); color: #07221b; font-weight: 800; font-size: 22px; display: grid; place-items: center; flex-shrink: 0; }
.set-name { font-weight: 700; font-size: 16px; color: var(--text-primary); }
.set-name-row { display: flex; align-items: center; gap: 6px; }
.set-name-edit { display: inline-grid; place-items: center; width: 26px; height: 26px; padding: 0; border: 0; background: none; color: var(--text-muted); border-radius: 7px; cursor: pointer; transition: .14s; flex-shrink: 0; }
.set-name-edit:hover { color: var(--accent); background: var(--bg-elevated); }
.set-name-edit svg { width: 15px; height: 15px; }
.set-name-form { display: flex; gap: 8px; margin-top: 12px; padding: 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-elevated); }
.set-name-form input { flex: 1; min-width: 0; padding: 9px 11px; border: 1px solid var(--border-strong); border-radius: 9px; background: var(--bg-surface); color: var(--text-primary); font-size: 14px; }
.set-name-form input:focus { outline: none; border-color: var(--accent); }
.set-name-form .btn-inline { flex-shrink: 0; }
.set-email { font-size: 12.5px; color: var(--text-muted); margin: 2px 0 6px; word-break: break-all; }
.set-role { font-size: 11px; font-weight: 700; padding: 2px 9px; border-radius: 20px; background: var(--accent-soft); color: var(--accent-bright); }

.set-plan-name { font-family: var(--font-display); font-size: 20px; font-weight: 800; color: var(--text-primary); }
.set-plan-price { font-size: 14px; color: var(--accent-bright); font-weight: 700; margin-bottom: 12px; }
.set-feats { list-style: none; padding: 0; margin: 0 0 14px; display: flex; flex-direction: column; gap: 7px; }
.set-feats li { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--text-secondary); }
.set-feats svg { width: 15px; height: 15px; color: var(--accent); }

.set-wallet { font-family: var(--font-display); font-size: 30px; font-weight: 800; color: var(--text-primary); margin-bottom: 4px; }
.set-wallet span { font-size: 22px; }

.set-link { display: inline-flex; align-items: center; gap: 7px; margin-top: auto; align-self: flex-start; }
.set-link svg { width: 15px; height: 15px; }
.set-theme { display: flex; gap: 10px; }
.set-theme-btn { display: inline-flex; align-items: center; gap: 7px; padding: 10px 16px; border-radius: 11px; background: var(--bg-surface-2); border: 1px solid var(--border); color: var(--text-secondary); font-weight: 600; font-size: 13.5px; }
.set-theme-btn svg { width: 16px; height: 16px; }
.set-theme-btn:hover { color: var(--text-primary); }
.set-theme-btn.active { border-color: var(--accent); color: var(--accent-bright); background: var(--accent-soft); }
.set-logout { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 11px; background: rgba(240,85,109,.12); color: var(--danger); font-weight: 700; font-size: 13.5px; width: 100%; justify-content: center; }
.set-logout:hover { background: rgba(240,85,109,.2); }
.set-logout svg { width: 16px; height: 16px; }

/* Profil fotoğrafı */
.set-avatar.has-photo, .tb-avatar.has-photo { background: none; }
.set-avatar img, .tb-avatar img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; display: block; }
.set-avatar { overflow: hidden; }
.tb-avatar { overflow: hidden; }
.set-photo-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.set-photo-btn { cursor: pointer; margin-top: 0; }
.set-photo-remove { color: var(--danger); margin-top: 0; }
.set-photo-remove:hover { color: var(--danger); opacity: .8; }
.set-photo-hint { margin-top: 8px; font-size: 12px; }

/* E-posta değiştir (açılır) */
.set-emailchg { margin-bottom: 10px; }
.set-emailchg > summary { list-style: none; cursor: pointer; margin-top: 0; }
.set-emailchg > summary::-webkit-details-marker { display: none; }
.set-emailchg[open] > summary { color: var(--accent); }
.set-emailchg-form { margin-top: 12px; padding: 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-elevated); }
.set-emailchg-form .field { margin-bottom: 12px; }
.set-emailchg-form .btn-inline { width: 100%; justify-content: center; }

/* Ana sayfa arama — canlı sonuç açılır listesi */
.dash-search { position: relative; z-index: 30; }
.ds-input { position: relative; }
.ds-clear { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); width: 26px; height: 26px; border-radius: 7px; color: var(--text-muted); display: grid; place-items: center; }
.ds-clear:hover { color: var(--text-primary); background: var(--bg-surface-2); }
.ds-clear svg { width: 15px; height: 15px; }
.ds-input input { padding-right: 34px; }
.ds-results { position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 60; background: var(--bg-elevated); border: 1px solid var(--border-strong); border-radius: 14px; box-shadow: var(--shadow); padding: 6px; max-height: 380px; overflow-y: auto; }
.dsr-empty { padding: 16px; text-align: center; color: var(--text-muted); font-size: 13px; }
.dsr-item { display: flex; align-items: center; gap: 11px; padding: 10px 11px; border-radius: 10px; }
.dsr-item:hover { background: var(--bg-surface-2); }
.dsr-ic { width: 34px; height: 34px; border-radius: 9px; background: var(--accent-soft); color: var(--accent); display: grid; place-items: center; flex-shrink: 0; }
.dsr-ic svg { width: 17px; height: 17px; }
.dsr-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.dsr-name { font-weight: 600; font-size: 13.5px; color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dsr-sub { font-size: 11.5px; color: var(--text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dsr-tag { font-size: 10.5px; font-weight: 700; color: var(--text-muted); background: var(--bg-surface); padding: 2px 8px; border-radius: 20px; white-space: nowrap; flex-shrink: 0; }

/* Sidebar — menüde ara + "Yakında" placeholder öğeleri */
.nav-search { display: flex; align-items: center; gap: 8px; background: var(--bg-surface); border: 1px solid var(--border); border-radius: 10px; padding: 8px 11px; margin: 2px 0 8px; }
.nav-search svg { width: 15px; height: 15px; color: var(--text-muted); flex-shrink: 0; }
.nav-search input { flex: 1; min-width: 0; background: none; border: none; outline: none; color: var(--text-primary); font-size: 13px; font-family: inherit; }
.nav-search input::placeholder { color: var(--text-muted); }
.nav-search:focus-within { border-color: var(--accent-dim); }

.nav-item.nav-soon { color: var(--text-muted); }
.nav-item.nav-soon:hover { color: var(--text-secondary); }
.nav-soon-tag { margin-left: auto; font-size: 9px; font-weight: 700; letter-spacing: .4px; text-transform: uppercase; color: var(--text-muted); background: var(--bg-surface-2); padding: 2px 6px; border-radius: 6px; flex-shrink: 0; }
.nav-empty { padding: 14px 12px; color: var(--text-muted); font-size: 12.5px; text-align: center; }

/* ============================================================
   Team+ (Premium Team)
   ============================================================ */
.tm-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.tm-head-act, .tm-back {
    display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; border-radius: 12px; flex-shrink: 0;
    background: var(--bg-surface); border: 1px solid var(--border); color: var(--text-secondary);
    transition: .15s;
}
.tm-head-act:hover, .tm-back:hover { color: var(--accent2); border-color: var(--accent2); }
.tm-head-act svg, .tm-back svg { width: 20px; height: 20px; }
.tm-sub-head { display: flex; align-items: center; gap: 12px; }

/* Takım seçici */
.tm-switch { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 6px; margin-bottom: 20px; -webkit-overflow-scrolling: touch; }
.tm-switch::-webkit-scrollbar { height: 0; }
.tm-chip {
    display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; flex-shrink: 0;
    padding: 8px 14px; border-radius: 999px; font-size: 13.5px; font-weight: 600;
    background: var(--bg-surface); border: 1px solid var(--border); color: var(--text-secondary); transition: .15s;
}
.tm-chip svg { width: 15px; height: 15px; }
.tm-chip:hover { border-color: var(--accent2); color: var(--text-primary); }
.tm-chip.active { background: var(--accent2); border-color: var(--accent2); color: #fff; }
.tm-chip-add { border-style: dashed; color: var(--text-muted); }

/* Hero istatistikler */
.tm-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 26px; }
.tm-stat {
    display: flex; flex-direction: column; align-items: flex-start; gap: 8px;
    padding: 16px 14px; border-radius: 18px; background: var(--bg-surface); border: 1px solid var(--border);
}
.tm-stat-ic { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 11px; }
.tm-stat-ic svg { width: 19px; height: 19px; }
.tm-stat-val { font-family: var(--font-display); font-size: 26px; font-weight: 800; color: var(--text-primary); line-height: 1; }
.tm-stat-lbl { font-size: 12px; color: var(--text-muted); font-weight: 600; }

/* YÖNETİM kart ızgarası */
.tm-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.tm-card {
    position: relative; display: flex; flex-direction: column; gap: 8px;
    padding: 16px 14px; border-radius: 18px; background: var(--bg-surface); border: 1px solid var(--border);
    transition: .15s;
}
a.tm-card:hover { border-color: var(--accent2); transform: translateY(-2px); box-shadow: var(--shadow); }
.tm-card-ic { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 12px; }
.tm-card-ic svg { width: 20px; height: 20px; }
.tm-card-t { font-size: 14.5px; font-weight: 700; color: var(--text-primary); }
.tm-card-s { font-size: 12px; color: var(--text-muted); }
.tm-soon { opacity: .72; }
.tm-soon-tag {
    position: absolute; top: 12px; right: 12px; font-size: 10px; font-weight: 700; letter-spacing: .4px;
    padding: 2px 7px; border-radius: 999px; background: var(--bg-surface-2); color: var(--text-muted); border: 1px solid var(--border);
}

/* Son aktiviteler */
.tm-acts { display: flex; flex-direction: column; gap: 8px; }
.tm-act { display: flex; align-items: center; gap: 12px; padding: 11px 12px; border-radius: 14px; background: var(--bg-surface); border: 1px solid var(--border); }
.tm-act-ic { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 10px; flex-shrink: 0; }
.tm-act-ic svg { width: 17px; height: 17px; }
.tm-act-main { flex: 1; min-width: 0; }
.tm-act-name { font-size: 14px; font-weight: 600; color: var(--text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tm-act-meta { font-size: 12px; color: var(--text-muted); }
.tm-act-time { font-size: 12px; color: var(--text-muted); flex-shrink: 0; }

/* Alt sayfa listeleri (üyeler / davetler) */
.tm-list { display: flex; flex-direction: column; gap: 10px; }
.tm-row { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 16px; background: var(--bg-surface); border: 1px solid var(--border); }
.tm-ava { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; color: #fff; font-weight: 700; font-size: 16px; flex-shrink: 0; }
.tm-ava-mail { background: var(--bg-surface-2); color: var(--text-muted); }
.tm-ava-mail svg { width: 19px; height: 19px; }
.tm-row-main { flex: 1; min-width: 0; }
.tm-row-name { display: flex; align-items: center; gap: 6px; font-size: 14.5px; font-weight: 600; color: var(--text-primary); }
.tm-row-sub { font-size: 12.5px; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tm-crown { width: 15px; height: 15px; color: #f5b301; }
.tm-pill { font-size: 12px; font-weight: 600; padding: 4px 10px; border-radius: 999px; background: var(--bg-surface-2); color: var(--text-secondary); border: 1px solid var(--border); flex-shrink: 0; }
.tm-pill-owner { background: var(--accent-soft); color: var(--accent-bright); border-color: transparent; }
.tm-row-x { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 9px; background: transparent; border: 1px solid var(--border); color: var(--text-muted); flex-shrink: 0; }
.tm-row-x:hover { color: var(--danger); border-color: var(--danger); }
.tm-row-x svg { width: 16px; height: 16px; }

/* Roller */
.tm-roles { display: flex; flex-direction: column; gap: 12px; }
.tm-role { padding: 15px 16px; border-radius: 16px; background: var(--bg-surface); border: 1px solid var(--border); }
.tm-role-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.tm-role-name { display: flex; align-items: center; gap: 7px; font-size: 15px; font-weight: 700; color: var(--text-primary); }
.tm-role-name svg { width: 17px; height: 17px; color: var(--accent); }
.tm-tag-sys { font-size: 10.5px; font-weight: 700; letter-spacing: .3px; padding: 2px 8px; border-radius: 999px; background: var(--bg-surface-2); color: var(--text-muted); border: 1px solid var(--border); }
.tm-perms { display: flex; flex-wrap: wrap; gap: 7px; }
.tm-perm { font-size: 12px; padding: 4px 10px; border-radius: 8px; background: var(--accent2-soft); color: var(--accent2); font-weight: 600; }

/* Davet gönderme formu */
.tm-invite-form { margin-bottom: 22px; }
.tm-if-row { display: flex; gap: 10px; }
.tm-if-row input[type=email] { flex: 1; min-width: 0; }
.tm-if-row input, .tm-if-row select { padding: 11px 13px; border-radius: 12px; background: var(--bg-surface); border: 1px solid var(--border); color: var(--text-primary); font-size: 14px; }
.tm-if-row select { flex-shrink: 0; }

@media (min-width: 720px) {
    .tm-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 560px) {
    .tm-if-row { flex-wrap: wrap; }
    .tm-if-row input[type=email] { flex-basis: 100%; }
    .tm-if-row select { flex: 1; }
}

/* ============================================================
   Team+ — Takımlar listesi & takım detayı
   ============================================================ */
/* Liste başlığı + arama */
.tm-list-head .page-title { display: flex; align-items: center; gap: 12px; }
.tm-lh-ic { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 13px; background: var(--accent2); color: #fff; }
.tm-lh-ic svg { width: 24px; height: 24px; }
.tm-search { display: flex; align-items: center; gap: 10px; padding: 12px 14px; margin-bottom: 18px; border-radius: 16px; background: var(--bg-surface); border: 1px solid var(--border); }
.tm-search > svg { width: 19px; height: 19px; color: var(--text-muted); flex-shrink: 0; }
.tm-search input { flex: 1; min-width: 0; background: transparent; border: 0; color: var(--text-primary); font-size: 15px; outline: none; }
.tm-mic { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 9px; background: transparent; border: 0; color: var(--text-muted); flex-shrink: 0; }
.tm-mic:hover { color: var(--accent2); }
.tm-mic.rec { color: var(--danger); animation: tmpulse 1s infinite; }
@keyframes tmpulse { 0%,100% { opacity: 1; } 50% { opacity: .35; } }

/* Takım kartları */
.tm-tlist { display: flex; flex-direction: column; gap: 12px; }
.tm-tcard { position: relative; display: flex; align-items: stretch; border-radius: 18px; background: var(--bg-surface); border: 1px solid var(--border); overflow: hidden; }
.tm-tcard::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--tm-accent, var(--accent2)); }
.tm-tcard-link { flex: 1; display: flex; align-items: center; gap: 14px; padding: 15px 8px 15px 18px; min-width: 0; }
.tm-tcard-ic { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 15px; color: #fff; flex-shrink: 0; }
.tm-tcard-ic svg { width: 26px; height: 26px; }
.tm-tcard-main { display: flex; flex-direction: column; gap: 3px; min-width: 0; position: relative; padding-right: 42px; flex: 1; }
.tm-tcard-name { font-size: 16px; font-weight: 700; color: var(--text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tm-tcard-sub { font-size: 13px; color: var(--text-muted); }
.tm-tcard-ava { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 34px; height: 34px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-size: 12px; font-weight: 700; opacity: .9; }
.tm-tcard-menu { position: relative; display: flex; align-items: center; padding-right: 8px; }
.tm-more { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 10px; background: transparent; border: 0; color: var(--text-muted); }
.tm-more:hover { color: var(--text-primary); background: var(--bg-surface-2); }
.tm-more svg { width: 20px; height: 20px; }
.tm-menu { position: absolute; top: 44px; right: 4px; z-index: 50; min-width: 168px; display: none; flex-direction: column; padding: 6px; border-radius: 14px; background: var(--bg-elevated); border: 1px solid var(--border-strong); box-shadow: var(--shadow); }
.tm-menu.open { display: flex; }
.tm-menu-right { right: 4px; }
.tm-menu a, .tm-menu button { display: flex; align-items: center; gap: 9px; width: 100%; padding: 10px 12px; border-radius: 9px; background: transparent; border: 0; color: var(--text-secondary); font-size: 14px; font-weight: 500; text-align: left; cursor: pointer; }
.tm-menu a:hover, .tm-menu button:hover { background: var(--bg-surface-2); color: var(--text-primary); }
.tm-menu svg { width: 16px; height: 16px; }
.tm-menu form { width: 100%; }
.tm-menu-del:hover { color: var(--danger) !important; }
.tm-noresult { padding: 24px; text-align: center; color: var(--text-muted); font-size: 14px; }

/* Geniş "+ Takım" düğmesi */
.tm-fab-wide { position: sticky; bottom: 16px; display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; margin-top: 22px; padding: 16px; border: 0; border-radius: 16px; background: linear-gradient(135deg, var(--accent2), #6aa9ff); color: #fff; font-size: 16px; font-weight: 700; box-shadow: var(--shadow); cursor: pointer; }
.tm-fab-wide svg { width: 20px; height: 20px; }

/* Detay başlığı */
.tm-detail-head { display: flex; align-items: center; gap: 12px; }
.tm-dh-ic { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 13px; color: #fff; flex-shrink: 0; }
.tm-dh-ic svg { width: 24px; height: 24px; }
.tm-dh-title { flex: 1; font-family: var(--font-display); font-size: 22px; font-weight: 800; color: var(--text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tm-dh-menu { padding-right: 0; }

/* Sekmeler */
.tm-tabs { display: flex; gap: 4px; overflow-x: auto; margin-bottom: 20px; border-bottom: 1px solid var(--border); -webkit-overflow-scrolling: touch; }
.tm-tabs::-webkit-scrollbar { height: 0; }
.tm-tab { position: relative; white-space: nowrap; flex-shrink: 0; padding: 12px 16px; background: transparent; border: 0; color: var(--text-muted); font-size: 15px; font-weight: 600; cursor: pointer; }
.tm-tab.active { color: var(--accent2); }
.tm-tab.active::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: -1px; height: 2.5px; border-radius: 2px; background: var(--accent2); }

/* Paneller */
.tm-panel { display: none; }
.tm-panel.show { display: block; }

/* Genel bakış kartı */
.tm-ov-card { padding: 18px; border-radius: 20px; background: var(--bg-surface); border: 1px solid var(--border); margin-bottom: 22px; }
.tm-ov-top { display: flex; align-items: center; gap: 13px; margin-bottom: 18px; }
.tm-ov-ic { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 13px; color: #fff; flex-shrink: 0; }
.tm-ov-ic svg { width: 24px; height: 24px; }
.tm-ov-name { font-size: 17px; font-weight: 700; color: var(--text-primary); }
.tm-ov-sub { font-size: 13px; color: var(--text-muted); }
.tm-ov-stats { display: grid; grid-template-columns: repeat(3, 1fr); }
.tm-ov-stats > div { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 6px 4px; }
.tm-ov-stats > div + div { border-left: 1px solid var(--border); }
.tm-ov-val { font-family: var(--font-display); font-size: 30px; font-weight: 800; color: var(--text-primary); line-height: 1; }
.tm-ov-lbl { font-size: 12px; color: var(--text-muted); }

.tm-sec-title { font-family: var(--font-display); font-size: 16px; font-weight: 700; color: var(--text-primary); margin: 22px 0 12px; }
.tm-row-link { display: flex; align-items: center; gap: 12px; flex: 1; min-width: 0; }
.tm-row-chev { width: 18px; height: 18px; color: var(--text-muted); flex-shrink: 0; }
.tm-ava-act { background: var(--bg-surface-2); }
.tm-ava-act svg { width: 18px; height: 18px; }

/* Geniş aksiyon düğmesi (davet/ekle) */
.tm-wide-btn { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; padding: 14px; margin-bottom: 16px; border-radius: 15px; background: var(--bg-surface); border: 1px dashed var(--border-strong); color: var(--text-primary); font-size: 15px; font-weight: 600; cursor: pointer; }
.tm-wide-btn:hover { border-color: var(--accent2); color: var(--accent2); }
.tm-wide-btn svg { width: 19px; height: 19px; }
.tm-modal-note { font-size: 13.5px; color: var(--text-secondary); margin: 4px 0 14px; line-height: 1.5; }

@media (max-width: 860px) {
    .tm-fab-wide { position: fixed; left: 16px; right: 16px; bottom: calc(var(--bottomnav-h, 72px) + 12px); width: auto; margin: 0; z-index: 60; }
}

/* Takım simge + renk seçici (oluştur/düzenle modalı) */
.tm-pick { display: flex; flex-wrap: wrap; gap: 10px; }
.tm-pick-ic { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 14px; background: var(--bg-surface-2); border: 1.5px solid var(--border); color: var(--text-secondary); cursor: pointer; transition: .12s; }
.tm-pick-ic svg { width: 22px; height: 22px; }
.tm-pick-ic:hover { color: var(--text-primary); border-color: var(--border-strong); }
.tm-pick-ic.sel { background: var(--accent2-soft); border-color: var(--accent2); color: var(--accent2); }
.tm-pick-color { position: relative; width: 40px; height: 40px; border-radius: 50%; border: 2px solid transparent; cursor: pointer; transition: .12s; }
.tm-pick-color svg { width: 18px; height: 18px; color: #fff; opacity: 0; transition: .12s; stroke-width: 3; }
.tm-pick-color.sel { border-color: var(--text-primary); box-shadow: 0 0 0 2px var(--bg-surface), 0 0 0 4px var(--text-primary); }
.tm-pick-color.sel svg { opacity: 1; }

/* Davetler — gelen davet satırı (kabul/reddet) */
.tm-invrow { display: flex; flex-direction: column; gap: 12px; padding: 14px 16px; border-radius: 16px; background: var(--bg-surface); border: 1px solid var(--border); }
.tm-invrow-top { display: flex; align-items: center; gap: 12px; }
.tm-invrow-acts { display: flex; gap: 10px; }
.tm-inv-yes, .tm-inv-no { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 11px; border-radius: 12px; font-size: 14px; font-weight: 600; cursor: pointer; border: 1px solid var(--border); }
.tm-inv-yes { background: var(--accent2); border-color: var(--accent2); color: #fff; }
.tm-inv-yes:hover { filter: brightness(1.06); }
.tm-inv-no { background: transparent; color: var(--text-secondary); }
.tm-inv-no:hover { border-color: var(--danger); color: var(--danger); }
.tm-inv-yes svg, .tm-inv-no svg { width: 16px; height: 16px; }

/* ============================================================
   Roller & Yetkiler
   ============================================================ */
.tm-rolechips { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 6px; margin-bottom: 18px; -webkit-overflow-scrolling: touch; }
.tm-rolechips::-webkit-scrollbar { height: 0; }
.tm-rolechip { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; flex-shrink: 0; padding: 9px 15px; border-radius: 999px; font-size: 14px; font-weight: 600; background: var(--bg-surface); border: 1px solid var(--border); color: var(--text-secondary); cursor: pointer; transition: .14s; }
.tm-rolechip svg { width: 16px; height: 16px; color: var(--rc); }
.tm-rolechip:hover { border-color: var(--rc); color: var(--text-primary); }
.tm-rolechip.active { background: var(--rc); border-color: var(--rc); color: #fff; }
.tm-rolechip.active svg { color: #fff; }

.tm-rolepanel { display: none; }
.tm-rolepanel.show { display: block; }
.tm-role-card { position: relative; display: flex; align-items: center; gap: 13px; padding: 16px; border-radius: 18px; background: var(--bg-surface); border: 1px solid var(--border); margin-bottom: 14px; overflow: hidden; }
.tm-role-card::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--rc); }
.tm-role-ic { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 13px; color: #fff; flex-shrink: 0; }
.tm-role-ic svg { width: 24px; height: 24px; }
.tm-role-info { flex: 1; min-width: 0; }
.tm-role-title { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 16px; font-weight: 700; color: var(--text-primary); }
.tm-role-tag { font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 999px; background: var(--bg-surface-2); color: var(--text-muted); border: 1px solid var(--border); }
.tm-role-sub { font-size: 13px; color: var(--text-muted); margin-top: 2px; }
.tm-role-count { font-family: var(--font-display); font-weight: 800; font-size: 14px; padding: 5px 11px; border-radius: 999px; background: var(--bg-surface-2); flex-shrink: 0; }

.tm-permlist { display: flex; flex-direction: column; border-radius: 16px; background: var(--bg-surface); border: 1px solid var(--border); overflow: hidden; }
.tm-perm-row { display: flex; align-items: center; gap: 13px; padding: 14px 16px; }
.tm-perm-row + .tm-perm-row { border-top: 1px solid var(--border); }
.tm-perm-dot { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; background: var(--bg-surface-2); color: var(--text-muted); flex-shrink: 0; font-size: 13px; }
.tm-perm-dot.on { background: var(--accent-soft); color: var(--accent-bright); }
.tm-perm-dot svg { width: 15px; height: 15px; }
.tm-perm-lbl { font-size: 14.5px; color: var(--text-primary); }
.tm-perm-lbl.off { color: var(--text-muted); }

.tm-role-actions { display: flex; gap: 10px; margin-top: 14px; }
.tm-role-edit, .tm-role-del { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 12px; border-radius: 13px; font-size: 14px; font-weight: 600; cursor: pointer; background: var(--bg-surface); border: 1px solid var(--border); color: var(--text-secondary); }
.tm-role-edit:hover { border-color: var(--accent2); color: var(--accent2); }
.tm-role-del:hover { border-color: var(--danger); color: var(--danger); }
.tm-role-edit svg, .tm-role-del svg { width: 16px; height: 16px; }
.tm-role-actions form { flex: 1; display: flex; }

/* Yetki matrisi */
.tm-matrix-wrap { overflow-x: auto; border-radius: 16px; border: 1px solid var(--border); -webkit-overflow-scrolling: touch; }
.tm-matrix { width: 100%; border-collapse: collapse; background: var(--bg-surface); }
.tm-matrix th, .tm-matrix td { padding: 13px 14px; text-align: left; white-space: nowrap; }
.tm-matrix thead th { border-bottom: 1px solid var(--border-strong); font-size: 13px; }
.tm-mx-head { font-weight: 700; color: var(--text-primary); position: sticky; left: 0; background: var(--bg-surface); z-index: 2; }
.tm-mx-role { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; }
.tm-mx-role svg { width: 15px; height: 15px; }
.tm-matrix tbody tr + tr td { border-top: 1px solid var(--border); }
.tm-mx-perm { font-size: 13.5px; color: var(--text-secondary); position: sticky; left: 0; background: var(--bg-surface); z-index: 1; min-width: 190px; }
.tm-mx-cell { text-align: center; }
.tm-mx-yes { width: 17px; height: 17px; color: var(--accent-bright); }
.tm-mx-no { color: var(--text-muted); }

/* Yetki seçim listesi (rol modalı) */
.tm-permpick { display: flex; flex-direction: column; gap: 2px; max-height: 260px; overflow-y: auto; border: 1px solid var(--border); border-radius: 12px; padding: 6px; }
.tm-permopt { display: flex; align-items: center; gap: 11px; padding: 9px 8px; border-radius: 9px; cursor: pointer; font-size: 14px; color: var(--text-secondary); }
.tm-permopt:hover { background: var(--bg-surface-2); }
.tm-permopt input { position: absolute; opacity: 0; width: 0; height: 0; }
.tm-permopt-box { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 7px; border: 1.5px solid var(--border-strong); color: transparent; flex-shrink: 0; transition: .12s; }
.tm-permopt-box svg { width: 14px; height: 14px; }
.tm-permopt input:checked + .tm-permopt-box { background: var(--accent2); border-color: var(--accent2); color: #fff; }
.tm-permopt input:checked ~ span:last-child { color: var(--text-primary); }

/* ============================================================
   Team+ — Audit Log / Destek / Sahiplik
   ============================================================ */
.tm-page-head { display: flex; flex-direction: column; }
.tm-page-sub { font-size: 13.5px; color: var(--text-muted); }
.tm-audit-count { font-size: 14px; color: var(--text-muted); margin-top: 2px; }

/* Tarih filtresi (select) */
.tm-audit-date { display: flex; align-items: center; gap: 10px; padding: 13px 14px; margin-bottom: 16px; border-radius: 15px; background: var(--bg-surface); border: 1px solid var(--border); }
.tm-audit-date > svg:first-child { width: 19px; height: 19px; color: var(--text-muted); flex-shrink: 0; }
.tm-audit-date select { flex: 1; background: transparent; border: 0; color: var(--text-primary); font-size: 15px; outline: none; -webkit-appearance: none; appearance: none; cursor: pointer; }
.tm-audit-date > svg:last-child { width: 18px; height: 18px; color: var(--text-muted); flex-shrink: 0; }

/* Audit satırı */
.tm-audit-row { display: flex; align-items: center; gap: 13px; padding: 13px 14px; border-radius: 15px; background: var(--bg-surface); border: 1px solid var(--border); }
.tm-audit-ic { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 13px; background: var(--accent2-soft); color: var(--accent2); flex-shrink: 0; }
.tm-audit-ic svg { width: 21px; height: 21px; }
.tm-audit-main { flex: 1; min-width: 0; }
.tm-audit-top { display: flex; align-items: center; gap: 9px; }
.tm-audit-user { font-size: 15px; font-weight: 700; color: var(--text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tm-audit-badge { font-size: 12px; font-weight: 800; letter-spacing: .4px; padding: 1px 8px; border-radius: 6px; background: var(--bg-surface-2); flex-shrink: 0; }
.tm-audit-meta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 4px; }
.tm-audit-meta span { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; color: var(--text-muted); }
.tm-audit-meta svg { width: 13px; height: 13px; }
.tm-audit-err { color: var(--danger) !important; }
.tm-audit-time { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; font-size: 12.5px; color: var(--text-muted); flex-shrink: 0; }

/* Geniş gradient CTA (Destek İste) */
.tm-wide-cta { display: flex; align-items: center; justify-content: center; gap: 9px; width: 100%; padding: 16px; margin-bottom: 24px; border: 0; border-radius: 16px; background: linear-gradient(135deg, var(--accent2), #6aa9ff); color: #fff; font-size: 16px; font-weight: 700; box-shadow: var(--shadow); cursor: pointer; }
.tm-wide-cta svg { width: 20px; height: 20px; }

/* Destek talebi satırı */
.tm-suprow { display: flex; flex-direction: column; gap: 12px; padding: 14px 16px; border-radius: 16px; background: var(--bg-surface); border: 1px solid var(--border); }
.tm-suprow-top { display: flex; align-items: center; gap: 12px; }
.tm-sup-msg { font-size: 14px; color: var(--text-secondary); line-height: 1.5; padding: 10px 12px; border-radius: 11px; background: var(--bg-surface-2); }

/* Yardım isteyeceği kişi seçimi (radio) */
.tm-helperlist { display: flex; flex-direction: column; gap: 8px; margin-bottom: 14px; max-height: 240px; overflow-y: auto; }
.tm-helper { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 13px; border: 1.5px solid var(--border); cursor: pointer; transition: .12s; }
.tm-helper:hover { border-color: var(--border-strong); }
.tm-helper input { position: absolute; opacity: 0; width: 0; height: 0; }
.tm-helper-dot { width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--border-strong); flex-shrink: 0; margin-left: auto; transition: .12s; }
.tm-helper:has(input:checked) { border-color: var(--accent2); background: var(--accent2-soft); }
.tm-helper:has(input:checked) .tm-helper-dot { border-color: var(--accent2); background: var(--accent2); box-shadow: inset 0 0 0 3px var(--bg-surface); }

/* Sahiplik */
.tm-owner-row .tm-pill-primary { background: rgba(245,179,1,.16); color: #f5b301; border-color: transparent; }
.tm-deleg { position: relative; display: flex; align-items: center; gap: 13px; padding: 15px 16px; border-radius: 16px; background: var(--bg-surface); border: 1px solid var(--border); margin-bottom: 14px; overflow: hidden; }
.tm-deleg::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--accent2); }
.tm-deleg.active::before { background: var(--accent); }
.tm-deleg-ic { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 13px; background: var(--accent2-soft); color: var(--accent2); flex-shrink: 0; }
.tm-deleg.active .tm-deleg-ic { background: var(--accent-soft); color: var(--accent-bright); }
.tm-deleg-ic svg { width: 22px; height: 22px; }

/* ============================================================
   Team+ — Görev Panosu
   ============================================================ */
.tm-prog-card { position: relative; display: flex; align-items: center; gap: 18px; padding: 18px; border-radius: 20px; background: var(--bg-surface); border: 1px solid var(--border); margin-bottom: 24px; overflow: hidden; }
.tm-prog-card::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--accent2); }
.tm-prog-ring { position: relative; width: 104px; height: 104px; flex-shrink: 0; }
.tm-prog-ring svg { width: 104px; height: 104px; transform: rotate(-90deg); }
.tm-ring-bg { fill: none; stroke: var(--bg-surface-2); stroke-width: 9; }
.tm-ring-fg { fill: none; stroke: var(--accent2); stroke-width: 9; stroke-linecap: round; transition: stroke-dashoffset .6s ease; }
.tm-ring-val { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-family: var(--font-display); font-size: 24px; font-weight: 800; color: var(--text-primary); }
.tm-prog-info { flex: 1; min-width: 0; }
.tm-prog-title { font-size: 18px; font-weight: 700; color: var(--text-primary); }
.tm-prog-sub { font-size: 13px; color: var(--text-muted); margin: 3px 0 12px; }
.tm-prog-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.tm-prog-pill { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; padding: 6px 11px; border-radius: 10px; }
.tm-prog-pill svg { width: 15px; height: 15px; }
.tm-prog-pill.done { background: rgba(34,197,94,.14); color: #22c55e; }
.tm-prog-pill.rem { background: rgba(245,158,11,.14); color: #f59e0b; }

/* Şu an çalışan */
.tm-now-label { display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 700; letter-spacing: 1px; color: var(--text-muted); margin-bottom: 12px; }
.tm-now-dot { width: 9px; height: 9px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 3px rgba(34,197,94,.2); flex-shrink: 0; }
.tm-now-empty { position: relative; display: flex; align-items: center; gap: 13px; padding: 16px; border-radius: 16px; background: var(--bg-surface); border: 1px solid var(--border); color: var(--text-muted); font-size: 14.5px; overflow: hidden; }
.tm-now-empty::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--border-strong); }
.tm-now-ic { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 13px; background: var(--bg-surface-2); color: var(--text-muted); flex-shrink: 0; }
.tm-now-ic svg { width: 22px; height: 22px; }
.tm-now-live { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: #22c55e; flex-shrink: 0; }

/* Görev satırı */
.tm-taskrow { display: flex; align-items: center; gap: 12px; padding: 13px 14px; border-radius: 15px; background: var(--bg-surface); border: 1px solid var(--border); }
.tm-taskrow.done { opacity: .66; }
.tm-taskrow.done .tm-task-title { text-decoration: line-through; }
.tm-task-title { font-size: 15px; font-weight: 600; color: var(--text-primary); }
.tm-task-status { font-size: 12.5px; font-weight: 700; flex-shrink: 0; }
.tm-inline-ic { width: 12px; height: 12px; vertical-align: -1px; }

/* Team+ — İzin Talepleri */
.tm-leave-head { position: relative; }
.tm-leave-head .tm-back { margin-bottom: 12px; }
.tm-leave-refresh { position: absolute; top: 0; right: 0; }
.tm-leaverow { display: flex; flex-direction: column; gap: 12px; padding: 14px 16px; border-radius: 16px; background: var(--bg-surface); border: 1px solid var(--border); }
.tm-leaverow-top { display: flex; align-items: center; gap: 12px; }

/* ============================================================
   Bankacılık (landing)
   ============================================================ */
.bank-stats { display: grid; grid-template-columns: 1fr 1fr; padding: 20px 16px; border-radius: 20px; background: var(--bg-surface); border: 1px solid var(--border); margin-bottom: 26px; }
.bank-stat { display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 6px; }
.bank-stat + .bank-stat { border-left: 1px solid var(--border); }
.bank-stat-val { font-family: var(--font-display); font-size: 34px; font-weight: 800; color: var(--text-primary); line-height: 1; }
.bank-stat-lbl { font-size: 13px; color: var(--text-muted); font-weight: 600; }

.bank-tools { position: relative; display: flex; flex-direction: column; border-radius: 18px; background: var(--bg-surface); border: 1px solid var(--border); overflow: hidden; }
.bank-tools::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--accent2); z-index: 1; }
.bank-tool { display: flex; align-items: center; gap: 14px; padding: 16px 16px 16px 20px; transition: background .12s; }
.bank-tool + .bank-tool { border-top: 1px solid var(--border); }
.bank-tool:hover { background: var(--bg-surface-2); }
.bank-tool-ic { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 13px; flex-shrink: 0; }
.bank-tool-ic svg { width: 23px; height: 23px; }
.bank-tool-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.bank-tool-t { font-size: 16px; font-weight: 700; color: var(--text-primary); }
.bank-tool-s { font-size: 13px; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bank-tool-chev { width: 20px; height: 20px; color: var(--text-muted); flex-shrink: 0; }

/* ============================================================
   Bankacılık — Kredi Hesaplama
   ============================================================ */
.krd-seg { display: flex; gap: 4px; padding: 5px; border-radius: 15px; background: var(--bg-surface); border: 1px solid var(--border); }
.krd-seg-btn { flex: 1; padding: 12px 8px; border-radius: 11px; background: transparent; border: 0; color: var(--text-muted); font-size: 15px; font-weight: 600; cursor: pointer; transition: .14s; white-space: nowrap; }
.krd-seg-btn.active { background: linear-gradient(135deg, var(--accent2), #6aa9ff); color: #fff; box-shadow: 0 4px 14px rgba(74,147,255,.35); }

.krd-card, .krd-result, .krd-detail { position: relative; border-radius: 18px; background: var(--bg-surface); border: 1px solid var(--border); overflow: hidden; }
.krd-card { padding: 18px 16px; }
.krd-card::before, .krd-result::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--accent2); }
.krd-card-title { font-size: 17px; font-weight: 700; color: var(--text-primary); margin-bottom: 14px; }
.krd-field { display: block; margin-bottom: 14px; }
.krd-field:last-child { margin-bottom: 0; }
.krd-field > span { display: block; font-size: 13px; color: var(--text-muted); margin-bottom: 7px; }
.krd-input { display: flex; align-items: center; gap: 10px; padding: 13px 14px; border-radius: 13px; background: var(--bg-surface-2); border: 1px solid var(--border); }
.krd-input:focus-within { border-color: var(--accent2); }
.krd-input svg { width: 19px; height: 19px; color: var(--accent2); flex-shrink: 0; }
.krd-input input { flex: 1; min-width: 0; background: transparent; border: 0; color: var(--text-primary); font-size: 17px; font-weight: 600; outline: none; }

.krd-result { padding: 18px; margin-bottom: 14px; }
.krd-result-top { display: flex; align-items: center; gap: 11px; margin-bottom: 10px; }
.krd-result-ic { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 12px; background: var(--accent2); color: #fff; }
.krd-result-ic svg { width: 21px; height: 21px; }
.krd-result-lbl { flex: 1; font-size: 16px; color: var(--text-secondary); }
.krd-badge { font-size: 12px; font-weight: 600; padding: 4px 11px; border-radius: 999px; background: var(--accent2-soft); color: var(--accent2); }
.krd-result-val { font-family: var(--font-display); font-size: 34px; font-weight: 800; color: var(--text-primary); letter-spacing: -.5px; margin-bottom: 14px; }
.krd-result-foot { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding-top: 14px; border-top: 1px solid var(--border); }
.krd-result-foot > div { display: flex; flex-direction: column; gap: 3px; }
.krd-result-foot > div:last-child { align-items: flex-end; }
.krd-foot-lbl { font-size: 12.5px; color: var(--text-muted); }
.krd-foot-val { font-size: 17px; font-weight: 700; color: var(--text-primary); }
.krd-foot-val.cost { color: #f59e0b; }

.krd-detail { padding: 16px 18px; margin-bottom: 14px; }
.krd-detail-title { display: flex; align-items: center; gap: 9px; font-size: 17px; font-weight: 700; color: var(--text-primary); margin-bottom: 12px; }
.krd-detail-ic { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 10px; background: var(--accent2-soft); color: var(--accent2); }
.krd-detail-ic svg { width: 17px; height: 17px; }
.krd-drow { display: flex; align-items: center; justify-content: space-between; padding: 12px 0; border-top: 1px solid var(--border); font-size: 14.5px; color: var(--text-secondary); }
.krd-drow:first-of-type { border-top: 0; }
.krd-drow b { color: var(--text-primary); font-weight: 700; }
.krd-drow span { display: inline-flex; align-items: center; gap: 7px; }
.krd-drow span svg { width: 15px; height: 15px; color: #f59e0b; }
.krd-drow.tax b { color: #f59e0b; }
.krd-drow.total { border-top: 1px solid var(--border-strong); }
.krd-drow.total span { font-weight: 700; color: var(--text-primary); }
.krd-drow.total b { color: var(--accent2); font-size: 16px; }
.krd-note { font-size: 12.5px; color: var(--text-muted); margin-top: 10px; }

.krd-dist { display: flex; align-items: center; gap: 22px; padding: 6px 0; }
.krd-donut { width: 120px; height: 120px; border-radius: 50%; position: relative; flex-shrink: 0; background: var(--bg-surface-2); }
.krd-donut-hole { position: absolute; inset: 24px; border-radius: 50%; background: var(--bg-surface); }
.krd-legend { display: flex; flex-direction: column; gap: 11px; }
.krd-leg { display: flex; align-items: center; gap: 9px; font-size: 14px; color: var(--text-secondary); }
.krd-leg i { width: 12px; height: 12px; border-radius: 4px; flex-shrink: 0; }
.krd-leg b { color: var(--text-primary); font-weight: 700; margin-left: 2px; }

.krd-actions { display: flex; gap: 12px; margin-top: 8px; }
.krd-act-ghost, .krd-act-primary { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 16px; border-radius: 15px; font-size: 15px; font-weight: 700; cursor: pointer; }
.krd-act-ghost { background: var(--bg-surface); border: 1px solid var(--border); color: var(--text-primary); }
.krd-act-ghost:hover { border-color: var(--accent2); }
.krd-act-primary { background: linear-gradient(135deg, var(--accent2), #6aa9ff); border: 0; color: #fff; box-shadow: 0 6px 18px rgba(74,147,255,.32); }
.krd-act-ghost svg, .krd-act-primary svg { width: 19px; height: 19px; }

.krd-plan-overlay { display: none; position: fixed; inset: 0; z-index: 200; background: var(--bg-base); overflow-y: auto; padding: 22px 18px 40px; }
.krd-plan-overlay.open { display: block; }
.krd-plan-total { position: relative; padding: 18px; border-radius: 20px; background: var(--bg-surface); border: 1px solid var(--border); margin-bottom: 22px; overflow: hidden; }
.krd-plan-total::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--accent2); }
.krd-plan-total-top { display: flex; align-items: center; gap: 13px; margin-bottom: 12px; }
.krd-plan-ic { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 14px; background: var(--accent2); color: #fff; flex-shrink: 0; }
.krd-plan-ic svg { width: 24px; height: 24px; }
.krd-plan-lbl { font-size: 12.5px; font-weight: 700; letter-spacing: .6px; color: var(--text-muted); }
.krd-plan-val { font-family: var(--font-display); font-size: 30px; font-weight: 800; color: var(--text-primary); }
.krd-plan-badges { display: flex; gap: 8px; margin-bottom: 14px; }
.krd-plan-badge { font-size: 13px; font-weight: 600; padding: 6px 12px; border-radius: 10px; background: var(--accent2-soft); color: var(--accent2); }
.krd-plan-badge.cost { background: rgba(245,158,11,.14); color: #f59e0b; }
.krd-plan-grid { display: grid; grid-template-columns: repeat(3, 1fr); padding-top: 14px; border-top: 1px solid var(--border); }
.krd-plan-grid > div { display: flex; flex-direction: column; gap: 4px; padding: 0 4px; }
.krd-plan-grid > div + div { border-left: 1px solid var(--border); }
.krd-plan-grid span { font-size: 11px; font-weight: 600; letter-spacing: .4px; color: var(--text-muted); }
.krd-plan-grid b { font-size: 15px; color: var(--text-primary); }
.krd-plan-grid b.int { color: #f59e0b; }
.krd-plan-grid b.tax { color: #ef4444; }
.krd-inst-list { display: flex; flex-direction: column; gap: 10px; }
.krd-inst { display: flex; align-items: center; gap: 13px; padding: 14px; border-radius: 15px; background: var(--bg-surface); border: 1px solid var(--border); }
.krd-inst-no { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 13px; background: var(--accent2-soft); color: var(--accent2); font-weight: 700; font-size: 16px; flex-shrink: 0; }
.krd-inst-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }
.krd-inst-date { font-size: 16px; font-weight: 700; color: var(--text-primary); }
.krd-inst-status { font-size: 12.5px; font-weight: 600; padding: 3px 11px; border-radius: 999px; background: var(--accent2-soft); color: var(--accent2); }
.krd-inst-amt { text-align: right; flex-shrink: 0; }
.krd-inst-val { font-size: 16px; font-weight: 700; color: var(--text-primary); }
.krd-inst-rem { font-size: 12.5px; color: var(--text-muted); margin-top: 3px; }

.krd-toggle { display: flex; align-items: center; gap: 10px; padding: 13px 14px; border-radius: 13px; background: var(--bg-surface-2); border: 1px solid var(--border); cursor: pointer; margin-bottom: 4px; }
.krd-toggle > span:first-child { flex: 1; display: inline-flex; align-items: center; gap: 8px; font-size: 14.5px; font-weight: 600; color: var(--text-primary); }
.krd-toggle svg { width: 17px; height: 17px; color: var(--accent2); }
.krd-toggle input { position: absolute; opacity: 0; width: 0; height: 0; }
.krd-toggle-track { position: relative; width: 46px; height: 26px; border-radius: 999px; background: var(--border-strong); transition: .15s; flex-shrink: 0; }
.krd-toggle-knob { position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; transition: .15s; }
.krd-toggle input:checked ~ .krd-toggle-track { background: var(--accent2); }
.krd-toggle input:checked ~ .krd-toggle-track .krd-toggle-knob { left: 23px; }

/* Kredi Hesaplama — değişken faiz uyarısı + vergi gizleme (Konut) */
.krd-warn { display: flex; align-items: flex-start; gap: 13px; padding: 15px 16px; margin-bottom: 4px; border-radius: 16px; background: rgba(245,158,11,.08); border: 1px solid rgba(245,158,11,.35); }
.krd-warn[hidden] { display: none; }
.krd-warn-ic { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 13px; background: rgba(245,158,11,.18); color: #f59e0b; flex-shrink: 0; }
.krd-warn-ic svg { width: 22px; height: 22px; }
.krd-warn-t { font-size: 15px; font-weight: 700; color: var(--text-primary); margin-bottom: 4px; }
.krd-warn-s { font-size: 13px; color: var(--text-muted); line-height: 1.5; }
.krd-detail.no-tax .krd-drow.tax { display: none; }

/* ============================================================
   Bankacılık — Kredilerim / Varlıklarım
   ============================================================ */
.bank-empty { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 34px 24px; border-radius: 22px; background: var(--bg-surface); border: 1px solid var(--border); }
.bank-empty-ic { display: inline-flex; align-items: center; justify-content: center; width: 84px; height: 84px; border-radius: 22px; color: #fff; margin-bottom: 18px; }
.bank-empty-ic.blue { background: var(--accent2); box-shadow: 0 8px 26px rgba(74,147,255,.4); }
.bank-empty-ic.green { background: #22c55e; box-shadow: 0 8px 26px rgba(34,197,94,.4); }
.bank-empty-ic svg { width: 40px; height: 40px; }
.bank-empty h2 { font-family: var(--font-display); font-size: 19px; font-weight: 800; letter-spacing: .5px; color: var(--text-primary); margin-bottom: 10px; }
.bank-empty p { font-size: 14.5px; color: var(--text-muted); line-height: 1.55; margin-bottom: 20px; max-width: 400px; }
.bank-empty .btn { width: 100%; max-width: 420px; justify-content: center; padding: 15px; }

/* Kredi satırı */
.bank-loanrow { display: flex; align-items: center; gap: 14px; padding: 15px 16px; border-radius: 16px; background: var(--bg-surface); border: 1px solid var(--border); transition: .12s; }
.bank-loanrow:hover { border-color: var(--accent2); }
.bank-loan-ic { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 14px; background: var(--accent2-soft); color: var(--accent2); flex-shrink: 0; }
.bank-loan-ic svg { width: 24px; height: 24px; }
.bank-loan-main { flex: 1; min-width: 0; }
.bank-loan-name { font-size: 16px; font-weight: 700; color: var(--text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bank-loan-sub { font-size: 12.5px; color: var(--text-muted); margin: 2px 0 8px; }
.bank-loan-bar { height: 6px; border-radius: 999px; background: var(--bg-surface-2); overflow: hidden; }
.bank-loan-bar span { display: block; height: 100%; border-radius: 999px; background: var(--accent2); }
.bank-loan-amt { text-align: right; flex-shrink: 0; }
.bank-loan-total { font-size: 15px; font-weight: 700; color: var(--text-primary); }
.bank-loan-rem { font-size: 12px; color: var(--text-muted); margin-top: 2px; }

/* Kredi taksit durum renkleri (Loan detay) */
.krd-inst-no.paid { background: rgba(34,197,94,.15); color: #22c55e; }
.krd-inst-no.over { background: rgba(239,68,68,.15); color: #ef4444; }
.krd-inst-status.paid { background: rgba(34,197,94,.15); color: #22c55e; }
.krd-inst-status.over { background: rgba(239,68,68,.15); color: #ef4444; }
.krd-inst-pay { flex-shrink: 0; }
.krd-inst-pay button { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 11px; background: rgba(34,197,94,.14); border: 1px solid rgba(34,197,94,.3); color: #22c55e; cursor: pointer; }
.krd-inst-pay button:hover { background: #22c55e; color: #fff; }
.krd-inst-pay svg { width: 18px; height: 18px; }

/* Varlık istatistik kartı */
.asset-stats { display: grid; grid-template-columns: 1fr 1fr; padding: 18px 16px; border-radius: 20px; background: var(--bg-surface); border: 1px solid var(--border); margin-bottom: 20px; }
.asset-stat { display: flex; flex-direction: column; gap: 7px; padding: 4px 8px; }
.asset-stat + .asset-stat { border-left: 1px solid var(--border); align-items: flex-end; }
.asset-stat-lbl { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 700; letter-spacing: .4px; }
.asset-stat-lbl svg { width: 14px; height: 14px; }
.asset-stat-lbl.recv, .asset-stat-val.recv { color: #22c55e; }
.asset-stat-lbl.pay, .asset-stat-val.pay { color: #ef4444; }
.asset-stat-val { font-family: var(--font-display); font-size: 26px; font-weight: 800; line-height: 1; }

/* Varlık satırı */
.asset-row { display: flex; align-items: center; gap: 13px; padding: 13px 14px; border-radius: 15px; background: var(--bg-surface); border: 1px solid var(--border); }
.asset-ic { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 12px; flex-shrink: 0; }
.asset-ic.recv { background: rgba(34,197,94,.14); color: #22c55e; }
.asset-ic.pay { background: rgba(239,68,68,.14); color: #ef4444; }
.asset-ic svg { width: 21px; height: 21px; }
.asset-amt { font-size: 16px; font-weight: 700; flex-shrink: 0; }
.asset-amt.recv { color: #22c55e; }
.asset-amt.pay { color: #ef4444; }

/* Varlık Ekle — yön seçimi (Alınacak yeşil / Ödenecek kırmızı) + hatırlatıcı alt-metin */
.as-dirseg { display: flex; gap: 10px; margin-bottom: 16px; }
.as-dir-btn { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 14px; border-radius: 14px; background: var(--bg-surface-2); border: 1.5px solid var(--border); color: var(--text-muted); font-size: 15px; font-weight: 700; cursor: pointer; transition: .14s; }
.as-dir-btn svg { width: 18px; height: 18px; }
.as-dir-btn.active[data-dir="Receivable"] { border-color: #22c55e; color: #22c55e; background: rgba(34,197,94,.08); }
.as-dir-btn.active[data-dir="Payable"] { border-color: #ef4444; color: #ef4444; background: rgba(239,68,68,.08); }
.as-remind { align-items: center; }
.as-remind-txt { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.as-remind-txt b { font-size: 14.5px; font-weight: 600; color: var(--text-primary); }
.as-remind-txt em { font-size: 12.5px; font-style: normal; color: var(--text-muted); }
.as-remind-txt svg { width: 17px; height: 17px; color: var(--accent2); vertical-align: -3px; margin-right: 4px; }

/* ============================================================
   Tablo editörü — kompakt toolbar + sağdan açılan araç çekmecesi
   ============================================================ */
.s-toolbar-spacer { flex: 1; min-width: 0; }
.s-tools-toggle {
    display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0;
    background: var(--accent-soft); border: 1px solid var(--accent-dim);
    color: var(--accent-bright); padding: 7px 13px; border-radius: 9px;
    font-size: 13px; font-weight: 700; cursor: pointer;
}
.s-tools-toggle:hover { filter: brightness(1.1); }
.s-tools-toggle svg { width: 16px; height: 16px; }

.tool-drawer-backdrop {
    position: fixed; inset: 0; background: rgba(0,0,0,.5);
    opacity: 0; visibility: hidden; transition: opacity .25s ease, visibility .25s ease;
    z-index: 150;
}
.tool-drawer-backdrop.open { opacity: 1; visibility: visible; }

.tool-drawer {
    position: fixed; top: 0; right: 0; bottom: 0;
    width: min(340px, 86vw);
    background: var(--bg-elevated); border-left: 1px solid var(--border-strong);
    box-shadow: -14px 0 44px rgba(0,0,0,.42);
    transform: translateX(100%); transition: transform .28s cubic-bezier(.4,0,.2,1);
    z-index: 160; display: flex; flex-direction: column;
}
.tool-drawer.open { transform: translateX(0); }
.tool-drawer-head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 16px 18px; border-bottom: 1px solid var(--border); flex-shrink: 0;
}
.tool-drawer-head h3 { display: flex; align-items: center; gap: 9px; font-family: var(--font-display); font-size: 16px; font-weight: 700; color: var(--text-primary); }
.tool-drawer-head h3 svg { width: 19px; height: 19px; color: var(--accent2); }
.tool-drawer-body { flex: 1; overflow-y: auto; padding: 14px; -webkit-overflow-scrolling: touch; }
.tool-sec { font-size: 11px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase; color: var(--text-muted); margin: 16px 0 8px; }
.tool-sec:first-child { margin-top: 2px; }

/* Araçları dikey tam-genişlik satırlara çevir */
.tool-drawer .s-tools { flex-direction: column; align-items: stretch; gap: 8px; overflow: visible; flex: none; min-width: 0; }
.tool-drawer .s-btn { width: 100%; justify-content: flex-start; gap: 11px; padding: 13px 15px; border-radius: 12px; font-size: 15px; }
.tool-drawer .s-btn svg { width: 18px; height: 18px; }
.tool-drawer .s-color-lbl { justify-content: flex-start; }
.tool-drawer .s-color-lbl .s-color-a { width: 18px; text-align: center; }
.tool-drawer .s-grp-wide { display: flex; gap: 8px; padding: 0; background: none; border: none; }
.tool-drawer .s-grp-wide button { flex: 1; padding: 13px; border-radius: 12px; font-size: 16px; background: var(--bg-surface-2); border: 1px solid var(--border-strong); color: var(--text-secondary); }
.tool-drawer .s-grp-wide button:hover { color: var(--text-primary); border-color: var(--text-muted); background: var(--bg-surface-2); }
.tool-drawer .s-grp-wide button.on { background: var(--accent); color: #07221b; border-color: transparent; }

/* ============================================================
   Çek İskonto
   ============================================================ */
.chk-suffix { color: var(--text-muted); font-size: 16px; font-weight: 700; flex-shrink: 0; }
.chk-vade-row { display: flex; gap: 10px; align-items: stretch; }
.chk-vade-row .krd-input { flex: 1; }
.chk-date-btn { display: inline-flex; align-items: center; gap: 7px; flex-shrink: 0; padding: 0 16px; border-radius: 13px; background: var(--accent2-soft); border: 1px solid var(--accent2); color: var(--accent2); font-size: 14px; font-weight: 700; cursor: pointer; }
.chk-date-btn:hover { filter: brightness(1.08); }
.chk-date-btn svg { width: 17px; height: 17px; }
.chk-date-input { margin-top: 10px; width: 100%; padding: 12px 14px; border-radius: 13px; background: var(--bg-surface-2); border: 1px solid var(--border); color: var(--text-primary); font-size: 15px; }

.chk-result { padding: 18px; border-radius: 20px; background: var(--bg-surface); border: 1px solid var(--border); margin: 22px 0; }
.chk-result-head { display: flex; align-items: center; gap: 13px; margin-bottom: 14px; }
.chk-result-ic { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 14px; background: #22c55e; color: #fff; flex-shrink: 0; }
.chk-result-ic svg { width: 24px; height: 24px; }
.chk-result-lbl { font-size: 16px; font-weight: 600; color: var(--text-secondary); }
.chk-result-empty { display: flex; align-items: center; gap: 8px; font-size: 14.5px; color: var(--text-muted); }
.chk-result-empty svg { width: 17px; height: 17px; }
.chk-result-val { font-family: var(--font-display); font-size: 34px; font-weight: 800; color: #22c55e; letter-spacing: -.5px; }
.chk-detail { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--border); }
.chk-drow { display: flex; align-items: center; justify-content: space-between; padding: 7px 0; font-size: 14px; color: var(--text-secondary); }
.chk-drow em { font-style: normal; font-size: 12px; color: var(--text-muted); }
.chk-drow b { color: var(--text-primary); font-weight: 700; }
.chk-drow b.cost { color: #f59e0b; }

.chk-formula { position: relative; display: flex; gap: 13px; padding: 16px 18px 16px 20px; border-radius: 16px; background: var(--bg-surface); border: 1px solid var(--border); overflow: hidden; }
.chk-formula::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: #8b5cf6; }
.chk-formula-ic { font-family: var(--font-display); font-size: 24px; font-weight: 800; color: #8b5cf6; line-height: 1.1; flex-shrink: 0; }
.chk-formula-body { display: flex; flex-direction: column; gap: 8px; font-size: 13.5px; color: var(--text-secondary); line-height: 1.5; }

/* ============================================================
   Belge Tarayıcı
   ============================================================ */
.scan-card { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 32px 24px; border-radius: 22px; background: var(--bg-surface); border: 1px solid var(--border); }
.scan-card[hidden] { display: none; }
.scan-card-ic { display: inline-flex; align-items: center; justify-content: center; width: 88px; height: 88px; border-radius: 24px; background: var(--accent2); color: #fff; margin-bottom: 18px; box-shadow: 0 8px 28px rgba(74,147,255,.42); }
.scan-card-ic svg { width: 42px; height: 42px; }
.scan-card h2 { font-family: var(--font-display); font-size: 20px; font-weight: 800; color: var(--text-primary); margin-bottom: 8px; }
.scan-card p { font-size: 14.5px; color: var(--text-muted); line-height: 1.55; margin-bottom: 22px; max-width: 420px; }
.scan-btn { width: 100%; max-width: 440px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; padding: 16px; border-radius: 15px; font-size: 15.5px; font-weight: 700; cursor: pointer; }
.scan-btn + .scan-btn { margin-top: 11px; }
.scan-btn svg { width: 19px; height: 19px; }
.scan-btn.primary { border: 0; background: linear-gradient(135deg, var(--accent2), #6aa9ff); color: #fff; box-shadow: 0 6px 18px rgba(74,147,255,.32); }
.scan-btn.ghost { background: var(--bg-surface-2); border: 1px solid var(--border-strong); color: var(--text-primary); }
.scan-btn.ghost:hover { border-color: var(--accent2); }

.scan-collected[hidden] { display: none; }
.scan-count { display: inline-block; margin-left: 6px; font-family: var(--font-display); color: var(--accent2); }
.scan-pages { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.scan-page { position: relative; border-radius: 14px; overflow: hidden; background: var(--bg-surface-2); border: 1px solid var(--border); aspect-ratio: 3 / 4; }
.scan-page img { width: 100%; height: 100%; object-fit: cover; display: block; }
.scan-page-no { position: absolute; left: 8px; top: 8px; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 7px; background: rgba(0,0,0,.6); color: #fff; font-size: 12px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.scan-page-del { position: absolute; right: 6px; top: 6px; width: 26px; height: 26px; border-radius: 8px; background: rgba(0,0,0,.6); color: #fff; display: grid; place-items: center; cursor: pointer; border: none; }
.scan-page-del:hover { background: var(--danger); }
.scan-page-del svg { width: 15px; height: 15px; }

.scan-bottom { position: sticky; bottom: 16px; display: flex; gap: 12px; margin-top: 24px; }
.scan-bottom-btn { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 15px; border-radius: 15px; font-size: 15px; font-weight: 700; cursor: pointer; }
.scan-bottom-btn svg { width: 18px; height: 18px; }
.scan-bottom-btn.ghost { background: var(--bg-surface); border: 1px solid var(--border-strong); color: var(--text-primary); }
.scan-bottom-btn.primary { border: 0; background: linear-gradient(135deg, var(--accent2), #6aa9ff); color: #fff; box-shadow: 0 6px 18px rgba(74,147,255,.32); }
.scan-bottom-btn.primary:disabled { opacity: .5; box-shadow: none; cursor: default; }
@media (max-width: 860px) { .scan-bottom { position: fixed; left: 16px; right: 16px; bottom: calc(var(--bottomnav-h, 72px) + 12px); margin: 0; z-index: 60; } }

/* ============================================================
   Sorun Bildir
   ============================================================ */
.sr-info { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 26px 24px; border-radius: 20px; background: var(--bg-surface); border: 1px solid var(--border); margin-bottom: 24px; }
.sr-info-ic { display: inline-flex; align-items: center; justify-content: center; width: 66px; height: 66px; border-radius: 18px; background: var(--accent2); color: #fff; margin-bottom: 14px; box-shadow: 0 8px 24px rgba(74,147,255,.38); }
.sr-info-ic svg { width: 32px; height: 32px; }
.sr-info h2 { font-family: var(--font-display); font-size: 19px; font-weight: 700; color: var(--text-primary); margin-bottom: 8px; }
.sr-info p { font-size: 14px; color: var(--text-muted); line-height: 1.55; max-width: 440px; }

.sr-group { position: relative; padding: 14px 16px; border-radius: 18px; background: var(--bg-surface); border: 1px solid var(--border); overflow: hidden; }
.sr-group::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--accent2); }

.sr-opt { display: flex; align-items: center; gap: 13px; padding: 13px 14px; border-radius: 14px; border: 1.5px solid var(--border); cursor: pointer; transition: .12s; }
.sr-opt + .sr-opt { margin-top: 10px; }
.sr-opt input { position: absolute; opacity: 0; width: 0; height: 0; }
.sr-opt-ic { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 13px; color: #fff; flex-shrink: 0; }
.sr-opt-ic svg { width: 22px; height: 22px; }
.sr-red { background: #ef4444; } .sr-amber { background: #f59e0b; } .sr-green { background: #22c55e; } .sr-purple { background: #8b5cf6; }
.sr-opt-label { flex: 1; font-size: 16px; font-weight: 600; color: var(--text-primary); }
.sr-opt-radio { width: 24px; height: 24px; border-radius: 50%; border: 2px solid var(--border-strong); flex-shrink: 0; display: grid; place-items: center; color: transparent; transition: .12s; }
.sr-opt-radio svg { width: 15px; height: 15px; stroke-width: 3; }
.sr-opt:has(input:checked) { border-color: var(--accent2); background: var(--accent2-soft); }
.sr-opt:has(input:checked) .sr-opt-radio { background: var(--accent2); border-color: var(--accent2); color: #fff; }

.sr-count { text-align: right; font-size: 12.5px; color: var(--text-muted); margin-top: 6px; }

/* ============================================================
   Taleplerim (My Support Tickets)
   ============================================================ */
.tm-sub-desc { font-size: 13px; color: var(--text-muted); margin-top: 3px; }
.tm-icon-btn { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 12px; background: var(--bg-surface); border: 1px solid var(--border); color: var(--text-secondary); flex-shrink: 0; transition: .12s; text-decoration: none; }
.tm-icon-btn:hover { border-color: var(--accent); color: var(--accent); }
.tm-icon-btn svg { width: 19px; height: 19px; }

.tk-empty { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 48px 26px; border-radius: 22px; background: var(--bg-surface); border: 1px solid var(--border); margin-top: 8px; }
.tk-empty-ic { display: inline-flex; align-items: center; justify-content: center; width: 76px; height: 76px; border-radius: 22px; background: var(--accent2); color: #fff; margin-bottom: 18px; box-shadow: 0 10px 28px rgba(74,147,255,.4); }
.tk-empty-ic svg { width: 36px; height: 36px; }
.tk-empty h2 { font-family: var(--font-display); font-size: 16px; font-weight: 700; letter-spacing: 1px; color: var(--text-primary); margin-bottom: 9px; }
.tk-empty p { font-size: 14px; color: var(--text-muted); line-height: 1.55; max-width: 400px; }

.tk-list { display: flex; flex-direction: column; gap: 14px; margin-top: 6px; padding-bottom: 90px; }
.tk-card { padding: 16px 16px 15px; border-radius: 18px; background: var(--bg-surface); border: 1px solid var(--border); }
.tk-top { display: flex; align-items: flex-start; gap: 12px; }
.tk-cat-ic { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 13px; color: #fff; flex-shrink: 0; }
.tk-cat-ic svg { width: 21px; height: 21px; }
.tk-head { flex: 1; min-width: 0; }
.tk-subj { font-size: 15.5px; font-weight: 700; color: var(--text-primary); line-height: 1.35; word-break: break-word; }
.tk-meta { font-size: 12.5px; color: var(--text-muted); margin-top: 3px; }
.tk-badge { font-size: 12px; font-weight: 700; padding: 5px 11px; border-radius: 999px; flex-shrink: 0; white-space: nowrap; }
.tk-badge-open { background: rgba(245,158,11,.16); color: #f59e0b; }
.tk-badge-ok { background: rgba(34,197,94,.16); color: #22c55e; }
.tk-badge-mut { background: var(--bg-elevated); color: var(--text-muted); }
.tk-msg { font-size: 14px; color: var(--text-secondary); line-height: 1.55; margin-top: 12px; white-space: pre-wrap; word-break: break-word; }
.tk-reply { margin-top: 13px; padding: 13px 14px; border-radius: 14px; background: var(--accent2-soft); border: 1px solid rgba(74,147,255,.25); }
.tk-reply-head { display: flex; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 700; color: var(--accent2); margin-bottom: 7px; }
.tk-reply-head svg { width: 15px; height: 15px; }
.tk-reply-body { font-size: 14px; color: var(--text-primary); line-height: 1.55; white-space: pre-wrap; word-break: break-word; }

/* ============================================================
   Değerlendirme (Görüşleriniz)
   ============================================================ */
.rv-info { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 30px 24px; border-radius: 22px; background: var(--bg-surface); border: 1px solid var(--border); margin-bottom: 26px; }
.rv-info-ic { display: inline-flex; align-items: center; justify-content: center; width: 74px; height: 74px; border-radius: 22px; background: #16b364; color: #fff; margin-bottom: 16px; box-shadow: 0 10px 28px rgba(22,179,100,.4); }
.rv-info-ic svg { width: 36px; height: 36px; }
.rv-info h2 { font-family: var(--font-display); font-size: 17px; font-weight: 700; letter-spacing: .5px; color: var(--text-primary); margin-bottom: 9px; }
.rv-info p { font-size: 14px; color: var(--text-muted); line-height: 1.55; max-width: 420px; }

.rv-card { position: relative; padding: 18px 18px 20px; border-radius: 18px; background: var(--bg-surface); border: 1px solid var(--border); overflow: hidden; margin-bottom: 16px; }
.rv-card.rv-accent::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--accent2); }
.rv-q { font-size: 16px; font-weight: 700; color: var(--text-primary); line-height: 1.4; margin-bottom: 16px; }

.rv-head { display: flex; align-items: center; gap: 13px; margin-bottom: 16px; }
.rv-head-ic { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 14px; background: var(--accent2-soft); color: var(--accent2); flex-shrink: 0; }
.rv-head-ic svg { width: 23px; height: 23px; }
.rv-head-title { font-size: 16px; font-weight: 700; color: var(--text-primary); }
.rv-head-sub { font-size: 13.5px; color: var(--text-muted); margin-top: 2px; }

.rv-stars { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.rv-star { display: flex; align-items: center; justify-content: center; height: 62px; border-radius: 14px; border: 1px solid var(--border); background: var(--bg-elevated); color: var(--text-muted); cursor: pointer; transition: .12s; }
.rv-star svg { width: 30px; height: 30px; stroke-width: 1.6; fill: none; }
.rv-star:hover { border-color: var(--accent2); }
.rv-star.on { border-color: #f5a623; color: #f5a623; }
.rv-star.on svg { fill: #f5a623; }

.rv-card textarea { width: 100%; min-height: 150px; resize: vertical; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 14px; padding: 14px; color: var(--text-primary); font-size: 15px; line-height: 1.55; font-family: inherit; }
.rv-card textarea:focus { outline: none; border-color: var(--accent2); }
.rv-count { text-align: right; font-size: 12.5px; color: var(--text-muted); margin-top: 8px; }

.rv-list { display: flex; flex-direction: column; gap: 14px; padding-bottom: 40px; }
.rv-past { padding: 16px 16px 15px; border-radius: 16px; background: var(--bg-surface); border: 1px solid var(--border); }
.rv-past-top { display: flex; align-items: center; justify-content: space-between; }
.rv-past-stars { display: inline-flex; gap: 3px; color: var(--text-muted); }
.rv-past-stars svg { width: 17px; height: 17px; fill: none; }
.rv-past-stars svg.on { color: #f5a623; fill: #f5a623; }
.rv-past-date { font-size: 12.5px; color: var(--text-muted); }
.rv-past-comment { font-size: 14px; color: var(--text-secondary); line-height: 1.55; margin-top: 10px; white-space: pre-wrap; word-break: break-word; }

/* ============================================================
   Satın Alınanlar
   ============================================================ */
.pu-plan { display: flex; align-items: center; gap: 16px; padding: 18px 18px; border-radius: 20px; background: linear-gradient(135deg, rgba(74,147,255,.16), rgba(74,147,255,.04)); border: 1px solid var(--border); margin-bottom: 26px; box-shadow: 0 10px 30px rgba(74,147,255,.14); }
.pu-plan-ic { display: inline-flex; align-items: center; justify-content: center; width: 60px; height: 60px; border-radius: 16px; background: var(--bg-elevated); color: var(--text-secondary); flex-shrink: 0; }
.pu-plan-ic svg { width: 26px; height: 26px; }
.pu-plan-info { flex: 1; min-width: 0; }
.pu-plan-label { font-size: 13.5px; color: var(--text-muted); }
.pu-plan-name { font-family: var(--font-display); font-size: 26px; font-weight: 800; color: var(--text-primary); line-height: 1.1; margin-top: 2px; }
.pu-plan-btn { display: inline-flex; align-items: center; padding: 12px 22px; border-radius: 13px; background: var(--bg-elevated); border: 1px solid var(--border-strong); color: var(--text-primary); font-size: 15px; font-weight: 600; text-decoration: none; flex-shrink: 0; transition: .12s; }
.pu-plan-btn:hover { border-color: var(--accent2); color: var(--accent2); }

.pu-list { border-radius: 20px; background: var(--bg-surface); border: 1px solid var(--border); overflow: hidden; }
.pu-card { position: relative; display: flex; align-items: flex-start; gap: 14px; padding: 18px 18px; }
.pu-card::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--accent2); }
.pu-card + .pu-card { border-top: 1px solid var(--border); }
.pu-card-ic { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 14px; background: var(--accent2-soft); color: var(--accent2); flex-shrink: 0; }
.pu-card-ic svg { width: 22px; height: 22px; }
.pu-card-body { flex: 1; min-width: 0; }
.pu-card-name { font-size: 17px; font-weight: 700; color: var(--text-primary); }
.pu-card-date { font-size: 14px; color: var(--text-muted); margin-top: 3px; }
.pu-badge { display: inline-flex; align-items: center; gap: 6px; margin-top: 10px; padding: 5px 11px; border-radius: 999px; background: rgba(34,197,94,.14); color: #22c55e; font-size: 12.5px; font-weight: 600; }
.pu-badge svg { width: 14px; height: 14px; }
.pu-card-price { font-size: 19px; font-weight: 800; color: var(--accent2); flex-shrink: 0; white-space: nowrap; }
.pu-foot { text-align: center; font-size: 13.5px; color: var(--text-muted); margin: 20px 0 40px; }

/* ============================================================
   Tanıtım (Landing / Marketing) sayfası — .mk-*
   ============================================================ */
.mk-body { background: var(--bg-deep); color: var(--text-primary); overflow-x: hidden; }
.mk-shell { max-width: 1160px; margin: 0 auto; padding: 0 22px; width: 100%; }
.mk-body a { text-decoration: none; color: inherit; }

/* ---- Buttons ---- */
.mk-btn { display: inline-flex; align-items: center; gap: 8px; padding: 11px 20px; border-radius: 12px; font-family: var(--font-display); font-weight: 600; font-size: 14.5px; cursor: pointer; border: 1px solid transparent; transition: .16s; white-space: nowrap; }
.mk-btn svg { width: 17px; height: 17px; }
.mk-btn-primary { background: linear-gradient(135deg, var(--accent), var(--accent2)); color: #04121b; box-shadow: 0 10px 26px rgba(45,212,167,.28); }
.mk-btn-primary:hover { transform: translateY(-2px); box-shadow: 0 14px 32px rgba(45,212,167,.4); }
.mk-btn-ghost { background: transparent; color: var(--text-secondary); }
.mk-btn-ghost:hover { color: var(--text-primary); }
.mk-btn-outline { background: rgba(255,255,255,.03); color: var(--text-primary); border-color: var(--border-strong); }
.mk-btn-outline:hover { border-color: var(--accent); color: var(--accent); }
.mk-btn-lg { padding: 15px 28px; font-size: 16px; border-radius: 14px; }

/* ---- Nav ---- */
.mk-nav { position: fixed; top: 0; left: 0; right: 0; z-index: 100; transition: .22s; border-bottom: 1px solid transparent; }
.mk-nav.scrolled { background: var(--topbar-bg); backdrop-filter: blur(16px); border-bottom-color: var(--border); }
.mk-nav-inner { display: flex; align-items: center; gap: 20px; height: 68px; }
.mk-brand { display: inline-flex; align-items: center; gap: 10px; }
.mk-brand-mark { width: 34px; height: 34px; border-radius: 9px; box-shadow: 0 0 18px var(--logo-glow); }
.mk-brand-text { font-family: var(--font-display); font-weight: 800; font-size: 20px; letter-spacing: -.4px; }
.mk-brand-text span { color: var(--accent); }
.mk-links { display: flex; align-items: center; gap: 26px; margin: 0 auto; }
.mk-links a { font-size: 14.5px; color: var(--text-secondary); font-weight: 500; transition: .14s; }
.mk-links a:hover { color: var(--text-primary); }
.mk-nav-cta { display: flex; align-items: center; gap: 10px; }
.mk-burger { display: none; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 11px; background: rgba(255,255,255,.04); border: 1px solid var(--border); color: var(--text-primary); cursor: pointer; }
.mk-burger svg { width: 20px; height: 20px; }
.mk-mobile-menu { display: none; flex-direction: column; gap: 4px; padding: 10px 22px 18px; background: var(--bg-base); border-bottom: 1px solid var(--border); }
.mk-mobile-menu.open { display: flex; }
.mk-mobile-menu a { padding: 12px 4px; color: var(--text-secondary); font-weight: 500; border-bottom: 1px solid var(--border); }
.mk-mobile-menu a.mk-btn { justify-content: center; border-bottom: none; margin-top: 8px; }

/* ---- Hero ---- */
.mk-hero { position: relative; padding: 150px 0 80px; text-align: center; overflow: hidden; }
.mk-hero-glow { position: absolute; top: -180px; left: 50%; transform: translateX(-50%); width: 900px; height: 620px; background: radial-gradient(closest-side, rgba(45,212,167,.20), rgba(74,147,255,.10) 55%, transparent 72%); pointer-events: none; z-index: 0; }
.mk-hero-inner { position: relative; z-index: 1; }
.mk-badge { display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px; border-radius: 999px; background: var(--accent-soft); border: 1px solid rgba(45,212,167,.28); color: var(--accent-bright); font-size: 13.5px; font-weight: 600; margin-bottom: 26px; }
.mk-badge svg { width: 15px; height: 15px; }
.mk-hero-title { font-family: var(--font-display); font-weight: 800; font-size: clamp(34px, 6vw, 62px); line-height: 1.06; letter-spacing: -1.5px; margin-bottom: 22px; }
.mk-hero-title span { background: linear-gradient(120deg, var(--accent), var(--accent2)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.mk-hero-sub { max-width: 640px; margin: 0 auto 34px; font-size: clamp(15px, 2.2vw, 18px); line-height: 1.6; color: var(--text-secondary); }
.mk-hero-cta { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.mk-hero-note { margin-top: 22px; display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--text-muted); }
.mk-hero-note svg { width: 16px; height: 16px; color: var(--accent); }

/* ---- Stats ---- */
.mk-stats { padding: 10px 0 26px; }
.mk-stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; padding: 26px 22px; border-radius: 22px; background: linear-gradient(135deg, rgba(45,212,167,.06), rgba(74,147,255,.05)); border: 1px solid var(--border); }
.mk-stat { text-align: center; }
.mk-stat-n { font-family: var(--font-display); font-weight: 800; font-size: clamp(20px, 3vw, 27px); background: linear-gradient(120deg, var(--accent), var(--accent2)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.mk-stat-l { font-size: 13.5px; color: var(--text-muted); margin-top: 5px; }

/* ---- Sections ---- */
.mk-section { padding: 84px 0; }
.mk-section-alt { background: var(--bg-base); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.mk-head { text-align: center; max-width: 620px; margin: 0 auto 50px; }
.mk-eyebrow { display: inline-block; font-family: var(--font-display); font-size: 12.5px; font-weight: 700; letter-spacing: 2px; color: var(--accent); margin-bottom: 14px; }
.mk-head h2 { font-family: var(--font-display); font-weight: 800; font-size: clamp(26px, 4vw, 40px); line-height: 1.12; letter-spacing: -.8px; margin-bottom: 14px; }
.mk-head p { font-size: 16px; line-height: 1.6; color: var(--text-secondary); }
.mk-grid { display: grid; gap: 18px; }
.mk-grid-3 { grid-template-columns: repeat(3, 1fr); }
.mk-grid-4 { grid-template-columns: repeat(4, 1fr); }

/* ---- Feature cards ---- */
.mk-card { padding: 26px 22px; border-radius: 18px; background: var(--bg-surface); border: 1px solid var(--border); transition: .18s; }
.mk-card:hover { transform: translateY(-4px); border-color: rgba(45,212,167,.35); box-shadow: var(--shadow); }
.mk-card-ic { display: inline-flex; align-items: center; justify-content: center; width: 54px; height: 54px; border-radius: 15px; background: linear-gradient(135deg, var(--accent-soft), var(--accent2-soft)); color: var(--accent); margin-bottom: 16px; }
.mk-card-ic svg { width: 26px; height: 26px; }
.mk-card h3 { font-family: var(--font-display); font-weight: 700; font-size: 18px; margin-bottom: 9px; }
.mk-card p { font-size: 14.5px; line-height: 1.58; color: var(--text-secondary); }

/* ---- Tools ---- */
.mk-tools { gap: 14px; }
.mk-tool { display: flex; align-items: center; gap: 14px; padding: 18px 20px; border-radius: 15px; background: var(--bg-surface); border: 1px solid var(--border); transition: .16s; }
.mk-tool:hover { border-color: rgba(74,147,255,.4); transform: translateY(-3px); }
.mk-tool-ic { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 13px; background: var(--accent2-soft); color: var(--accent2); flex-shrink: 0; }
.mk-tool-ic svg { width: 22px; height: 22px; }
.mk-tool-name { font-family: var(--font-display); font-weight: 600; font-size: 15.5px; }

/* ---- Why ---- */
.mk-why { padding: 24px 20px; border-radius: 18px; background: var(--bg-surface); border: 1px solid var(--border); }
.mk-why-n { font-family: var(--font-display); font-weight: 800; font-size: 30px; background: linear-gradient(120deg, var(--accent), var(--accent2)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.mk-why h3 { font-family: var(--font-display); font-weight: 700; font-size: 16.5px; margin: 12px 0 8px; }
.mk-why p { font-size: 14px; line-height: 1.56; color: var(--text-secondary); }

/* ---- CTA band ---- */
.mk-cta { padding: 40px 0 90px; }
.mk-cta-inner { position: relative; overflow: hidden; text-align: center; padding: 56px 26px; border-radius: 28px; background: linear-gradient(135deg, rgba(45,212,167,.10), rgba(74,147,255,.10)); border: 1px solid var(--border-strong); }
.mk-cta-glow { position: absolute; inset: 0; background: radial-gradient(circle at 50% 0%, rgba(45,212,167,.18), transparent 60%); pointer-events: none; }
.mk-cta-inner h2 { position: relative; font-family: var(--font-display); font-weight: 800; font-size: clamp(24px, 4vw, 38px); letter-spacing: -.6px; margin-bottom: 12px; }
.mk-cta-inner p { position: relative; font-size: 16px; color: var(--text-secondary); margin-bottom: 28px; }
.mk-cta-inner .mk-hero-cta { position: relative; }

/* ---- Footer ---- */
.mk-footer { background: var(--bg-base); border-top: 1px solid var(--border); padding: 54px 0 26px; }
.mk-footer-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 34px; padding-bottom: 40px; border-bottom: 1px solid var(--border); }
.mk-foot-brand p { margin-top: 14px; font-size: 14px; line-height: 1.6; color: var(--text-muted); max-width: 340px; }
.mk-foot-col h4 { font-family: var(--font-display); font-size: 14px; font-weight: 700; margin-bottom: 14px; }
.mk-foot-col a { display: block; font-size: 14px; color: var(--text-muted); padding: 6px 0; transition: .14s; }
.mk-foot-col a:hover { color: var(--accent); }
.mk-foot-bottom { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; padding-top: 22px; font-size: 13px; color: var(--text-muted); }
.mk-foot-legal a:hover { color: var(--accent); }

/* ---- Responsive ---- */
@media (max-width: 900px) {
    .mk-links { display: none; }
    .mk-burger { display: inline-flex; }
    .mk-nav-cta .mk-btn { display: none; }
    .mk-grid-3, .mk-grid-4 { grid-template-columns: repeat(2, 1fr); }
    .mk-footer-grid { grid-template-columns: 1fr 1fr; }
    .mk-foot-brand { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
    .mk-hero { padding: 128px 0 60px; }
    .mk-stats-grid { grid-template-columns: repeat(2, 1fr); }
    .mk-grid-3, .mk-grid-4 { grid-template-columns: 1fr; }
    .mk-footer-grid { grid-template-columns: 1fr; }
    .mk-hero-cta .mk-btn { flex: 1; justify-content: center; }
}

/* ============================================================
   Hukuki metin sayfaları (Gizlilik / Kullanım / KVKK) — .lg-*
   ============================================================ */
.lg-hero { position: relative; padding: 128px 0 44px; overflow: hidden; border-bottom: 1px solid var(--border); }
.lg-hero-glow { position: absolute; top: -160px; left: 50%; transform: translateX(-50%); width: 760px; height: 460px; background: radial-gradient(closest-side, rgba(74,147,255,.16), rgba(45,212,167,.08) 55%, transparent 72%); pointer-events: none; }
.lg-back { position: relative; display: inline-flex; align-items: center; gap: 7px; font-size: 14px; color: var(--text-secondary); margin-bottom: 22px; transition: .14s; }
.lg-back:hover { color: var(--accent); }
.lg-back svg { width: 16px; height: 16px; }
.lg-eyebrow { position: relative; display: inline-flex; align-items: center; gap: 7px; font-family: var(--font-display); font-size: 12.5px; font-weight: 700; letter-spacing: 2px; color: var(--accent); margin-bottom: 12px; }
.lg-eyebrow svg { width: 15px; height: 15px; }
.lg-hero h1 { position: relative; font-family: var(--font-display); font-weight: 800; font-size: clamp(28px, 5vw, 44px); letter-spacing: -1px; margin-bottom: 10px; }
.lg-updated { position: relative; font-size: 14px; color: var(--text-muted); }

.lg-wrap { padding: 46px 0 70px; }
.lg-grid { display: grid; grid-template-columns: 250px 1fr; gap: 40px; align-items: start; }

.lg-toc { position: sticky; top: 88px; align-self: start; padding: 18px; border-radius: 16px; background: var(--bg-surface); border: 1px solid var(--border); max-height: calc(100vh - 110px); overflow-y: auto; }
.lg-toc-title { font-family: var(--font-display); font-size: 12.5px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: var(--text-muted); margin-bottom: 12px; }
.lg-toc a { display: block; font-size: 13.5px; color: var(--text-secondary); padding: 7px 10px; border-radius: 9px; border-left: 2px solid transparent; transition: .12s; }
.lg-toc a:hover { color: var(--text-primary); background: var(--bg-elevated); border-left-color: var(--accent); }

.lg-doc { max-width: 760px; }
.lg-doc .lg-lead { font-size: 16px; line-height: 1.7; color: var(--text-secondary); padding: 18px 20px; border-radius: 14px; background: var(--bg-surface); border: 1px solid var(--border); margin-bottom: 30px; }
.lg-doc h2 { font-family: var(--font-display); font-weight: 700; font-size: 22px; letter-spacing: -.4px; margin: 38px 0 14px; padding-top: 10px; scroll-margin-top: 84px; }
.lg-doc h3 { font-family: var(--font-display); font-weight: 700; font-size: 16.5px; color: var(--text-primary); margin: 22px 0 8px; }
.lg-doc p { font-size: 15px; line-height: 1.72; color: var(--text-secondary); margin-bottom: 14px; }
.lg-doc strong { color: var(--text-primary); font-weight: 600; }
.lg-doc ul { list-style: none; margin: 4px 0 16px; padding: 0; }
.lg-doc li { position: relative; font-size: 15px; line-height: 1.6; color: var(--text-secondary); padding: 6px 0 6px 24px; }
.lg-doc li::before { content: ""; position: absolute; left: 4px; top: 14px; width: 7px; height: 7px; border-radius: 50%; background: linear-gradient(135deg, var(--accent), var(--accent2)); }
.lg-doc a { color: var(--accent2); text-decoration: none; }
.lg-doc a:hover { text-decoration: underline; }

.lg-note { display: flex; gap: 12px; align-items: flex-start; padding: 15px 17px; border-radius: 14px; background: var(--accent-soft); border: 1px solid rgba(45,212,167,.24); font-size: 14.5px; line-height: 1.6; color: var(--text-primary); margin: 16px 0 20px; }
.lg-note svg { width: 20px; height: 20px; color: var(--accent-bright); flex-shrink: 0; margin-top: 1px; }

.lg-contact { display: grid; gap: 1px; background: var(--border); border: 1px solid var(--border); border-radius: 14px; overflow: hidden; margin: 8px 0 18px; }
.lg-contact > div { display: flex; justify-content: space-between; gap: 16px; align-items: center; flex-wrap: wrap; padding: 14px 18px; background: var(--bg-surface); }
.lg-contact span { font-size: 13.5px; color: var(--text-muted); }
.lg-contact strong { font-size: 15px; color: var(--text-primary); font-weight: 600; }

.lg-links { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 40px; padding-top: 26px; border-top: 1px solid var(--border); }
.lg-links a { display: inline-flex; align-items: center; gap: 8px; padding: 12px 18px; border-radius: 12px; background: var(--bg-surface); border: 1px solid var(--border); color: var(--text-primary); font-family: var(--font-display); font-weight: 600; font-size: 14px; transition: .14s; }
.lg-links a:hover { border-color: var(--accent); color: var(--accent); text-decoration: none; }
.lg-links a svg { width: 16px; height: 16px; }

@media (max-width: 860px) {
    .lg-grid { grid-template-columns: 1fr; gap: 22px; }
    .lg-toc { position: static; max-height: none; }
    .lg-toc a { display: inline-block; }
}

.mk-section[id], .mk-hero[id] { scroll-margin-top: 78px; }

/* ============================================================
   Herkese açık Planlar (fiyatsız) — .pp-*
   ============================================================ */
.pp-empty { text-align: center; padding: 40px; color: var(--text-muted); background: var(--bg-surface); border: 1px solid var(--border); border-radius: 18px; }

.pp-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 18px; }
.pp-card { position: relative; display: flex; flex-direction: column; padding: 26px 22px; border-radius: 20px; background: var(--bg-surface); border: 1px solid var(--border); transition: .18s; }
.pp-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.pp-card.popular { border-color: rgba(45,212,167,.5); box-shadow: 0 12px 34px rgba(45,212,167,.16); }
.pp-badge { position: absolute; top: -12px; left: 50%; transform: translateX(-50%); padding: 5px 14px; border-radius: 999px; background: linear-gradient(135deg, var(--accent), var(--accent2)); color: #04121b; font-family: var(--font-display); font-weight: 700; font-size: 12px; white-space: nowrap; }
.pp-name { font-family: var(--font-display); font-weight: 800; font-size: 22px; letter-spacing: -.4px; margin-bottom: 16px; }
.pp-feats { list-style: none; margin: 0 0 22px; padding: 0; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.pp-feats li { display: flex; align-items: center; gap: 10px; font-size: 14.5px; color: var(--text-secondary); }
.pp-feats li i { width: 17px; height: 17px; color: var(--accent); flex-shrink: 0; }
.pp-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 13px 18px; border-radius: 12px; font-family: var(--font-display); font-weight: 600; font-size: 14.5px; text-decoration: none; background: rgba(255,255,255,.04); border: 1px solid var(--border-strong); color: var(--text-primary); transition: .14s; }
.pp-btn:hover { border-color: var(--accent); color: var(--accent); }
.pp-card.popular .pp-btn { background: linear-gradient(135deg, var(--accent), var(--accent2)); color: #04121b; border-color: transparent; box-shadow: 0 8px 22px rgba(45,212,167,.28); }
.pp-card.popular .pp-btn:hover { transform: translateY(-2px); color: #04121b; }

/* Karşılaştırma tablosu */
.pp-cmp-wrap { overflow-x: auto; border-radius: 18px; border: 1px solid var(--border); background: var(--bg-surface); -webkit-overflow-scrolling: touch; }
.pp-cmp { width: 100%; border-collapse: collapse; min-width: 640px; }
.pp-cmp th, .pp-cmp td { padding: 14px 16px; text-align: center; font-size: 14px; border-bottom: 1px solid var(--border); white-space: nowrap; }
.pp-cmp thead th { position: sticky; top: 0; background: var(--bg-surface-2); font-family: var(--font-display); font-weight: 700; font-size: 15px; color: var(--text-primary); z-index: 2; }
.pp-cmp tbody td { color: var(--text-secondary); }
.pp-cmp-feat { text-align: left !important; position: sticky; left: 0; background: var(--bg-surface); font-weight: 600; color: var(--text-primary) !important; z-index: 1; }
.pp-cmp thead .pp-cmp-feat { z-index: 3; background: var(--bg-surface-2); }
.pp-cmp .pp-cmp-pop { background: var(--accent-soft); }
.pp-cmp thead .pp-cmp-pop { background: linear-gradient(180deg, rgba(45,212,167,.18), var(--bg-surface-2)); color: var(--accent-bright); }
.pp-cmp tbody tr:last-child td { border-bottom: none; }
.pp-yes { width: 18px; height: 18px; color: var(--accent); }
.pp-no { width: 16px; height: 16px; color: var(--text-muted); opacity: .6; }

.pp-cta { text-align: center; margin-top: 44px; }

@media (max-width: 560px) {
    .pp-cards { grid-template-columns: 1fr; }
}

/* Şifre sıfırlama — canlı eşleşme uyarısı */
.auth-pwmsg { align-items: center; gap: 7px; font-size: 13px; color: var(--danger); margin: -4px 0 12px; }
.auth-pwmsg svg { width: 15px; height: 15px; flex-shrink: 0; }
.btn.is-disabled, .btn:disabled { opacity: .55; cursor: not-allowed; filter: grayscale(.2); }

/* Bildirim → yönlendirme göstergesi */
.notif-item.has-link { cursor: pointer; }
.notif-item.has-link:hover { background: var(--bg-elevated); }
.notif-go { display: inline-flex; align-items: center; gap: 4px; margin-left: 10px; color: var(--accent2); font-weight: 600; }
.notif-go svg { width: 13px; height: 13px; }

/* Bildirimden gelen kaydı vurgula */
@keyframes recFlash { 0%,100% { box-shadow: 0 0 0 0 rgba(74,147,255,0); } 25% { box-shadow: 0 0 0 3px var(--accent2); } }
.tk-highlight { animation: recFlash 1.3s ease-in-out 2; border-color: var(--accent2) !important; }

/* Footer ödeme logoları bandı (iyzico + Visa/Mastercard/Troy/Amex) */
.mk-pay { display: flex; align-items: center; justify-content: center; gap: 16px; flex-wrap: wrap; padding: 24px 22px 4px; }
.mk-pay-txt { display: inline-flex; align-items: center; gap: 7px; color: var(--text-muted); font-size: 13px; }
.mk-pay-txt svg { width: 15px; height: 15px; color: var(--accent); }
.mk-pay-band { background: #fff; border-radius: 10px; padding: 8px 14px; display: inline-flex; box-shadow: 0 4px 14px rgba(0,0,0,.18); }
.mk-pay-band img { height: 26px; display: block; }

/* ============================================================
   Atmos AI — sohbet ekranı (.aic-*)
   ============================================================ */
.aic-page { display: flex; flex-direction: column; height: calc(100vh - 136px); min-height: 440px; }
.aic-logo { display: inline-flex; }
.aic-logo img { width: 34px; height: 34px; border-radius: 9px; box-shadow: 0 0 16px var(--logo-glow); }

.aic-chat { flex: 1; overflow-y: auto; padding: 10px 2px 18px; display: flex; flex-direction: column; gap: 16px; }
.aic-msg { display: flex; gap: 10px; max-width: 840px; width: fit-content; }
.aic-msg.me { flex-direction: row-reverse; margin-left: auto; }
.aic-av { width: 32px; height: 32px; border-radius: 9px; flex-shrink: 0; display: grid; place-items: center; overflow: hidden; }
.aic-av.ai { background: var(--bg-elevated); }
.aic-av.ai img { width: 100%; height: 100%; object-fit: cover; }
.aic-av.me { background: var(--accent2-soft); color: var(--accent2); }
.aic-av.me svg { width: 17px; height: 17px; }
.aic-body { display: flex; flex-direction: column; gap: 6px; min-width: 0; max-width: 100%; align-items: flex-start; }
.aic-msg.me .aic-body { align-items: flex-end; }

.aic-text { display: inline-block; max-width: 100%; padding: 11px 14px; border-radius: 14px; font-size: 14.5px; line-height: 1.55; word-break: break-word; }
.aic-msg.ai .aic-text { background: var(--bg-surface); border: 1px solid var(--border); border-top-left-radius: 4px; color: var(--text-primary); }
.aic-msg.me .aic-text { background: var(--accent2); color: #fff; border-top-right-radius: 4px; }
.aic-text.aic-err { display: flex; align-items: center; gap: 8px; background: rgba(240,85,109,.10); border: 1px solid rgba(240,85,109,.32); color: var(--danger); }
.aic-text.aic-err svg { width: 17px; height: 17px; flex-shrink: 0; }

.aic-tool { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--text-muted); }
.aic-tool svg { width: 13px; height: 13px; }
.aic-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.aic-chip { padding: 7px 12px; border-radius: 999px; border: 1px solid var(--border-strong); background: var(--bg-elevated); color: var(--text-secondary); font-size: 13px; cursor: pointer; transition: .12s; }
.aic-chip:hover { border-color: var(--accent); color: var(--accent); }

.aic-actions { display: flex; gap: 8px; margin-top: 2px; flex-wrap: wrap; }
.aic-btn { display: inline-flex; align-items: center; gap: 7px; padding: 9px 15px; border-radius: 11px; font-size: 13.5px; font-weight: 600; cursor: pointer; text-decoration: none; border: 1px solid transparent; transition: .12s; }
.aic-btn svg { width: 15px; height: 15px; }
.aic-btn.primary { background: var(--accent2); color: #fff; }
.aic-btn.primary:hover { filter: brightness(1.08); }
.aic-btn.ghost { background: var(--bg-elevated); border: 1px solid var(--border-strong); color: var(--text-secondary); }
.aic-btn.ghost:hover { color: var(--text-primary); border-color: var(--accent); }
.aic-cancelled { font-size: 13px; color: var(--text-muted); display: inline-flex; align-items: center; gap: 7px; margin-top: 4px; }
.aic-cancelled svg { width: 15px; height: 15px; }

.aic-dots { display: inline-flex; gap: 5px; padding: 10px 6px; }
.aic-dots span { width: 8px; height: 8px; border-radius: 50%; background: var(--text-muted); animation: aicdot 1.2s infinite ease-in-out; }
.aic-dots span:nth-child(2) { animation-delay: .18s; }
.aic-dots span:nth-child(3) { animation-delay: .36s; }
@keyframes aicdot { 0%, 60%, 100% { opacity: .3; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-4px); } }

.aic-inputbar { display: flex; align-items: flex-end; gap: 10px; padding: 10px 12px; border-radius: 16px; background: var(--bg-surface); border: 1px solid var(--border); }
.aic-inputbar textarea { flex: 1; resize: none; border: none; background: transparent; color: var(--text-primary); font-size: 15px; line-height: 1.5; font-family: inherit; max-height: 160px; outline: none; padding: 6px 4px; }
.aic-inputbar textarea::placeholder { color: var(--text-muted); }
.aic-send { width: 40px; height: 40px; border-radius: 11px; background: var(--accent2); color: #fff; display: grid; place-items: center; flex-shrink: 0; cursor: pointer; border: none; transition: .12s; }
.aic-send:hover { filter: brightness(1.08); }
.aic-send:disabled { opacity: .5; cursor: default; }
.aic-send svg { width: 19px; height: 19px; }
.aic-hint { text-align: center; font-size: 11.5px; color: var(--text-muted); margin-top: 8px; }

@media (max-width: 640px) {
    .aic-page { height: calc(100dvh - 200px); min-height: 380px; }
    .aic-msg { max-width: 100%; }
}

/* ============================================================
   iyzico ödeme sayfası (.pay-*)
   ============================================================ */
.pay-body { min-height: 100vh; background: var(--bg-deep); color: var(--text-primary); display: flex; justify-content: center; padding: 28px 16px; }
.pay-wrap { width: 100%; max-width: 520px; display: flex; flex-direction: column; }
.pay-topbrand { display: flex; align-items: center; justify-content: center; gap: 10px; margin-bottom: 22px; }
.pay-topbrand img { width: 40px; height: 40px; border-radius: 11px; box-shadow: 0 0 18px var(--logo-glow); }
.pay-brandtext { font-family: var(--font-display); font-weight: 800; font-size: 22px; letter-spacing: -.4px; }
.pay-brandtext span { color: var(--accent); }

.pay-card { background: var(--bg-surface); border: 1px solid var(--border); border-radius: 20px; padding: 20px; box-shadow: var(--shadow); }

.pay-summary { border: 1px solid var(--border); border-radius: 14px; overflow: hidden; margin-bottom: 18px; }
.pay-sum-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 13px 16px; }
.pay-sum-row + .pay-sum-row { border-top: 1px solid var(--border); }
.pay-sum-label { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; color: var(--text-muted); }
.pay-sum-label svg { width: 16px; height: 16px; }
.pay-sum-val { font-size: 15px; font-weight: 600; color: var(--text-primary); text-align: right; }
.pay-sum-total { background: var(--accent-soft); }
.pay-sum-total .pay-sum-label { color: var(--text-secondary); font-weight: 600; }
.pay-sum-price { font-family: var(--font-display); font-weight: 800; font-size: 22px; color: var(--accent); }

/* iyzico formu için beyaz zemin (kart formu okunaklı olsun) */
.pay-formwrap { background: #fff; border-radius: 14px; padding: 12px; min-height: 120px; }
#iyzipay-checkout-form { width: 100%; }

.pay-foot { display: flex; flex-direction: column; align-items: center; gap: 12px; margin-top: 20px; }
.pay-secure { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; color: var(--text-muted); }
.pay-secure svg { width: 15px; height: 15px; color: var(--accent); }
.pay-band { background: #fff; border-radius: 9px; padding: 7px 12px; display: inline-flex; box-shadow: 0 4px 14px rgba(0,0,0,.2); }
.pay-band img { height: 24px; display: block; }

/* Durum sayfaları (başarı / hata / result) */
.pay-state { text-align: center; padding: 40px 24px; }
.pay-state-ic { display: inline-flex; align-items: center; justify-content: center; width: 74px; height: 74px; border-radius: 50%; margin-bottom: 18px; }
.pay-state-ic svg { width: 38px; height: 38px; stroke-width: 3; color: #fff; }
.pay-state-ic.ok { background: #16b364; box-shadow: 0 10px 28px rgba(22,179,100,.4); }
.pay-state-ic.err { background: var(--danger); box-shadow: 0 10px 28px rgba(240,85,109,.35); }
.pay-state h1 { font-family: var(--font-display); font-weight: 800; font-size: 24px; margin-bottom: 10px; }
.pay-state p { font-size: 15px; line-height: 1.6; color: var(--text-secondary); max-width: 400px; margin: 0 auto 6px; }
.pay-state .pay-sub { color: var(--text-muted); font-size: 14px; }
.pay-state-actions { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; margin-top: 24px; }
.pay-btn { display: inline-flex; align-items: center; gap: 8px; padding: 12px 20px; border-radius: 12px; font-family: var(--font-display); font-weight: 600; font-size: 14.5px; text-decoration: none; background: var(--bg-elevated); border: 1px solid var(--border-strong); color: var(--text-primary); transition: .14s; }
.pay-btn svg { width: 16px; height: 16px; }
.pay-btn:hover { border-color: var(--accent); color: var(--accent); }
.pay-btn.primary { background: linear-gradient(135deg, var(--accent), var(--accent2)); color: #04121b; border-color: transparent; }
.pay-btn.primary:hover { filter: brightness(1.05); color: #04121b; }

/* Topbar paket rozeti (kullanıcı adının yanında) */
.tb-nameline { display: flex; align-items: center; gap: 9px; min-width: 0; }
.tb-nameline .tb-name { min-width: 0; }
.tb-plan { display: inline-flex; align-items: center; gap: 5px; flex-shrink: 0; padding: 3px 10px; border-radius: 999px; font-family: var(--font-body); font-size: 11.5px; font-weight: 700; letter-spacing: .2px; text-transform: none; text-decoration: none; white-space: nowrap; background: linear-gradient(135deg, var(--accent-soft), var(--accent2-soft)); color: var(--accent-bright); border: 1px solid rgba(45,212,167,.32); transition: border-color .14s, filter .14s; }
.tb-plan:hover { border-color: var(--accent); filter: brightness(1.05); }
.tb-plan svg { width: 13px; height: 13px; }
.tb-plan.free { background: var(--bg-elevated); color: var(--text-muted); border-color: var(--border-strong); }
@media (max-width: 560px) { .tb-plan { font-size: 10.5px; padding: 2px 8px; } .tb-plan svg { width: 12px; height: 12px; } }

/* ============================================================
   Davet Et & Kazan (Referral) — .rf-*
   ============================================================ */
.rf-code-card { background: var(--bg-surface); border: 1px solid var(--border); border-radius: 20px; padding: 20px; margin-bottom: 18px; }
.rf-code-head { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.rf-gift { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 14px; background: #16b364; color: #fff; box-shadow: 0 8px 22px rgba(22,179,100,.35); flex-shrink: 0; }
.rf-gift svg { width: 23px; height: 23px; }
.rf-code-title { font-family: var(--font-display); font-weight: 700; font-size: 18px; color: var(--text-primary); }

.rf-code-box { display: flex; align-items: center; gap: 12px; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 14px; padding: 16px 18px; margin-bottom: 14px; }
.rf-code { flex: 1; font-family: var(--font-display); font-weight: 800; font-size: 30px; letter-spacing: 4px; color: var(--text-primary); user-select: all; word-break: break-all; }
.rf-code-copy { flex-shrink: 0; width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center; color: var(--text-muted); border: 1px solid transparent; transition: .14s; }
.rf-code-copy:hover { color: var(--accent); background: var(--bg-surface); }
.rf-code-copy svg { width: 20px; height: 20px; }

.rf-code-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.rf-btn { display: inline-flex; align-items: center; justify-content: center; gap: 9px; padding: 14px 18px; border-radius: 13px; font-family: var(--font-display); font-weight: 700; font-size: 15px; cursor: pointer; border: 1px solid transparent; transition: .14s; }
.rf-btn svg { width: 18px; height: 18px; }
.rf-btn-light { background: var(--bg-elevated); border-color: var(--border-strong); color: var(--text-primary); }
.rf-btn-light:hover { border-color: var(--accent); color: var(--accent); }
.rf-btn-primary { background: var(--accent2); color: #fff; box-shadow: 0 8px 22px rgba(74,147,255,.32); }
.rf-btn-primary:hover { filter: brightness(1.07); }

.rf-rules { position: relative; background: var(--bg-surface); border: 1px solid var(--border); border-radius: 18px; padding: 20px 20px 14px; margin-bottom: 24px; overflow: hidden; }
.rf-rules::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: var(--warning); }
.rf-rules-head { display: flex; align-items: center; gap: 9px; font-family: var(--font-display); font-weight: 700; font-size: 16.5px; color: var(--text-primary); margin-bottom: 14px; }
.rf-rules-head svg { width: 19px; height: 19px; color: var(--warning); }
.rf-rules-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.rf-rules-list li { display: flex; gap: 12px; align-items: flex-start; font-size: 14.5px; line-height: 1.5; color: var(--text-secondary); }
.rf-rules-list strong { color: var(--text-primary); font-weight: 700; }
.rf-dot { flex-shrink: 0; width: 10px; height: 10px; border-radius: 50%; margin-top: 6px; }
.rf-dot-green { background: #16b364; } .rf-dot-blue { background: var(--accent2); } .rf-dot-purple { background: #8b5cf6; }

.rf-empty { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 44px 26px; border-radius: 22px; background: var(--bg-surface); border: 1px solid var(--border); margin-top: 6px; }
.rf-empty-ic { display: inline-flex; align-items: center; justify-content: center; width: 76px; height: 76px; border-radius: 22px; background: #16b364; color: #fff; margin-bottom: 18px; box-shadow: 0 10px 28px rgba(22,179,100,.4); }
.rf-empty-ic svg { width: 36px; height: 36px; }
.rf-empty h2 { font-family: var(--font-display); font-size: 16px; font-weight: 700; letter-spacing: 1px; color: var(--text-primary); margin-bottom: 9px; }
.rf-empty p { font-size: 14px; color: var(--text-muted); line-height: 1.55; max-width: 400px; }

.rf-reward-list { display: flex; flex-direction: column; gap: 12px; padding-bottom: 30px; }
.rf-reward { display: flex; align-items: center; gap: 13px; padding: 15px 16px; border-radius: 16px; background: var(--bg-surface); border: 1px solid var(--border); }
.rf-reward-ic { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 13px; background: var(--accent-soft); color: var(--accent); flex-shrink: 0; }
.rf-reward-ic svg { width: 21px; height: 21px; }
.rf-reward-main { flex: 1; min-width: 0; }
.rf-reward-title { font-size: 15px; font-weight: 600; color: var(--text-primary); }
.rf-reward-sub { font-size: 12.5px; color: var(--text-muted); margin-top: 2px; }
.rf-reward-days { flex-shrink: 0; font-family: var(--font-display); font-weight: 800; font-size: 16px; color: #16b364; }

/* Basit toast */
.toast { position: fixed; bottom: 28px; left: 50%; transform: translateX(-50%) translateY(20px); background: var(--accent-dim); color: #07221b; padding: 11px 20px; border-radius: 11px; font-weight: 600; font-size: 14px; box-shadow: 0 12px 32px rgba(0,0,0,.4); opacity: 0; pointer-events: none; transition: .25s ease; z-index: 500; max-width: 90%; }
.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

@media (max-width: 480px) { .rf-code { font-size: 24px; letter-spacing: 2px; } .rf-code-actions { grid-template-columns: 1fr; } }

/* ============================================================
   AI Asistan paneli (AI Tablo — Çekirdek 5): .aia-*
   ============================================================ */
.aia-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,.38); z-index: 640; }
.aia-panel { position: fixed; top: 0; right: 0; height: 100vh; width: 380px; max-width: 92vw;
    background: var(--bg-surface); border-left: 1px solid var(--border); z-index: 650;
    display: flex; flex-direction: column; transform: translateX(105%); transition: transform .22s ease;
    box-shadow: -14px 0 40px rgba(0,0,0,.35); }
.aia-panel.open { transform: translateX(0); }
.aia-head { display: flex; align-items: center; justify-content: space-between; padding: 15px 16px; border-bottom: 1px solid var(--border); flex-shrink: 0; }
.aia-title { display: inline-flex; align-items: center; gap: 9px; font-family: var(--font-display); font-weight: 800; font-size: 16px; color: var(--text-primary); }
.aia-title svg { width: 19px; height: 19px; color: var(--accent2); }
.aia-body { padding: 16px; overflow-y: auto; display: flex; flex-direction: column; gap: 10px; }
.aia-lbl { font-size: 13px; font-weight: 600; color: var(--text-secondary); }
.aia-panel textarea, .aia-input { width: 100%; background: var(--bg-elevated); border: 1px solid var(--border-strong); border-radius: 12px; padding: 11px 13px; color: var(--text-primary); font-size: 14px; font-family: inherit; resize: vertical; outline: none; }
.aia-panel textarea:focus, .aia-input:focus { border-color: var(--accent); }
.aia-run { width: 100%; justify-content: center; }
.aia-sec { margin-top: 8px; font-size: 12px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: var(--text-muted); display: flex; align-items: center; justify-content: space-between; }
/* Katlanır bölümler (akordeon) */
.aia-sec { cursor: pointer; user-select: none; padding: 9px 2px; border-top: 1px solid var(--border); transition: color .14s; }
.aia-sec:hover { color: var(--text-secondary); }
.aia-sec::after { content: "\25B8"; margin-left: 8px; font-size: 11px; line-height: 1; transition: transform .18s; flex: 0 0 auto; }
.aia-sec.aia-open::after { transform: rotate(90deg); }
.aia-hist-head .aia-mini { margin-left: auto; }
.aia-hidden { display: none !important; }
.aia-quick { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.aia-quick button { display: inline-flex; align-items: center; gap: 8px; padding: 11px 12px; border-radius: 11px; background: var(--bg-elevated); border: 1px solid var(--border); color: var(--text-primary); font-size: 13px; font-weight: 600; cursor: pointer; transition: .14s; }
.aia-quick button:hover { border-color: var(--accent2); color: var(--accent2); }
.aia-quick button svg { width: 16px; height: 16px; }
.aia-result { background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; font-size: 13.5px; color: var(--text-secondary); display: flex; flex-direction: column; gap: 10px; }
.aia-ok { display: flex; align-items: center; gap: 8px; color: #16b364; font-weight: 600; }
.aia-ok svg, .aia-err svg { width: 17px; height: 17px; flex-shrink: 0; }
.aia-err { display: flex; align-items: center; gap: 8px; color: var(--danger); font-weight: 600; }
.aia-badge { background: var(--accent-soft, rgba(20,184,166,.14)); color: var(--accent); border-radius: 999px; padding: 1px 9px; font-size: 12px; font-weight: 700; }
.aia-subtitle { color: var(--text-secondary); font-size: 13px; }
.aia-issue { display: flex; align-items: flex-start; gap: 9px; padding: 8px 0; border-bottom: 1px solid var(--border); font-size: 13.5px; color: var(--text-primary); cursor: pointer; }
.aia-issue input { margin-top: 2px; accent-color: var(--accent); }
.aia-issue small { display: block; color: var(--text-muted); font-size: 12px; margin-top: 2px; }
.aia-spin { display: inline-block; width: 14px; height: 14px; border: 2px solid var(--border-strong); border-top-color: var(--accent); border-radius: 50%; animation: aia-rot .7s linear infinite; vertical-align: -2px; margin-right: 6px; }
@keyframes aia-rot { to { transform: rotate(360deg); } }
.aia-hist-head { margin-top: 10px; }
.aia-mini { background: none; border: 0; color: var(--text-muted); cursor: pointer; display: inline-flex; padding: 2px; }
.aia-mini:hover { color: var(--accent); }
.aia-mini svg { width: 15px; height: 15px; }
.aia-hist { display: flex; flex-direction: column; gap: 6px; }
.aia-empty { color: var(--text-muted); font-size: 13px; padding: 6px 0; }
.aia-hist-row { display: flex; align-items: center; gap: 10px; padding: 9px 11px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-elevated); }
.aia-hist-row.undone { opacity: .55; }
.aia-hist-main { flex: 1; min-width: 0; }
.aia-hist-sum { font-size: 13px; color: var(--text-primary); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.aia-hist-meta { font-size: 11.5px; color: var(--text-muted); margin-top: 2px; }
.aia-undo { flex-shrink: 0; width: 30px; height: 30px; border-radius: 8px; border: 1px solid var(--border); background: var(--bg-surface); color: var(--text-muted); display: grid; place-items: center; cursor: pointer; }
.aia-undo:hover { color: var(--accent2); border-color: var(--accent2); }
.aia-undo svg { width: 15px; height: 15px; }
@media (max-width: 480px) { .aia-quick { grid-template-columns: 1fr; } }

/* ---- AI Rapor (panel içi) ---- */
.aia-report { background: var(--bg-surface); border: 1px solid var(--border); border-radius: 10px; padding: 12px; }
.aia-rep-title { font-family: var(--font-display); font-weight: 800; font-size: 15px; color: var(--text-primary); }
.aia-rep-sub { font-size: 12px; color: var(--text-muted); margin-top: 2px; margin-bottom: 8px; }
.aia-rep-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-bottom: 10px; }
.aia-rep-metric { display: flex; flex-direction: column; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 9px; padding: 8px 10px; }
.aia-rep-metric span { font-size: 11px; color: var(--text-muted); }
.aia-rep-metric b { font-size: 15px; color: var(--accent-bright); }
.aia-rep-narr { font-size: 13px; line-height: 1.5; color: var(--text-secondary); margin-bottom: 8px; }
.aia-rep-h { font-size: 12px; font-weight: 700; color: var(--accent2); margin: 6px 0 4px; }
.aia-rep-find { margin: 0; padding-left: 18px; font-size: 12.5px; color: var(--text-secondary); line-height: 1.5; }

/* ---- AI Dashboard modalı ---- */
.dash-modal { width: min(920px, 96vw); max-height: 92vh; display: flex; flex-direction: column; }
.dash-body { overflow-y: auto; padding: 18px; display: flex; flex-direction: column; gap: 16px; }
.dash-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; }
.dash-kpi { background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 14px; padding: 16px; text-align: center; }
.dash-kpi-v { font-family: var(--font-display); font-weight: 800; font-size: 24px; color: var(--accent-bright); }
.dash-kpi-l { font-size: 12.5px; color: var(--text-muted); margin-top: 4px; }
.dash-chart { background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 14px; padding: 14px; }
.dash-chart-t { font-weight: 700; font-size: 14px; color: var(--text-primary); margin-bottom: 10px; }
.dash-chart canvas { max-height: 300px; }
.dash-ins-h { font-weight: 700; color: var(--accent2); font-size: 14px; }
.dash-ins { margin: 0; padding-left: 18px; color: var(--text-secondary); font-size: 13.5px; line-height: 1.6; }

/* ---- AI Agent (çok-adımlı) ---- */
.aia-cmd-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.aia-cmd-actions .btn { padding: 9px 12px; font-size: 13px; }
.aia-cmd-actions .aia-run { flex: 1 1 120px; justify-content: center; }
.aia-agent-btn { flex: 1 1 auto; justify-content: center; background: var(--bg-elevated); border: 1px solid var(--accent2); color: var(--accent2); font-weight: 700; }
.aia-agent-btn:hover { background: var(--accent2); color: #fff; }
/* Komut kutusu daha rahat yazılsın */
#aiaCmd { min-height: 92px; line-height: 1.45; }
.aia-steps { display: flex; flex-direction: column; gap: 8px; margin-top: 4px; }
.aia-step { display: flex; gap: 10px; align-items: flex-start; padding: 9px 11px; border: 1px solid var(--border); border-left-width: 3px; border-radius: 10px; background: var(--bg-surface); }
.aia-step svg { width: 17px; height: 17px; flex-shrink: 0; margin-top: 1px; }
.aia-step.ok { border-left-color: #16b364; } .aia-step.ok svg { color: #16b364; }
.aia-step.skip { border-left-color: var(--text-muted); } .aia-step.skip svg { color: var(--text-muted); }
.aia-step.error { border-left-color: var(--danger); } .aia-step.error svg { color: var(--danger); }
.aia-step-main { min-width: 0; }
.aia-step-t { font-size: 13px; font-weight: 600; color: var(--text-primary); }
.aia-step-s { font-size: 12px; color: var(--text-muted); margin-top: 2px; line-height: 1.45; }

/* ---- AI Otomasyon (zamanlanmış) ---- */
.aia-auto-form { display: flex; flex-direction: column; gap: 8px; margin-bottom: 10px; padding: 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-elevated); }
.aia-auto-form select, .aia-auto-form input { width: 100%; }
.aia-auto-row { display: flex; gap: 8px; }
.aia-auto-row > * { flex: 1; }
.aia-auto-list { display: flex; flex-direction: column; gap: 6px; }
.aia-auto { display: flex; align-items: flex-start; gap: 8px; padding: 9px 11px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-elevated); }
.aia-auto.off { opacity: .6; }
.aia-auto-main { flex: 1; min-width: 0; }
.aia-auto-name { font-size: 13px; font-weight: 700; color: var(--text-primary); }
.aia-auto-meta { font-size: 11.5px; color: var(--text-muted); margin-top: 2px; }
.aia-auto-last { font-size: 11.5px; color: var(--text-secondary); margin-top: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.aia-auto-acts { display: flex; gap: 4px; flex-shrink: 0; }
.aia-auto-acts .aia-undo { width: 28px; height: 28px; }

/* ---- AI Asistan sesle yaz (mikrofon) ---- */
.aia-mic-btn { flex-shrink: 0; width: 44px; border: 1px solid var(--border-strong); border-radius: 11px; background: var(--bg-elevated); color: var(--text-secondary); display: grid; place-items: center; cursor: pointer; transition: .14s; }
.aia-mic-btn:hover { border-color: var(--accent); color: var(--accent); }
.aia-mic-btn svg { width: 18px; height: 18px; }
.aia-mic-btn.rec { background: var(--danger); color: #fff; border-color: var(--danger); animation: aia-pulse 1.2s ease-in-out infinite; }
@keyframes aia-pulse { 0%,100% { box-shadow: 0 0 0 0 rgba(240,85,109,.5); } 50% { box-shadow: 0 0 0 6px rgba(240,85,109,0); } }

/* ===== AI Asistan — Grup A: Öneriler / Çalışanlar / Radar / Formül ===== */
/* Proaktif öneriler */
.aia-suggest { display: flex; flex-direction: column; gap: 6px; }
.aia-sugg { display: flex; align-items: center; gap: 8px; text-align: left; width: 100%; padding: 9px 11px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-elevated); color: var(--text-primary); font-size: 13px; font-weight: 600; cursor: pointer; transition: .14s; }
.aia-sugg:hover { border-color: var(--accent); background: var(--bg-surface); }
.aia-sugg-i { font-size: 15px; line-height: 1; flex-shrink: 0; }

/* AI Çalışanlar (persona) */
.aia-personas { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.aia-persona { display: flex; align-items: center; gap: 8px; padding: 10px 11px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-elevated); color: var(--text-primary); cursor: pointer; transition: .14s; text-align: left; }
.aia-persona:hover { border-color: var(--accent); background: var(--bg-surface); transform: translateY(-1px); }
.aia-persona-i { font-size: 20px; line-height: 1; flex-shrink: 0; }
.aia-persona-n { font-size: 12.5px; font-weight: 700; line-height: 1.25; }
@media (max-width: 480px) { .aia-personas { grid-template-columns: 1fr; } }

/* Şüpheli veri radarı */
.aia-anoms { display: flex; flex-direction: column; gap: 6px; margin-top: 4px; }
.aia-anom { display: block; width: 100%; text-align: left; padding: 9px 11px; border: 1px solid var(--border); border-left-width: 3px; border-radius: 10px; background: var(--bg-surface); cursor: pointer; transition: .14s; }
.aia-anom:hover { background: var(--bg-elevated); }
.aia-anom.high { border-left-color: var(--danger); }
.aia-anom.medium { border-left-color: #f5a623; }
.aia-anom-h { font-size: 12.5px; color: var(--text-primary); }
.aia-anom-h b { color: var(--accent-bright); }
.aia-anom-v { color: var(--text-secondary); font-weight: 600; }
.aia-anom-r { font-size: 11.5px; color: var(--text-muted); margin-top: 3px; line-height: 1.45; }

/* Formül açıkla / basitleştir */
.aia-fx { background: var(--bg-surface); border: 1px solid var(--border); border-radius: 10px; padding: 12px; display: flex; flex-direction: column; gap: 8px; }
.aia-fx code { display: block; font-family: var(--font-mono, monospace); font-size: 12.5px; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 8px; padding: 7px 9px; color: var(--accent-bright); overflow-x: auto; white-space: pre-wrap; word-break: break-word; }
.aia-fx-e { font-size: 13px; line-height: 1.55; color: var(--text-secondary); }
.aia-fx-simp { border-top: 1px dashed var(--border); padding-top: 8px; display: flex; flex-direction: column; gap: 6px; }
.aia-fx-simp-h { font-size: 12px; font-weight: 700; color: var(--text-primary); }
.aia-fx-note { font-size: 11.5px; color: var(--text-muted); line-height: 1.45; }

/* ===== AI Asistan — Grup B: Plan / Simülasyon / Amaç / Veri Soyu / Kural ===== */
.aia-hint { font-size: 11.5px; color: var(--text-muted); margin: -2px 0 4px; line-height: 1.4; }

/* Plan önizleme */
.aia-plan, .aia-sim, .aia-lin { background: var(--bg-surface); border: 1px solid var(--border); border-radius: 10px; padding: 12px; }
.aia-plan-h { font-weight: 700; font-size: 13.5px; color: var(--text-primary); display: flex; align-items: center; gap: 6px; margin-bottom: 8px; }
.aia-plan-h svg { width: 16px; height: 16px; color: var(--accent); }
.aia-plan-ops { display: flex; flex-direction: column; gap: 5px; max-height: 240px; overflow-y: auto; }
.aia-plan-op { display: flex; align-items: center; gap: 7px; font-size: 12.5px; padding: 5px 7px; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 8px; }
.aia-plan-op b { color: var(--accent-bright); flex-shrink: 0; }
.aia-plan-op svg { width: 13px; height: 13px; color: var(--text-muted); flex-shrink: 0; }
.aia-plan-old { color: var(--text-muted); text-decoration: line-through; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 40%; }
.aia-plan-new { color: #16b364; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.aia-plan-acts { display: flex; gap: 8px; margin-top: 10px; }

/* Simülasyon tablosu */
.aia-sim-t { width: 100%; border-collapse: collapse; font-size: 12.5px; margin-top: 4px; }
.aia-sim-t th { text-align: left; color: var(--text-muted); font-weight: 600; padding: 5px 6px; border-bottom: 1px solid var(--border); font-size: 11.5px; }
.aia-sim-t td { padding: 6px; border-bottom: 1px solid var(--border); color: var(--text-primary); }
.aia-sim-t td.up { color: #16b364; font-weight: 600; }
.aia-sim-t td.down { color: var(--danger); font-weight: 600; }

/* Veri soyu ağacı */
.aia-lin-tree { margin-top: 6px; }
.aia-lin-node { margin-top: 4px; }
.aia-lin-cell { display: block; width: 100%; text-align: left; padding: 6px 8px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-elevated); cursor: pointer; }
.aia-lin-cell:hover { border-color: var(--accent); }
.aia-lin-cell b { color: var(--accent-bright); margin-right: 6px; }
.aia-lin-cell code { font-family: var(--font-mono, monospace); font-size: 11.5px; color: var(--text-secondary); margin-right: 6px; }
.aia-lin-cell .aia-lin-v { font-size: 12px; color: var(--text-primary); font-weight: 600; }
.aia-lin-cell small { display: block; color: var(--text-muted); font-size: 10.5px; margin-top: 2px; }
.aia-lin-kids { margin-left: 14px; padding-left: 8px; border-left: 2px solid var(--border); }

/* ===== AI Asistan — Grup C: Veri Formu / Mini Uygulama ===== */
/* Veri giriş formu */
.dataform-body { display: flex; flex-direction: column; gap: 12px; padding: 4px 2px; max-height: 60vh; overflow-y: auto; }
.df-field { display: flex; flex-direction: column; gap: 5px; }
.df-lbl { font-size: 12.5px; font-weight: 600; color: var(--text-secondary); }
.df-input { width: 100%; padding: 9px 11px; border: 1px solid var(--border-strong); border-radius: 10px; background: var(--bg-elevated); color: var(--text-primary); font-size: 14px; }
.df-input:focus { outline: none; border-color: var(--accent); }
.dataform-foot { display: flex; justify-content: flex-end; gap: 8px; margin-top: 14px; }

/* Mini uygulama (ortalanmış popup — Analiz Et gibi) */
.miniapp-overlay { position: fixed; inset: 0; z-index: 4000; background: rgba(0,0,0,.55); display: flex; align-items: center; justify-content: center; padding: 16px; }
.miniapp-overlay[hidden] { display: none !important; }
.miniapp-modal { width: min(480px, 94vw); max-height: 88vh; display: flex; flex-direction: column; background: var(--bg-base, var(--bg-surface)); border: 1px solid var(--border); border-radius: 18px; overflow: hidden; box-shadow: 0 24px 70px rgba(0,0,0,.45); }
.miniapp-head { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--border); background: var(--bg-elevated); }
.miniapp-title { font-family: var(--font-display); font-weight: 800; font-size: 17px; color: var(--text-primary); flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.miniapp-head .icon-mini { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; border: 1px solid var(--border); background: var(--bg-surface); color: var(--text-secondary); cursor: pointer; }
.miniapp-head .icon-mini:hover { color: var(--accent); border-color: var(--accent); }
.miniapp-search { display: flex; align-items: center; gap: 8px; margin: 12px 16px 0; padding: 10px 12px; border: 1px solid var(--border-strong); border-radius: 12px; background: var(--bg-elevated); }
.miniapp-search svg { width: 18px; height: 18px; color: var(--text-muted); }
.miniapp-search input { flex: 1; border: 0; background: none; color: var(--text-primary); font-size: 15px; outline: none; }
.miniapp-stats { display: flex; gap: 10px; padding: 12px 16px 0; }
.miniapp-stat { flex: 1; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 12px; padding: 12px; text-align: center; }
.miniapp-stat b { display: block; font-family: var(--font-display); font-weight: 800; font-size: 20px; color: var(--accent-bright); }
.miniapp-stat span { font-size: 11.5px; color: var(--text-muted); }
.miniapp-list { flex: 1; overflow-y: auto; padding: 12px 16px 24px; display: flex; flex-direction: column; gap: 8px; }
.miniapp-card { text-align: left; width: 100%; padding: 13px 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-elevated); cursor: pointer; transition: .14s; }
.miniapp-card:hover { border-color: var(--accent); transform: translateY(-1px); }
.miniapp-card-t { font-size: 15px; font-weight: 700; color: var(--text-primary); }
.miniapp-card-subs { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 5px; }
.miniapp-card-f { font-size: 12px; color: var(--text-secondary); }
.miniapp-card-f i { color: var(--text-muted); font-style: normal; }
.miniapp-detail { flex: 1; overflow-y: auto; padding: 14px 16px 24px; }
.miniapp-detail-back { display: inline-flex; align-items: center; gap: 6px; background: none; border: 0; color: var(--accent); font-size: 14px; font-weight: 600; cursor: pointer; margin-bottom: 12px; }
.miniapp-detail-back svg { width: 16px; height: 16px; }
.miniapp-detail-card { background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 14px; overflow: hidden; }
.miniapp-detail-row { display: flex; justify-content: space-between; gap: 12px; padding: 12px 14px; border-bottom: 1px solid var(--border); }
.miniapp-detail-row:last-child { border-bottom: 0; }
.miniapp-detail-l { font-size: 12.5px; color: var(--text-muted); }
.miniapp-detail-v { font-size: 14px; color: var(--text-primary); font-weight: 600; text-align: right; word-break: break-word; }
.miniapp-detail { max-height: 60vh; }