/* ==========================================================================
   Altın Emlak Ofis — tasarım sistemi
   Kömür siyahı + altın sarısı; logodaki dalga motifi imza öğesidir.
   ========================================================================== */

:root {
  --altin: #F4BE49;
  --altin-koyu: #C99B32;
  --altin-derin: #8F6A17;
  --altin-acik: #FBE6B0;
  --altin-sis: #FDF6E5;
  --komur: #1D1D1B;
  --komur-2: #262624;
  --komur-3: #33332F;
  --komur-4: #46463F;

  --zemin: #F5F3EE;
  --yuzey: #FFFFFF;
  --yuzey-2: #FAF8F4;
  --yuzey-3: #F1EEE7;
  --cizgi: #E8E3D9;
  --cizgi-2: #D8D1C3;
  --metin: #1D1D1B;
  --metin-2: #56575C;
  --metin-3: #8B8C91;
  --metin-ters: #FFFFFF;

  --satilik: #B4521F;
  --satilik-bg: #FBEDE5;
  --kiralik: #1F6B5B;
  --kiralik-bg: #E3F1ED;
  --basari: #2D7A4D;
  --basari-bg: #E5F3EA;
  --uyari: #B86E00;
  --uyari-bg: #FDF1DC;
  --tehlike: #BF3B2A;
  --tehlike-bg: #FBE8E5;
  --bilgi: #2F5D9E;
  --bilgi-bg: #E7EEF8;

  --yan-zemin: #1D1D1B;
  --grafik-1: #B07F12;
  --grafik-2: #008A6C;
  --yan-metin: #C9C6BD;
  --yan-cizgi: rgba(255,255,255,.07);

  --r-xs: 6px;
  --r-sm: 9px;
  --r: 13px;
  --r-lg: 18px;
  --r-xl: 24px;
  --golge-sm: 0 1px 2px rgba(29,29,27,.06), 0 1px 1px rgba(29,29,27,.03);
  --golge: 0 1px 2px rgba(29,29,27,.05), 0 6px 18px rgba(29,29,27,.06);
  --golge-lg: 0 10px 30px rgba(29,29,27,.12), 0 30px 70px rgba(29,29,27,.14);
  --odak: 0 0 0 3px rgba(244,190,73,.45);
  --gecis: .18s cubic-bezier(.4,0,.2,1);
  --font: 'Manrope', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --yan-gen: 256px;
  --ust-yuk: 64px;
  --alt-yuk: 64px;
  color-scheme: light;
}

:root[data-tema="koyu"] {
  --zemin: #141413;
  --yuzey: #1E1E1C;
  --yuzey-2: #232321;
  --yuzey-3: #2A2A27;
  --cizgi: #34342F;
  --cizgi-2: #45453F;
  --metin: #F1EEE6;
  --metin-2: #B9B6AD;
  --metin-3: #85837B;
  --altin-sis: #2B261A;
  --altin-acik: #4A3D1C;
  --altin-derin: #F4BE49;
  --satilik: #E9875A; --satilik-bg: #3A2419;
  --kiralik: #5CC2A7; --kiralik-bg: #16302A;
  --basari: #5BC586; --basari-bg: #17301F;
  --uyari: #F0B04A; --uyari-bg: #352A14;
  --tehlike: #F07562; --tehlike-bg: #3A1D18;
  --bilgi: #7FA8E8; --bilgi-bg: #1B2638;
  --yan-zemin: #10100F;
  --grafik-1: #B98424;
  --grafik-2: #2E9E83;
  --golge-sm: 0 1px 2px rgba(0,0,0,.4);
  --golge: 0 1px 2px rgba(0,0,0,.35), 0 8px 24px rgba(0,0,0,.3);
  --golge-lg: 0 10px 40px rgba(0,0,0,.55);
  color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
  :root[data-tema="sistem"] {
    --zemin: #141413;
    --yuzey: #1E1E1C;
    --yuzey-2: #232321;
    --yuzey-3: #2A2A27;
    --cizgi: #34342F;
    --cizgi-2: #45453F;
    --metin: #F1EEE6;
    --metin-2: #B9B6AD;
    --metin-3: #85837B;
    --altin-sis: #2B261A;
    --altin-acik: #4A3D1C;
    --altin-derin: #F4BE49;
    --satilik: #E9875A; --satilik-bg: #3A2419;
    --kiralik: #5CC2A7; --kiralik-bg: #16302A;
    --basari: #5BC586; --basari-bg: #17301F;
    --uyari: #F0B04A; --uyari-bg: #352A14;
    --tehlike: #F07562; --tehlike-bg: #3A1D18;
    --bilgi: #7FA8E8; --bilgi-bg: #1B2638;
    --yan-zemin: #10100F;
  --grafik-1: #B98424;
  --grafik-2: #2E9E83;
    --golge-sm: 0 1px 2px rgba(0,0,0,.4);
    --golge: 0 1px 2px rgba(0,0,0,.35), 0 8px 24px rgba(0,0,0,.3);
    --golge-lg: 0 10px 40px rgba(0,0,0,.55);
    color-scheme: dark;
  }
}

/* ---------- Temel ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--font);
  font-size: 14.5px;
  line-height: 1.5;
  color: var(--metin);
  background: var(--zemin);
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "tnum" 1, "cv11" 1;
  overflow-x: hidden;
}
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: 0; padding: 0; }
h1, h2, h3, h4 { margin: 0; line-height: 1.2; letter-spacing: -.015em; font-weight: 800; }
p { margin: 0; }
hr { border: 0; border-top: 1px solid var(--cizgi); margin: 18px 0; }
::selection { background: var(--altin-acik); color: var(--komur); }
:focus-visible { outline: none; box-shadow: var(--odak); border-radius: var(--r-xs); }
.gizli { display: none !important; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ikon { width: 18px; height: 18px; flex: none; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ikon.k { width: 15px; height: 15px; }
.ikon.b { width: 22px; height: 22px; }

/* ---------- Açılış ---------- */
.acilis { min-height: 100dvh; display: grid; place-items: center; align-content: center; gap: 22px; background: var(--komur); }
.acilis img { width: 64px; height: 64px; animation: nefes 1.6s ease-in-out infinite; }
.acilis-cizgi { width: 120px; height: 3px; border-radius: 3px; background: linear-gradient(90deg, transparent, var(--altin), transparent); background-size: 200% 100%; animation: kayma 1.2s linear infinite; }
@keyframes nefes { 50% { transform: scale(.92); opacity: .8; } }
@keyframes kayma { from { background-position: 200% 0; } to { background-position: -200% 0; } }

/* ---------- Kabuk ---------- */
.kabuk { display: grid; grid-template-columns: var(--yan-gen) minmax(0, 1fr); min-height: 100dvh; }
.yan {
  position: sticky; top: 0; height: 100dvh; overflow-y: auto; overscroll-behavior: contain;
  background: var(--yan-zemin); color: var(--yan-metin);
  display: flex; flex-direction: column;
  scrollbar-width: thin; scrollbar-color: #3a3a35 transparent;
}
.yan::after { /* dalga motifi */
  content: ""; position: sticky; bottom: 0; display: block; min-height: 120px; margin-top: auto; pointer-events: none;
  background: url("../img/dalga.svg") bottom center / 100% auto no-repeat; opacity: .16;
}
.yan-logo { display: flex; align-items: center; padding: 22px 20px 18px; }
.yan-logo img { height: 34px; width: auto; }
.yan-grup { padding: 6px 12px; }
.yan-grup-baslik { font-size: 10.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #77756D; padding: 12px 10px 6px; }
.yan-link {
  display: flex; align-items: center; gap: 11px; padding: 8.5px 10px; border-radius: var(--r-sm);
  font-weight: 600; font-size: 13.8px; color: var(--yan-metin); position: relative; transition: background var(--gecis), color var(--gecis);
}
.yan-link .ikon { opacity: .75; }
.yan-link:hover { background: rgba(255,255,255,.05); color: #fff; }
.yan-link.aktif { background: linear-gradient(90deg, rgba(244,190,73,.16), rgba(244,190,73,.04)); color: #fff; }
.yan-link.aktif .ikon { color: var(--altin); opacity: 1; }
.yan-link.aktif::before { content: ""; position: absolute; left: -12px; top: 8px; bottom: 8px; width: 3px; border-radius: 0 3px 3px 0; background: var(--altin); }
.yan-rozet { margin-left: auto; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; background: var(--altin); color: var(--komur); font-size: 11px; font-weight: 800; display: grid; place-items: center; }
.yan-kullanici { margin: 10px 12px 12px; padding: 10px; border-radius: var(--r); background: rgba(255,255,255,.04); display: flex; align-items: center; gap: 10px; position: relative; z-index: 1; }
.yan-kullanici-ad { font-weight: 700; color: #fff; font-size: 13.5px; line-height: 1.2; }
.yan-kullanici-rol { font-size: 11.5px; color: #8D8A80; }
.yan-kullanici .btn-ikon { margin-left: auto; color: #8D8A80; }
.yan-kullanici .btn-ikon:hover { color: #fff; background: rgba(255,255,255,.08); }

.ana { min-width: 0; display: flex; flex-direction: column; }
.ust {
  position: sticky; top: 0; z-index: 30; height: var(--ust-yuk);
  display: flex; align-items: center; gap: 12px; padding: 0 28px;
  background: color-mix(in srgb, var(--zemin) 86%, transparent);
  backdrop-filter: saturate(1.4) blur(12px); -webkit-backdrop-filter: saturate(1.4) blur(12px);
  border-bottom: 1px solid transparent; transition: border-color var(--gecis);
}
.ust.golgeli { border-bottom-color: var(--cizgi); }
.ust-baslik { font-size: 17px; font-weight: 800; letter-spacing: -.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ust .ust-menu-btn { display: none; }
.ust-amblem { display: none; width: 30px; height: 30px; }
.ust-ara {
  margin-left: auto; display: flex; align-items: center; gap: 8px; height: 38px; padding: 0 12px; min-width: 260px;
  border: 1px solid var(--cizgi); border-radius: 10px; background: var(--yuzey); color: var(--metin-3); font-size: 13.5px;
  transition: border-color var(--gecis), box-shadow var(--gecis);
}
.ust-ara:hover { border-color: var(--cizgi-2); }
.ust-ara kbd { margin-left: auto; font: 600 11px var(--font); padding: 2px 6px; border-radius: 5px; background: var(--yuzey-3); color: var(--metin-3); }
.ust-eylemler { display: flex; align-items: center; gap: 6px; }
.zil { position: relative; }
.zil-sayi { position: absolute; top: 3px; right: 3px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 9px; background: var(--tehlike); color: #fff; font-size: 10px; font-weight: 800; display: grid; place-items: center; border: 2px solid var(--zemin); }
.icerik { padding: 8px 28px 48px; width: 100%; max-width: 1480px; margin: 0 auto; animation: belir .28s ease both; }
@keyframes belir { from { opacity: 0; transform: translateY(6px); } }

.alt-menu, .fab { display: none; }
.perde { position: fixed; inset: 0; background: rgba(15,15,14,.5); z-index: 60; opacity: 0; pointer-events: none; transition: opacity var(--gecis); }
.perde.acik { opacity: 1; pointer-events: auto; }

/* ---------- Sayfa başlığı ---------- */
.sayfa-ust { display: flex; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin: 14px 0 20px; }
.sayfa-ust h1 { font-size: 26px; }
.sayfa-ust .alt { color: var(--metin-2); margin-top: 4px; font-size: 14px; }
.sayfa-ust .eylemler { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; }
.geri { display: inline-flex; align-items: center; gap: 4px; color: var(--metin-3); font-weight: 600; font-size: 13px; margin-bottom: 6px; }
.geri:hover { color: var(--metin); }

/* ---------- Düğmeler ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 0 16px;
  border-radius: 10px; font-weight: 700; font-size: 13.8px; white-space: nowrap; user-select: none;
  background: var(--yuzey); color: var(--metin); border: 1px solid var(--cizgi);
  transition: background var(--gecis), border-color var(--gecis), transform .08s, box-shadow var(--gecis);
}
.btn:hover { border-color: var(--cizgi-2); background: var(--yuzey-2); }
.btn:active { transform: translateY(1px); }
.btn[disabled], .btn.yukleniyor { opacity: .55; pointer-events: none; }
.btn-altin { background: var(--altin); border-color: var(--altin); color: #1D1D1B; box-shadow: 0 1px 0 rgba(255,255,255,.4) inset, 0 2px 6px rgba(201,155,50,.25); }
.btn-altin:hover { background: #F7C95E; border-color: #F7C95E; }
.btn-koyu { background: var(--komur); border-color: var(--komur); color: #fff; }
.btn-koyu:hover { background: var(--komur-3); border-color: var(--komur-3); }
:root[data-tema="koyu"] .btn-koyu { background: var(--yuzey-3); border-color: var(--cizgi-2); }
.btn-hayalet { background: transparent; border-color: transparent; color: var(--metin-2); }
.btn-hayalet:hover { background: var(--yuzey-3); border-color: transparent; color: var(--metin); }
.btn-tehlike { color: var(--tehlike); }
.btn-tehlike:hover { background: var(--tehlike-bg); border-color: transparent; }
.btn-tehlike-dolu, .btn-tehlike-dolu:hover { background: var(--tehlike); border-color: var(--tehlike); color: #fff; }
.btn-k { height: 32px; padding: 0 11px; font-size: 12.8px; border-radius: 8px; gap: 6px; }
.btn-b { height: 48px; padding: 0 22px; font-size: 15px; border-radius: 12px; }
.btn-tam { width: 100%; }
.btn-ikon { width: 38px; height: 38px; padding: 0; border-radius: 10px; display: inline-grid; place-items: center; color: var(--metin-2); transition: background var(--gecis), color var(--gecis); flex: none; }
.btn-ikon:hover { background: var(--yuzey-3); color: var(--metin); }
.btn-ikon.k { width: 30px; height: 30px; border-radius: 8px; }
.btn-grup { display: inline-flex; border: 1px solid var(--cizgi); border-radius: 10px; padding: 3px; background: var(--yuzey); gap: 2px; max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.btn-grup::-webkit-scrollbar { display: none; }
.btn-grup button { flex: none; }
.btn-grup button { height: 32px; padding: 0 12px; border-radius: 7px; font-weight: 700; font-size: 13px; color: var(--metin-2); display: inline-flex; align-items: center; gap: 6px; }
.btn-grup button.aktif { background: var(--komur); color: #fff; }
:root[data-tema="koyu"] .btn-grup button.aktif { background: var(--altin); color: #1D1D1B; }
.yukleniyor-cark { width: 16px; height: 16px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: don .7s linear infinite; }
@keyframes don { to { transform: rotate(360deg); } }

/* ---------- Kartlar ---------- */
.kart { background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--r-lg); box-shadow: var(--golge-sm); }
.kart-ic { padding: 20px; }
.kart-ust { display: flex; align-items: center; gap: 10px; padding: 16px 20px 0; }
.kart-ust h2, .kart-ust h3 { font-size: 15px; font-weight: 800; }
.kart-ust .eylem { margin-left: auto; font-size: 13px; font-weight: 700; color: var(--altin-derin); display: inline-flex; align-items: center; gap: 4px; }
.kart-ust .eylem:hover { text-decoration: underline; }
.kart-alt { padding: 12px 20px; border-top: 1px solid var(--cizgi); }
.izgara { display: grid; gap: 18px; }
.izgara-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.izgara-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.izgara-ana { grid-template-columns: minmax(0, 1.65fr) minmax(320px, 1fr); align-items: start; }
.yigin { display: flex; flex-direction: column; gap: 18px; }
.satir { display: flex; align-items: center; gap: 10px; }
.satir.ara { justify-content: space-between; }
.satir.sar { flex-wrap: wrap; }
.soluk { color: var(--metin-3); }
.ikincil { color: var(--metin-2); }
.kucuk { font-size: 12.5px; }
.kalin { font-weight: 700; }
.sag { margin-left: auto; }
.tasma { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }

/* ---------- KPI ---------- */
.kpi-izgara { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; }
.kpi { padding: 16px 18px; display: flex; flex-direction: column; gap: 6px; position: relative; overflow: hidden; transition: transform var(--gecis), box-shadow var(--gecis); }
a.kpi:hover { transform: translateY(-2px); box-shadow: var(--golge); }
.kpi-etiket { font-size: 12.5px; color: var(--metin-2); font-weight: 600; display: flex; align-items: center; gap: 7px; }
.kpi-etiket .ikon { color: var(--altin-koyu); width: 16px; height: 16px; }
.kpi-deger { font-size: 28px; font-weight: 800; letter-spacing: -.03em; line-height: 1.05; }
.kpi-alt { font-size: 12px; color: var(--metin-3); }

/* ---------- Karşılama bandı (panel) ---------- */
.karsilama {
  position: relative; overflow: hidden; border-radius: var(--r-xl); padding: 26px 28px; margin: 12px 0 20px;
  background: radial-gradient(120% 140% at 100% 0%, #3A3324 0%, transparent 55%), var(--komur);
  color: #fff; display: flex; align-items: center; gap: 24px; flex-wrap: wrap; isolation: isolate;
}
.karsilama::after { content: ""; position: absolute; right: -40px; top: -10px; bottom: -10px; width: 58%; background: url("../img/dalga.svg") right center / cover no-repeat; opacity: .5; z-index: -1; mask-image: linear-gradient(90deg, transparent, #000 40%); -webkit-mask-image: linear-gradient(90deg, transparent, #000 40%); }
.karsilama-tarih { font-size: 12.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--altin); }
.karsilama h1 { font-size: 30px; margin-top: 6px; letter-spacing: -.025em; }
.karsilama p { color: #C9C6BD; margin-top: 6px; max-width: 560px; }
.karsilama .eylemler { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; }
.karsilama .btn:not(.btn-altin) { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.12); color: #fff; }
.karsilama .btn:not(.btn-altin):hover { background: rgba(255,255,255,.14); }

/* ---------- Rozetler, çipler ---------- */
.rozet { display: inline-flex; align-items: center; gap: 5px; height: 22px; padding: 0 8px; border-radius: 6px; font-size: 11.5px; font-weight: 700; white-space: nowrap; background: var(--yuzey-3); color: var(--metin-2); letter-spacing: .01em; }
.rozet .nokta { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.rozet.satilik { background: var(--satilik-bg); color: var(--satilik); }
.rozet.kiralik { background: var(--kiralik-bg); color: var(--kiralik); }
.rozet.basari { background: var(--basari-bg); color: var(--basari); }
.rozet.uyari { background: var(--uyari-bg); color: var(--uyari); }
.rozet.tehlike { background: var(--tehlike-bg); color: var(--tehlike); }
.rozet.bilgi { background: var(--bilgi-bg); color: var(--bilgi); }
.rozet.altin { background: var(--altin-sis); color: var(--altin-derin); }
.rozet.koyu { background: var(--komur); color: #fff; }
.rozet.cerceve { background: transparent; border: 1px solid var(--cizgi-2); }
.kod { font-feature-settings: "tnum" 1, "zero" 1; font-weight: 700; letter-spacing: .02em; font-size: 12px; color: var(--metin-3); }

.cipler { display: flex; flex-wrap: wrap; gap: 6px; }
.cip { position: relative; }
.cip input { position: absolute; opacity: 0; pointer-events: none; }
.cip span {
  display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 13px; border-radius: 17px; border: 1px solid var(--cizgi);
  background: var(--yuzey); font-weight: 600; font-size: 13px; color: var(--metin-2); cursor: pointer; user-select: none; transition: all var(--gecis);
}
.cip span:hover { border-color: var(--cizgi-2); color: var(--metin); }
.cip input:checked + span { background: var(--komur); border-color: var(--komur); color: #fff; }
:root[data-tema="koyu"] .cip input:checked + span { background: var(--altin); border-color: var(--altin); color: #1D1D1B; }
.cip input:focus-visible + span { box-shadow: var(--odak); }
.cip input:checked + span::before { content: ""; width: 12px; height: 12px; background: currentColor; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat; }

/* ---------- Sekmeler ---------- */
.sekmeler { display: flex; gap: 2px; border-bottom: 1px solid var(--cizgi); margin-bottom: 18px; overflow-x: auto; scrollbar-width: none; }
.sekmeler::-webkit-scrollbar { display: none; }
.sekme { position: relative; padding: 10px 14px 12px; font-weight: 700; font-size: 13.8px; color: var(--metin-3); white-space: nowrap; display: inline-flex; align-items: center; gap: 7px; transition: color var(--gecis); }
.sekme:hover { color: var(--metin); }
.sekme.aktif { color: var(--metin); }
.sekme.aktif::after { content: ""; position: absolute; left: 10px; right: 10px; bottom: -1px; height: 2.5px; border-radius: 2px; background: var(--altin); }
.sekme .sayi { font-size: 11px; padding: 1px 7px; border-radius: 9px; background: var(--yuzey-3); color: var(--metin-2); }
.sekme.aktif .sayi { background: var(--altin-sis); color: var(--altin-derin); }

/* ---------- Formlar ---------- */
.form-izgara { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 14px 16px; }
.form-izgara > * { grid-column: span 12; }
.s2 { grid-column: span 2 !important; } .s3 { grid-column: span 3 !important; } .s4 { grid-column: span 4 !important; }
.s5 { grid-column: span 5 !important; } .s6 { grid-column: span 6 !important; } .s8 { grid-column: span 8 !important; } .s9 { grid-column: span 9 !important; }
.form-bolum { padding: 22px; }
.form-bolum + .form-bolum { border-top: 1px solid var(--cizgi); }
.form-bolum-baslik { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.form-bolum-baslik h3 { font-size: 15px; }
.form-bolum-baslik .no { width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; background: var(--altin-sis); color: var(--altin-derin); font-weight: 800; font-size: 13px; }
.form-bolum-baslik p { color: var(--metin-3); font-size: 12.8px; margin-left: auto; }
.alan { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.alan > .etiket { font-size: 12.8px; font-weight: 700; color: var(--metin-2); display: flex; align-items: center; gap: 6px; }
.alan > .etiket .zorunlu { color: var(--tehlike); }
.alan .ipucu { font-size: 12px; color: var(--metin-3); }
.girdi, select.girdi, textarea.girdi {
  width: 100%; height: 42px; padding: 0 12px; border: 1px solid var(--cizgi); border-radius: 10px; background: var(--yuzey);
  font-size: 14px; transition: border-color var(--gecis), box-shadow var(--gecis); appearance: none; -webkit-appearance: none;
}
textarea.girdi { height: auto; min-height: 96px; padding: 10px 12px; resize: vertical; line-height: 1.55; }
select.girdi { padding-right: 34px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238B8C91' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 10px center; background-size: 16px; }
select.girdi[multiple] { height: auto; padding: 6px; background-image: none; }
.girdi:hover { border-color: var(--cizgi-2); }
.girdi:focus { outline: none; border-color: var(--altin-koyu); box-shadow: var(--odak); }
.girdi::placeholder { color: var(--metin-3); }
.girdi:disabled { background: var(--yuzey-3); color: var(--metin-3); }
.girdi-grup { display: flex; align-items: stretch; }
.girdi-grup .girdi { border-radius: 10px 0 0 10px; }
.girdi-grup .girdi + .girdi, .girdi-grup .girdi:last-child { border-radius: 0 10px 10px 0; border-left: 0; }
.girdi-grup select.girdi:last-child { width: auto; min-width: 84px; flex: none; }
.girdi-ek { display: grid; place-items: center; padding: 0 12px; border: 1px solid var(--cizgi); border-left: 0; border-radius: 0 10px 10px 0; background: var(--yuzey-3); color: var(--metin-2); font-weight: 700; font-size: 13px; }
.ara-girdi { position: relative; }
.ara-girdi .ikon { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--metin-3); pointer-events: none; }
.ara-girdi .girdi { padding-left: 38px; }
.onay-kutu { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; font-weight: 600; font-size: 13.8px; user-select: none; min-height: 28px; }
.onay-kutu input { appearance: none; -webkit-appearance: none; width: 20px; height: 20px; border-radius: 6px; border: 1.5px solid var(--cizgi-2); background: var(--yuzey); display: grid; place-items: center; margin: 0; flex: none; transition: all var(--gecis); cursor: pointer; }
.onay-kutu input:checked { background: var(--komur); border-color: var(--komur); }
:root[data-tema="koyu"] .onay-kutu input:checked { background: var(--altin); border-color: var(--altin); }
.onay-kutu input:checked::after { content: ""; width: 12px; height: 12px; background: #fff; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat; }
:root[data-tema="koyu"] .onay-kutu input:checked::after { background: #1D1D1B; }
.anahtar { position: relative; width: 40px; height: 23px; flex: none; }
.anahtar input { appearance: none; -webkit-appearance: none; position: absolute; inset: 0; margin: 0; border-radius: 12px; background: var(--cizgi-2); cursor: pointer; transition: background var(--gecis); }
.anahtar input::after { content: ""; position: absolute; top: 3px; left: 3px; width: 17px; height: 17px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.25); transition: transform var(--gecis); }
.anahtar input:checked { background: var(--basari); }
.anahtar input:checked::after { transform: translateX(17px); }
.form-alt { display: flex; gap: 10px; justify-content: flex-end; align-items: center; padding: 16px 22px; border-top: 1px solid var(--cizgi); background: var(--yuzey-2); border-radius: 0 0 var(--r-lg) var(--r-lg); position: sticky; bottom: 0; z-index: 5; }
.form-alt .sol { margin-right: auto; }

/* ---------- Tablolar ---------- */
.tablo-kap { overflow-x: auto; }
.tablo { width: 100%; border-collapse: collapse; font-size: 13.8px; }
.tablo th { text-align: left; font-size: 11.5px; font-weight: 700; color: var(--metin-3); text-transform: uppercase; letter-spacing: .06em; padding: 12px 14px; border-bottom: 1px solid var(--cizgi); white-space: nowrap; background: var(--yuzey-2); }
.tablo th:first-child { border-top-left-radius: var(--r-lg); }
.tablo th:last-child { border-top-right-radius: var(--r-lg); }
.tablo td { padding: 12px 14px; border-bottom: 1px solid var(--cizgi); vertical-align: middle; }
.tablo tr:last-child td { border-bottom: 0; }
.tablo tbody tr { transition: background var(--gecis); }
.tablo tbody tr.tik { cursor: pointer; }
.tablo tbody tr.tik:hover { background: var(--yuzey-2); }
.tablo .say { text-align: right; white-space: nowrap; }
.tablo tfoot td { font-weight: 800; background: var(--yuzey-2); border-top: 1px solid var(--cizgi-2); }

/* ---------- Avatar ---------- */
.avatar { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; font-weight: 800; font-size: 12.5px; color: #fff; background: var(--komur-3); flex: none; letter-spacing: .02em; }
.avatar.k { width: 26px; height: 26px; font-size: 10.5px; }
.avatar.b { width: 52px; height: 52px; font-size: 18px; }
.avatar.xl { width: 72px; height: 72px; font-size: 24px; }

/* ---------- Listeler ---------- */
.liste { display: flex; flex-direction: column; }
.liste-oge { display: flex; align-items: center; gap: 12px; padding: 12px 20px; border-top: 1px solid var(--cizgi); transition: background var(--gecis); min-width: 0; }
.liste-oge:first-child { border-top: 0; }
a.liste-oge:hover, .liste-oge.tik:hover { background: var(--yuzey-2); cursor: pointer; }
.liste-oge .ana-metin { font-weight: 700; font-size: 14px; }
.liste-oge .alt-metin { font-size: 12.5px; color: var(--metin-3); }
.liste-oge .govde { min-width: 0; flex: 1; }

/* ---------- Görev ögesi ---------- */
.gorev { display: flex; align-items: flex-start; gap: 12px; padding: 13px 20px; border-top: 1px solid var(--cizgi); }
.gorev:first-child { border-top: 0; }
.gorev-tik { width: 22px; height: 22px; margin-top: 1px; border-radius: 7px; border: 1.8px solid var(--cizgi-2); flex: none; display: grid; place-items: center; color: transparent; transition: all var(--gecis); }
.gorev-tik:hover { border-color: var(--basari); color: var(--basari); background: var(--basari-bg); }
.gorev.bitti .gorev-tik { background: var(--basari); border-color: var(--basari); color: #fff; }
.gorev.bitti .gorev-baslik { text-decoration: line-through; color: var(--metin-3); }
.gorev-govde { flex: 1; min-width: 0; }
.gorev-baslik { font-weight: 700; font-size: 14px; cursor: pointer; }
.gorev-meta { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 4px; font-size: 12.5px; color: var(--metin-3); align-items: center; }
.gorev-meta span { display: inline-flex; align-items: center; gap: 4px; }
.gorev-meta .gecikti { color: var(--tehlike); font-weight: 700; }
.gorev-meta .bugun { color: var(--altin-derin); font-weight: 700; }
.tur-ikon { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; flex: none; background: var(--yuzey-3); color: var(--metin-2); }
.tur-ikon.arama, .tur-ikon.geri_donus { background: var(--bilgi-bg); color: var(--bilgi); }
.tur-ikon.randevu, .tur-ikon.toplanti { background: var(--altin-sis); color: var(--altin-derin); }
.tur-ikon.yer_gosterme { background: var(--kiralik-bg); color: var(--kiralik); }
.tur-ikon.evrak { background: var(--satilik-bg); color: var(--satilik); }

/* ---------- Portföy kartı ---------- */
.portfoy-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(268px, 1fr)); gap: 18px; }
.pkart { display: flex; flex-direction: column; overflow: hidden; transition: transform .22s cubic-bezier(.2,.7,.3,1), box-shadow .22s; }
.pkart:hover { transform: translateY(-3px); box-shadow: var(--golge-lg); }
.pkart-gorsel { position: relative; aspect-ratio: 3 / 2; background: var(--yuzey-3); overflow: hidden; }
.pkart-gorsel img, .pkart-gorsel svg { width: 100%; height: 100%; object-fit: cover; transition: transform .5s cubic-bezier(.2,.7,.3,1); }
.pkart:hover .pkart-gorsel img { transform: scale(1.04); }
.pkart-gorsel::after { content: ""; position: absolute; inset: auto 0 0 0; height: 55%; background: linear-gradient(transparent, rgba(16,16,14,.78)); pointer-events: none; }
.pkart-ust { position: absolute; top: 10px; left: 10px; right: 10px; display: flex; gap: 6px; align-items: center; z-index: 1; }
.pkart-ust .rozet { box-shadow: 0 2px 8px rgba(0,0,0,.18); }
.pkart-ust .rozet.satilik { background: var(--satilik); color: #fff; }
.pkart-ust .rozet.kiralik { background: var(--kiralik); color: #fff; }
.pkart-ust .kodu { margin-left: auto; font-size: 11px; font-weight: 800; letter-spacing: .04em; color: #fff; background: rgba(16,16,14,.55); padding: 3px 7px; border-radius: 6px; backdrop-filter: blur(6px); }
.pkart-fiyat { position: absolute; left: 14px; bottom: 11px; z-index: 1; color: #fff; font-size: 21px; font-weight: 800; letter-spacing: -.02em; text-shadow: 0 1px 8px rgba(0,0,0,.3); }
.pkart-fiyat small { font-size: 12px; font-weight: 700; opacity: .85; }
.pkart-foto { position: absolute; right: 12px; bottom: 13px; z-index: 1; color: #fff; font-size: 11.5px; font-weight: 700; display: inline-flex; gap: 4px; align-items: center; opacity: .9; }
.pkart-govde { padding: 13px 15px 14px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.pkart-baslik { font-weight: 800; font-size: 14.5px; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pkart-konum { font-size: 12.8px; color: var(--metin-2); display: flex; align-items: center; gap: 4px; }
.pkart-ozellik { display: flex; gap: 12px; font-size: 12.5px; color: var(--metin-2); font-weight: 600; margin-top: 2px; flex-wrap: wrap; }
.pkart-ozellik span { display: inline-flex; align-items: center; gap: 4px; }
.pkart-ozellik .ikon { width: 14px; height: 14px; color: var(--metin-3); }
.pkart-alt { display: flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 10px; border-top: 1px dashed var(--cizgi); font-size: 12.5px; color: var(--metin-2); font-weight: 600; }
.pkart.pasif .pkart-gorsel { filter: grayscale(.85); opacity: .75; }

/* Yatay mini portföy */
.pmini { display: flex; gap: 12px; align-items: center; padding: 10px 20px; border-top: 1px solid var(--cizgi); transition: background var(--gecis); }
.pmini:first-child { border-top: 0; }
.pmini:hover { background: var(--yuzey-2); }
.pmini-gorsel { width: 64px; height: 48px; border-radius: 8px; overflow: hidden; flex: none; background: var(--yuzey-3); }
.pmini-gorsel img, .pmini-gorsel svg { width: 100%; height: 100%; object-fit: cover; }

/* ---------- Skor halkası ---------- */
.skor { --s: 0; width: 46px; height: 46px; border-radius: 50%; flex: none; display: grid; place-items: center; font-weight: 800; font-size: 13px;
  background: conic-gradient(var(--skor-renk, var(--altin-koyu)) calc(var(--s) * 1%), var(--yuzey-3) 0); position: relative; }
.skor::before { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: var(--yuzey); }
.skor span { position: relative; }
.skor.yuksek { --skor-renk: var(--basari); }
.skor.orta { --skor-renk: var(--altin-koyu); }
.skor.dusuk { --skor-renk: var(--metin-3); }
.nedenler { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
.neden { font-size: 11.5px; font-weight: 600; padding: 2px 7px; border-radius: 5px; background: var(--yuzey-3); color: var(--metin-2); }
.neden.arti { background: var(--basari-bg); color: var(--basari); }
.neden.eksi { background: var(--tehlike-bg); color: var(--tehlike); }
.neden.yakin { background: var(--uyari-bg); color: var(--uyari); }

/* ---------- Detay sayfası ---------- */
.galeri { display: grid; grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; gap: 8px; border-radius: var(--r-lg); overflow: hidden; aspect-ratio: 21 / 9; background: var(--yuzey-3); }
.galeri > * { position: relative; overflow: hidden; cursor: zoom-in; }
.galeri > :first-child { grid-row: span 2; }
.galeri img, .galeri svg { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.galeri > :hover img { transform: scale(1.03); }
.galeri .daha { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(16,16,14,.55); color: #fff; font-weight: 800; font-size: 18px; }
.galeri.tek { grid-template-columns: 1fr; grid-template-rows: 1fr; }
.galeri.iki { grid-template-rows: 1fr; grid-template-columns: 1fr 1fr; }
.galeri.iki > :first-child { grid-row: auto; }
.detay-baslik { display: flex; gap: 20px; align-items: flex-start; flex-wrap: wrap; margin: 20px 0 6px; }
.detay-baslik h1 { font-size: 26px; letter-spacing: -.02em; }
.detay-fiyat { font-size: 30px; font-weight: 800; letter-spacing: -.03em; margin-left: auto; text-align: right; }
.detay-fiyat small { display: block; font-size: 12.5px; color: var(--metin-3); font-weight: 600; letter-spacing: 0; }
.ozellik-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 1px; background: var(--cizgi); border-radius: var(--r); overflow: hidden; border: 1px solid var(--cizgi); }
.ozellik-izgara > div { background: var(--yuzey); padding: 11px 14px; }
.ozellik-izgara dt { font-size: 11.5px; color: var(--metin-3); font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
.ozellik-izgara dd { margin: 3px 0 0; font-weight: 700; font-size: 14px; }
.bilgi-satir { display: flex; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--cizgi); font-size: 13.8px; }
.bilgi-satir:last-child { border-bottom: 0; }
.bilgi-satir dt { color: var(--metin-3); width: 130px; flex: none; font-weight: 600; }
.bilgi-satir dd { margin: 0; font-weight: 600; min-width: 0; overflow-wrap: anywhere; }
.aciklama-metin { white-space: pre-line; color: var(--metin-2); line-height: 1.7; }
.iletisim-kart { display: flex; gap: 12px; align-items: center; }
.iletisim-eylem { display: flex; gap: 6px; margin-top: 12px; }
.iletisim-eylem .btn { flex: 1; }
.btn-wa { color: #1A9E52; }
.gizli-not { display: flex; gap: 10px; padding: 12px 14px; border-radius: var(--r); background: var(--yuzey-3); color: var(--metin-2); font-size: 13px; align-items: flex-start; }

/* ---------- Zaman çizelgesi ---------- */
.zaman { position: relative; padding: 4px 20px 16px; }
.zaman-oge { position: relative; display: flex; gap: 12px; padding: 10px 0; }
.zaman-oge::before { content: ""; position: absolute; left: 15px; top: 40px; bottom: -10px; width: 1.5px; background: var(--cizgi); }
.zaman-oge:last-child::before { display: none; }
.zaman-ikon { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: var(--yuzey-3); color: var(--metin-2); flex: none; position: relative; z-index: 1; border: 3px solid var(--yuzey); }
.zaman-ikon .ikon { width: 14px; height: 14px; }
.zaman-ikon.arama { background: var(--bilgi-bg); color: var(--bilgi); }
.zaman-ikon.whatsapp { background: #E1F6E8; color: #1A9E52; }
.zaman-ikon.yer_gosterme { background: var(--kiralik-bg); color: var(--kiralik); }
.zaman-ikon.not { background: var(--altin-sis); color: var(--altin-derin); }
.zaman-govde { min-width: 0; flex: 1; padding-top: 4px; }
.zaman-mesaj { font-size: 13.8px; white-space: pre-line; overflow-wrap: anywhere; }
.zaman-meta { font-size: 12px; color: var(--metin-3); margin-top: 2px; }
.not-ekle { padding: 14px 20px; border-bottom: 1px solid var(--cizgi); }
.not-ekle textarea { min-height: 64px; }

/* ---------- Kanban ---------- */
.kanban { display: grid; grid-template-columns: repeat(5, minmax(250px, 1fr)); gap: 14px; overflow-x: auto; padding-bottom: 12px; align-items: start; scroll-snap-type: x proximity; }
.kanban-sutun { background: var(--yuzey-3); border-radius: var(--r-lg); padding: 10px; min-height: 200px; scroll-snap-align: start; transition: background var(--gecis), box-shadow var(--gecis); }
.kanban-sutun.uzerinde { background: var(--altin-sis); box-shadow: inset 0 0 0 2px var(--altin); }
.kanban-baslik { display: flex; align-items: center; gap: 8px; padding: 4px 6px 10px; font-weight: 800; font-size: 13.5px; }
.kanban-baslik .sayi { font-size: 11.5px; padding: 1px 8px; border-radius: 9px; background: var(--yuzey); color: var(--metin-2); }
.kanban-baslik .toplam { margin-left: auto; font-size: 12px; color: var(--metin-3); font-weight: 700; }
.kanban-kart { background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--r); padding: 12px; margin-bottom: 8px; cursor: grab; box-shadow: var(--golge-sm); transition: box-shadow var(--gecis), transform var(--gecis); display: block; }
.kanban-kart:hover { box-shadow: var(--golge); }
.kanban-kart.surukleniyor { opacity: .45; transform: rotate(1.5deg); }
.kanban-kart .baslik { font-weight: 700; font-size: 13.8px; line-height: 1.35; }
.kanban-kart .fiyat { font-weight: 800; font-size: 15px; margin-top: 6px; }

/* ---------- Takvim ---------- */
.takvim { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border-top: 1px solid var(--cizgi); border-left: 1px solid var(--cizgi); }
.takvim-gun-ad { padding: 8px 10px; font-size: 11.5px; font-weight: 700; color: var(--metin-3); text-transform: uppercase; letter-spacing: .06em; border-right: 1px solid var(--cizgi); border-bottom: 1px solid var(--cizgi); background: var(--yuzey-2); }
.takvim-hucre { min-height: 112px; padding: 6px; border-right: 1px solid var(--cizgi); border-bottom: 1px solid var(--cizgi); background: var(--yuzey); display: flex; flex-direction: column; gap: 3px; min-width: 0; cursor: pointer; }
.takvim-hucre:hover { background: var(--yuzey-2); }
.takvim-hucre.disarida { background: var(--yuzey-2); }
.takvim-hucre.disarida .takvim-no { color: var(--metin-3); opacity: .6; }
.takvim-no { font-size: 12.5px; font-weight: 700; color: var(--metin-2); width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; }
.takvim-hucre.bugun .takvim-no { background: var(--altin); color: #1D1D1B; }
.takvim-olay { font-size: 11.5px; font-weight: 600; padding: 2px 6px; border-radius: 5px; background: var(--altin-sis); color: var(--metin); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-left: 3px solid var(--altin-koyu); }
.takvim-olay.bitti { opacity: .5; text-decoration: line-through; }
.takvim-olay.yer_gosterme { background: var(--kiralik-bg); border-left-color: var(--kiralik); }
.takvim-olay.arama, .takvim-olay.geri_donus { background: var(--bilgi-bg); border-left-color: var(--bilgi); }
.takvim-olay.evrak { background: var(--satilik-bg); border-left-color: var(--satilik); }

/* ---------- Proje ünite ızgarası ---------- */
.unite-blok { margin-bottom: 22px; }
.unite-blok h4 { font-size: 13.5px; margin-bottom: 8px; display: flex; gap: 8px; align-items: center; }
.unite-izgara { display: grid; grid-template-columns: 54px repeat(var(--sutun, 4), minmax(56px, 1fr)); gap: 5px; }
.unite-kat { font-size: 11.5px; font-weight: 700; color: var(--metin-3); display: grid; place-items: center; }
.unite { height: 48px; border-radius: 8px; display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; cursor: pointer; border: 1px solid transparent; transition: transform .12s, box-shadow var(--gecis); line-height: 1.15; }
.unite small { font-weight: 600; font-size: 10.5px; opacity: .8; }
.unite:hover { transform: scale(1.05); box-shadow: var(--golge); z-index: 1; }
.unite.musait { background: var(--basari-bg); color: var(--basari); border-color: color-mix(in srgb, var(--basari) 25%, transparent); }
.unite.opsiyonlu { background: var(--uyari-bg); color: var(--uyari); border-color: color-mix(in srgb, var(--uyari) 30%, transparent); }
.unite.satildi { background: var(--yuzey-3); color: var(--metin-3); text-decoration: line-through; }
.unite.kapali { background: repeating-linear-gradient(45deg, var(--yuzey-3), var(--yuzey-3) 4px, var(--yuzey) 4px, var(--yuzey) 8px); color: var(--metin-3); }
.lejant { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12.5px; color: var(--metin-2); font-weight: 600; }
.lejant span { display: inline-flex; align-items: center; gap: 6px; }
.lejant i { width: 12px; height: 12px; border-radius: 4px; display: inline-block; }
.doluluk { height: 8px; border-radius: 4px; background: var(--yuzey-3); display: flex; overflow: hidden; }
.doluluk i { display: block; height: 100%; }

/* ---------- Grafikler ---------- */
.grafik { width: 100%; height: auto; overflow: visible; }
.grafik text { font-family: var(--font); fill: var(--metin-3); font-size: 11px; }
.grafik .eksen { stroke: var(--cizgi); }
.grafik .cubuk { transition: opacity var(--gecis); }
.grafik .cubuk:hover { opacity: .8; }
.cubuk-liste { display: flex; flex-direction: column; gap: 10px; }
.cubuk-satir { display: grid; grid-template-columns: 120px 1fr 56px; gap: 10px; align-items: center; font-size: 13px; }
.cubuk-satir .ad { font-weight: 600; color: var(--metin-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cubuk-satir .iz { height: 10px; border-radius: 5px; background: var(--yuzey-3); overflow: hidden; }
.cubuk-satir .iz i { display: block; height: 100%; border-radius: 5px; background: var(--grafik-1); }
.ipucu-kutu { position: fixed; z-index: 95; pointer-events: none; background: var(--yuzey); border: 1px solid var(--cizgi); box-shadow: var(--golge-lg); border-radius: 10px; padding: 9px 11px; font-size: 12.5px; min-width: 150px; }
.ipucu-kutu b { display: block; margin-bottom: 4px; }
.ipucu-kutu .s { display: flex; align-items: center; gap: 6px; justify-content: space-between; }
.ipucu-kutu .s i { width: 9px; height: 9px; border-radius: 3px; display: inline-block; margin-right: 4px; }
.grafik-lejant { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12.5px; font-weight: 600; color: var(--metin-2); }
.grafik-lejant span { display: inline-flex; align-items: center; gap: 6px; }
.grafik-lejant i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.cubuk-satir .deger { text-align: right; font-weight: 800; }
.lider { display: flex; gap: 12px; align-items: center; }
.lider-sira { width: 24px; text-align: center; font-weight: 800; color: var(--metin-3); }
.lider-sira.altin { color: var(--altin-koyu); }

/* ---------- Boş durum / iskelet ---------- */
.bos { padding: 44px 24px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 8px; color: var(--metin-2); }
.bos-ikon { width: 56px; height: 56px; border-radius: 16px; background: var(--altin-sis); color: var(--altin-derin); display: grid; place-items: center; margin-bottom: 6px; }
.bos-ikon .ikon { width: 26px; height: 26px; }
.bos h3 { font-size: 16px; color: var(--metin); }
.bos p { max-width: 380px; font-size: 13.5px; }
.bos .btn { margin-top: 10px; }
.bos.k { padding: 26px 20px; }
.bos.k .bos-ikon { width: 42px; height: 42px; border-radius: 12px; }
.iskelet { background: linear-gradient(90deg, var(--yuzey-3) 0%, var(--yuzey-2) 50%, var(--yuzey-3) 100%); background-size: 200% 100%; animation: kayma 1.4s ease-in-out infinite; border-radius: var(--r); }
.yukleme-alan { display: grid; place-items: center; padding: 60px; color: var(--metin-3); }

/* ---------- Modal ---------- */
.modal-kap { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 24px; background: rgba(15,15,14,.5); animation: soluk-gir .18s ease both; overflow-y: auto; }
.modal { width: 100%; max-width: 560px; background: var(--yuzey); border-radius: var(--r-xl); box-shadow: var(--golge-lg); animation: modal-gir .24s cubic-bezier(.2,.8,.3,1) both; display: flex; flex-direction: column; max-height: calc(100dvh - 48px); }
.modal.genis { max-width: 860px; }
.modal.dar { max-width: 420px; }
.modal-ust { display: flex; align-items: center; gap: 12px; padding: 18px 22px 14px; border-bottom: 1px solid var(--cizgi); }
.modal-ust h2 { font-size: 17px; }
.modal-ust .btn-ikon { margin-left: auto; margin-right: -8px; }
.modal-govde { padding: 20px 22px; overflow-y: auto; overscroll-behavior: contain; }
.modal-alt { display: flex; gap: 10px; justify-content: flex-end; padding: 14px 22px 18px; border-top: 1px solid var(--cizgi); flex-wrap: wrap; }
.modal-alt .sol { margin-right: auto; }
@keyframes soluk-gir { from { opacity: 0; } }
@keyframes modal-gir { from { opacity: 0; transform: translateY(14px) scale(.98); } }
.modal-kap.kapaniyor { animation: soluk-cik .16s ease both; }
@keyframes soluk-cik { to { opacity: 0; } }

/* Görsel görüntüleyici */
.goruntuleyici { position: fixed; inset: 0; z-index: 120; background: rgba(10,10,9,.94); display: grid; grid-template-rows: auto 1fr auto; animation: soluk-gir .2s; }
.goruntuleyici-ust { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; color: #fff; font-weight: 700; }
.goruntuleyici-ust .btn-ikon { color: #fff; }
.goruntuleyici-ust .btn-ikon:hover { background: rgba(255,255,255,.1); }
.goruntuleyici-govde { display: grid; place-items: center; position: relative; min-height: 0; padding: 0 60px; }
.goruntuleyici-govde img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 6px; user-select: none; }
.goruntuleyici .ok { position: absolute; top: 50%; transform: translateY(-50%); width: 48px; height: 48px; border-radius: 50%; background: rgba(255,255,255,.1); color: #fff; display: grid; place-items: center; }
.goruntuleyici .ok:hover { background: rgba(255,255,255,.2); }
.goruntuleyici .ok.sol { left: 12px; } .goruntuleyici .ok.sag { right: 12px; }
.goruntuleyici-kucukler { display: flex; gap: 6px; padding: 12px; justify-content: center; overflow-x: auto; }
.goruntuleyici-kucukler img { width: 64px; height: 44px; object-fit: cover; border-radius: 6px; opacity: .5; cursor: pointer; flex: none; }
.goruntuleyici-kucukler img.aktif { opacity: 1; outline: 2px solid var(--altin); }

/* ---------- Bildirim (toast) ---------- */
.tostlar { position: fixed; z-index: 200; right: 20px; bottom: 20px; display: flex; flex-direction: column; gap: 8px; pointer-events: none; max-width: calc(100vw - 40px); }
.tost { pointer-events: auto; display: flex; gap: 10px; align-items: flex-start; min-width: 280px; max-width: 420px; padding: 12px 14px; border-radius: var(--r); background: var(--komur); color: #fff; box-shadow: var(--golge-lg); font-weight: 600; font-size: 13.8px; animation: tost-gir .28s cubic-bezier(.2,.8,.3,1) both; }
.tost .ikon { margin-top: 1px; }
.tost.basari .ikon { color: #6EDB9A; }
.tost.hata .ikon { color: #FF8B78; }
.tost.bilgi .ikon { color: var(--altin); }
.tost .tost-eylem { margin-left: auto; color: var(--altin); font-weight: 800; white-space: nowrap; }
.tost.cikiyor { animation: tost-cik .2s ease both; }
@keyframes tost-gir { from { opacity: 0; transform: translateY(10px) scale(.97); } }
@keyframes tost-cik { to { opacity: 0; transform: translateX(20px); } }

/* ---------- Açılır menü / panel ---------- */
.acilir { position: fixed; z-index: 90; min-width: 220px; background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--r); box-shadow: var(--golge-lg); padding: 6px; animation: modal-gir .16s ease both; }
.acilir-oge { display: flex; align-items: center; gap: 10px; width: 100%; padding: 9px 10px; border-radius: 8px; font-weight: 600; font-size: 13.5px; text-align: left; color: var(--metin); }
.acilir-oge:hover { background: var(--yuzey-3); }
.acilir-oge.tehlike { color: var(--tehlike); }
.acilir-ayrac { height: 1px; background: var(--cizgi); margin: 5px 0; }
.bildirim-panel { width: 380px; max-width: calc(100vw - 24px); padding: 0; max-height: min(560px, calc(100dvh - 90px)); display: flex; flex-direction: column; }
.bildirim-panel .ust-satir { display: flex; align-items: center; padding: 14px 16px 10px; border-bottom: 1px solid var(--cizgi); }
.bildirim-panel .ust-satir h3 { font-size: 15px; }
.bildirim-liste { overflow-y: auto; }
.bildirim { display: flex; gap: 10px; padding: 12px 16px; border-bottom: 1px solid var(--cizgi); font-size: 13.5px; }
.bildirim:hover { background: var(--yuzey-2); }
.bildirim.yeni { background: var(--altin-sis); }
.bildirim .zaman-meta { margin-top: 3px; }

/* Arama paleti */
.palet-kap { position: fixed; inset: 0; z-index: 110; background: rgba(15,15,14,.45); display: flex; justify-content: center; align-items: flex-start; padding: 10vh 16px 16px; animation: soluk-gir .15s; }
.palet { width: 100%; max-width: 640px; background: var(--yuzey); border-radius: var(--r-xl); box-shadow: var(--golge-lg); overflow: hidden; animation: modal-gir .2s ease both; display: flex; flex-direction: column; max-height: 76vh; }
.palet-girdi { display: flex; align-items: center; gap: 12px; padding: 0 18px; border-bottom: 1px solid var(--cizgi); }
.palet-girdi input { flex: 1; height: 58px; border: 0; background: transparent; font-size: 16px; outline: none; }
.palet-sonuc { overflow-y: auto; padding: 6px 0 10px; }
.palet-grup { padding: 10px 18px 4px; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--metin-3); }
.palet-oge { display: flex; align-items: center; gap: 12px; padding: 9px 18px; }
.palet-oge:hover, .palet-oge.secili { background: var(--altin-sis); }

/* ---------- Filtre çubuğu ---------- */
.filtre-cubuk { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 16px; }
.filtre-cubuk .girdi { height: 38px; width: auto; font-size: 13.5px; }
.filtre-cubuk select.girdi { min-width: 130px; }
.filtre-cubuk .ara-girdi { flex: 1; min-width: 220px; max-width: 360px; }
.filtre-cubuk .ara-girdi .girdi { width: 100%; }
.sonuc-sayi { font-size: 13px; color: var(--metin-3); font-weight: 600; }

/* ---------- Foto yükleyici ---------- */
.foto-alan { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; }
.foto-oge { position: relative; aspect-ratio: 3/2; border-radius: var(--r-sm); overflow: hidden; background: var(--yuzey-3); border: 1px solid var(--cizgi); }
.foto-oge img { width: 100%; height: 100%; object-fit: cover; }
.foto-oge .kapak-etiket { position: absolute; left: 6px; top: 6px; background: var(--altin); color: #1D1D1B; font-size: 10.5px; font-weight: 800; padding: 2px 6px; border-radius: 5px; }
.foto-oge .foto-eylem { position: absolute; right: 4px; top: 4px; display: flex; gap: 3px; opacity: 0; transition: opacity var(--gecis); }
.foto-oge:hover .foto-eylem, .foto-oge:focus-within .foto-eylem { opacity: 1; }
.foto-oge .foto-eylem button { width: 28px; height: 28px; border-radius: 7px; background: rgba(16,16,14,.7); color: #fff; display: grid; place-items: center; }
.foto-oge .foto-eylem button:hover { background: var(--komur); }
.foto-ekle { aspect-ratio: 3/2; border: 2px dashed var(--cizgi-2); border-radius: var(--r-sm); display: grid; place-items: center; align-content: center; gap: 6px; color: var(--metin-3); font-weight: 700; font-size: 13px; cursor: pointer; transition: all var(--gecis); text-align: center; padding: 8px; }
.foto-ekle:hover, .foto-ekle.uzerinde { border-color: var(--altin-koyu); color: var(--altin-derin); background: var(--altin-sis); }
.foto-oge .ilerleme { position: absolute; inset: auto 0 0 0; height: 4px; background: rgba(0,0,0,.2); }
.foto-oge .ilerleme i { display: block; height: 100%; background: var(--altin); transition: width .2s; }

/* Dosya satırı */
.dosya { display: flex; align-items: center; gap: 12px; padding: 11px 20px; border-top: 1px solid var(--cizgi); }
.dosya:first-child { border-top: 0; }
.dosya-ikon { width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; background: var(--bilgi-bg); color: var(--bilgi); flex: none; font-size: 10px; font-weight: 800; letter-spacing: .03em; }
.dosya-ikon.pdf { background: var(--tehlike-bg); color: var(--tehlike); }
.dosya-ikon.img { background: var(--kiralik-bg); color: var(--kiralik); }
.dosya-ikon.xls { background: var(--basari-bg); color: var(--basari); }

/* Müşteri seçici */
.secici { position: relative; }
.secici-liste { position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 20; background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--r); box-shadow: var(--golge-lg); max-height: 260px; overflow-y: auto; padding: 4px; }
.secici-oge { display: flex; gap: 10px; align-items: center; padding: 8px 10px; border-radius: 8px; cursor: pointer; font-size: 13.5px; }
.secici-oge:hover, .secici-oge.secili { background: var(--altin-sis); }
.secili-kayit { display: flex; align-items: center; gap: 10px; padding: 6px 6px 6px 10px; border: 1px solid var(--cizgi); border-radius: 10px; min-height: 42px; background: var(--yuzey-2); }
.etiket-girdi { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding: 5px; min-height: 42px; border: 1px solid var(--cizgi); border-radius: 10px; background: var(--yuzey); }
.etiket-girdi:focus-within { border-color: var(--altin-koyu); box-shadow: var(--odak); }
.etiket-girdi input { flex: 1; min-width: 140px; border: 0; outline: none; background: transparent; height: 30px; padding: 0 6px; font-size: 14px; }
.etiket { display: inline-flex; align-items: center; gap: 4px; height: 28px; padding: 0 4px 0 10px; border-radius: 7px; background: var(--komur); color: #fff; font-size: 12.5px; font-weight: 700; }
:root[data-tema="koyu"] .etiket { background: var(--altin); color: #1D1D1B; }
.etiket button { width: 20px; height: 20px; border-radius: 5px; display: grid; place-items: center; color: inherit; opacity: .7; }
.etiket button:hover { opacity: 1; background: rgba(255,255,255,.15); }

/* Harita */
.harita { width: 100%; border-radius: var(--r-lg); overflow: hidden; background: var(--yuzey-3); z-index: 0; }
.harita-buyuk { height: calc(100dvh - 230px); min-height: 420px; }
.harita-orta { height: 300px; }
.harita-pin { width: 30px; height: 30px; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); background: var(--komur); border: 2px solid var(--altin); display: grid; place-items: center; box-shadow: 0 3px 10px rgba(0,0,0,.3); }
.harita-pin.kiralik { background: var(--kiralik); }
.harita-pin.satilik { background: var(--satilik); }
.harita-pin::after { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #fff; }
.leaflet-popup-content { font-family: var(--font); margin: 10px 12px !important; }
.leaflet-popup-content-wrapper { border-radius: 12px !important; }

/* Uyarı kutusu */
.uyari-kutu { display: flex; gap: 12px; align-items: flex-start; padding: 13px 16px; border-radius: var(--r); background: var(--uyari-bg); color: var(--uyari); font-size: 13.5px; font-weight: 600; }
.uyari-kutu.bilgi { background: var(--bilgi-bg); color: var(--bilgi); }
.uyari-kutu.tehlike { background: var(--tehlike-bg); color: var(--tehlike); }
.uyari-kutu.basari { background: var(--basari-bg); color: var(--basari); }
.uyari-kutu p { color: var(--metin-2); font-weight: 500; margin-top: 2px; }

/* Duyuru */
.duyuru { padding: 20px 22px; display: flex; gap: 16px; position: relative; }
.duyuru + .duyuru { border-top: 1px solid var(--cizgi); }
.duyuru.okunmadi::before { content: ""; position: absolute; left: 0; top: 22px; width: 4px; height: 26px; border-radius: 0 4px 4px 0; background: var(--altin); }
.duyuru-ikon { width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center; flex: none; background: var(--yuzey-3); color: var(--metin-2); }
.duyuru-ikon.proje { background: var(--altin-sis); color: var(--altin-derin); }
.duyuru-ikon.kampanya { background: var(--satilik-bg); color: var(--satilik); }
.duyuru-ikon.onemli { background: var(--tehlike-bg); color: var(--tehlike); }
.duyuru-ikon.egitim { background: var(--bilgi-bg); color: var(--bilgi); }
.duyuru h3 { font-size: 16px; }
.duyuru-icerik { white-space: pre-line; color: var(--metin-2); margin-top: 8px; line-height: 1.65; }

/* Giriş ekranı */
.giris { min-height: 100dvh; display: grid; grid-template-columns: 1.1fr 1fr; background: var(--yuzey); }
.giris-sanat { position: relative; overflow: hidden; background: radial-gradient(90% 70% at 20% 10%, #3B3322 0%, transparent 60%), var(--komur); color: #fff; padding: 48px; display: flex; flex-direction: column; isolation: isolate; }
.giris-sanat::after { content: ""; position: absolute; inset: 35% -10% -5% -10%; background: url("../img/dalga.svg") center bottom / cover no-repeat; opacity: .55; z-index: -1; }
.giris-sanat img.logo { width: 230px; }
.giris-sanat h2 { font-size: 40px; letter-spacing: -.03em; margin-top: auto; max-width: 460px; line-height: 1.08; }
.giris-sanat h2 em { font-style: normal; color: var(--altin); }
.giris-sanat p { color: #BDB9AE; margin-top: 14px; max-width: 420px; font-size: 15px; }
.giris-sanat .alt-not { margin-top: 34px; font-size: 12px; color: #77756D; letter-spacing: .06em; text-transform: uppercase; font-weight: 700; }
.giris-form { display: grid; place-items: center; padding: 40px 24px; }
.giris-form form { width: 100%; max-width: 380px; display: flex; flex-direction: column; gap: 16px; }
.giris-form h1 { font-size: 28px; }
.giris-form .alt { color: var(--metin-2); margin-top: -8px; }
.giris-form .girdi { height: 48px; font-size: 15px; }
.giris-hata { padding: 11px 14px; border-radius: 10px; background: var(--tehlike-bg); color: var(--tehlike); font-weight: 600; font-size: 13.5px; }

/* Lead kartı */
.lead-sure { font-size: 11.5px; font-weight: 700; }
.lead-sure.gec { color: var(--tehlike); }

/* Profil/ekip kartı */
.kisi-kart { padding: 18px; display: flex; flex-direction: column; gap: 12px; }
.kisi-kart .ust-kisim { display: flex; gap: 12px; align-items: center; }
.mini-sayilar { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.mini-sayilar div { background: var(--yuzey-2); border-radius: 10px; padding: 8px 10px; }
.mini-sayilar b { display: block; font-size: 17px; }
.mini-sayilar span { font-size: 11.5px; color: var(--metin-3); font-weight: 600; }

/* Komisyon hesap makinesi */
.hesap-sonuc { background: var(--komur); color: #fff; border-radius: var(--r-xl); padding: 24px; position: relative; overflow: hidden; isolation: isolate; }
.hesap-sonuc::after { content: ""; position: absolute; right: -30px; bottom: -30px; width: 260px; height: 160px; background: url("../img/dalga.svg") center / cover no-repeat; opacity: .25; z-index: -1; }
.hesap-toplam { font-size: 34px; font-weight: 800; letter-spacing: -.03em; }
.hesap-satir { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,.1); font-size: 14px; }
.hesap-satir:last-child { border-bottom: 0; }
.hesap-satir span { color: #BDB9AE; }
.hesap-satir b { font-weight: 800; }
.hesap-cubuk { display: flex; height: 12px; border-radius: 6px; overflow: hidden; margin: 16px 0 6px; background: rgba(255,255,255,.08); }
.hesap-cubuk i { display: block; height: 100%; }

/* Çevrimdışı şeridi */
.cevrimdisi { position: fixed; left: 50%; top: 10px; transform: translateX(-50%); z-index: 150; background: var(--tehlike); color: #fff; padding: 8px 14px; border-radius: 20px; font-weight: 700; font-size: 13px; display: flex; gap: 8px; align-items: center; box-shadow: var(--golge-lg); }

/* ==========================================================================
   Duyarlı yerleşim
   ========================================================================== */
@media (max-width: 1280px) {
  .kpi-izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1100px) {
  .izgara-ana { grid-template-columns: minmax(0, 1fr); }
  .izgara-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .giris { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 960px) {
  :root { --ust-yuk: 58px; }
  .kabuk { grid-template-columns: minmax(0, 1fr); }
  .yan { position: fixed; left: 0; top: 0; bottom: 0; width: min(300px, 86vw); z-index: 70; transform: translateX(-102%); transition: transform .26s cubic-bezier(.2,.8,.3,1); box-shadow: var(--golge-lg); padding-top: env(safe-area-inset-top); }
  .yan.acik { transform: none; }
  .ust { padding: 0 12px 0 8px; padding-top: env(safe-area-inset-top); height: calc(var(--ust-yuk) + env(safe-area-inset-top)); gap: 6px; }
  .ust .ust-menu-btn { display: inline-grid; }
  .ust-amblem { display: block; }
  .ust-baslik { font-size: 16px; }
  .ust-ara { min-width: 0; width: 38px; padding: 0; justify-content: center; border: 0; background: transparent; color: var(--metin-2); }
  .ust-ara span, .ust-ara kbd { display: none; }
  .ust-eylemler .ust-ekle { display: none; }
  .icerik { padding: 4px 16px calc(var(--alt-yuk) + 90px + env(safe-area-inset-bottom)); }
  .alt-menu {
    display: grid; grid-template-columns: repeat(5, 1fr); position: fixed; left: 0; right: 0; bottom: 0; z-index: 40;
    height: calc(var(--alt-yuk) + env(safe-area-inset-bottom)); padding-bottom: env(safe-area-inset-bottom);
    background: color-mix(in srgb, var(--yuzey) 92%, transparent); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
    border-top: 1px solid var(--cizgi);
  }
  .alt-menu a, .alt-menu button { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; font-size: 10.5px; font-weight: 700; color: var(--metin-3); position: relative; }
  .alt-menu .aktif { color: var(--metin); }
  .alt-menu .aktif .ikon { color: var(--altin-koyu); }
  .alt-menu .ikon { width: 22px; height: 22px; }
  .alt-menu .rozet-nokta { position: absolute; top: 9px; left: calc(50% + 6px); min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px; background: var(--tehlike); color: #fff; font-size: 9.5px; display: grid; place-items: center; }
  .fab { display: grid; place-items: center; position: fixed; right: 16px; bottom: calc(var(--alt-yuk) + 16px + env(safe-area-inset-bottom)); z-index: 41; width: 56px; height: 56px; border-radius: 18px; background: var(--altin); color: #1D1D1B; box-shadow: 0 8px 24px rgba(201,155,50,.45); transition: transform var(--gecis); }
  .fab:active { transform: scale(.94); }
  .fab .ikon { width: 26px; height: 26px; stroke-width: 2.2; }
  .sayfa-ust { margin: 10px 0 16px; }
  .sayfa-ust h1 { font-size: 22px; }
  .sayfa-ust .eylemler { margin-left: 0; width: 100%; }
  .karsilama { padding: 20px; border-radius: var(--r-lg); margin-top: 8px; }
  .karsilama h1 { font-size: 23px; }
  .karsilama .eylemler { margin-left: 0; }
  .karsilama::after { width: 100%; opacity: .25; }
  .kpi-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .kpi { padding: 13px 14px; }
  .kpi-deger { font-size: 23px; }
  .izgara-2, .izgara-3 { grid-template-columns: minmax(0, 1fr); }
  .form-izgara > [class*="s"] { grid-column: span 12 !important; }
  .form-izgara > .m6 { grid-column: span 6 !important; }
  .galeri { aspect-ratio: 4 / 3; grid-template-columns: 1fr; grid-template-rows: 1fr; border-radius: var(--r); }
  .galeri > :not(:first-child) { display: none; }
  .galeri > :first-child { grid-row: auto; }
  .detay-baslik h1 { font-size: 21px; }
  .detay-fiyat { margin-left: 0; text-align: left; font-size: 25px; }
  .giris { grid-template-columns: 1fr; }
  .giris-sanat { padding: 28px 24px 30px; min-height: 260px; }
  .giris-sanat img.logo { width: 170px; }
  .giris-sanat h2 { font-size: 26px; margin-top: 40px; }
  .giris-sanat p, .giris-sanat .alt-not { display: none; }
  .girdi, select.girdi, textarea.girdi, .etiket-girdi input, .palet-girdi input { font-size: 16px; }
  .modal-kap { padding: 0; align-items: end; }
  .modal, .modal.genis, .modal.dar { max-width: none; border-radius: var(--r-xl) var(--r-xl) 0 0; max-height: 92dvh; animation: alttan .28s cubic-bezier(.2,.8,.3,1) both; }
  .modal-alt { padding-bottom: calc(14px + env(safe-area-inset-bottom)); }
  .modal-alt .btn { flex: 1; }
  @keyframes alttan { from { transform: translateY(100%); } }
  .tostlar { left: 12px; right: 12px; bottom: calc(var(--alt-yuk) + 84px + env(safe-area-inset-bottom)); max-width: none; }
  .tost { min-width: 0; max-width: none; }
  .filtre-cubuk { gap: 6px; flex-wrap: nowrap; overflow-x: auto; margin: 0 -16px 14px; padding: 0 16px 4px; scrollbar-width: none; }
  .filtre-cubuk::-webkit-scrollbar { display: none; }
  .filtre-cubuk > * { flex: none; }
  .filtre-cubuk .ara-girdi { min-width: 200px; }
  .portfoy-izgara { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; }
  .kanban { grid-template-columns: repeat(5, 86vw); margin: 0 -16px; padding: 0 16px 12px; }
  .takvim-hucre { min-height: 64px; padding: 3px; }
  .takvim-olay { font-size: 0; height: 6px; padding: 0; border-left-width: 0; border-radius: 3px; }
  .tablo.mobil-kart thead { display: none; }
  .tablo.mobil-kart, .tablo.mobil-kart tbody, .tablo.mobil-kart tr, .tablo.mobil-kart td { display: block; width: 100%; }
  .tablo.mobil-kart tr { padding: 12px 16px; border-bottom: 1px solid var(--cizgi); }
  .tablo.mobil-kart td { border: 0; padding: 3px 0; display: flex; justify-content: space-between; gap: 12px; text-align: right; }
  .tablo.mobil-kart td::before { content: attr(data-e); color: var(--metin-3); font-weight: 600; text-align: left; }
  .tablo.mobil-kart td.bas { font-weight: 800; font-size: 15px; text-align: left; }
  .tablo.mobil-kart td.bas::before { display: none; }
  .cubuk-satir { grid-template-columns: 96px 1fr 48px; }
  .bildirim-panel { position: fixed; left: 12px !important; right: 12px; top: calc(var(--ust-yuk) + 6px + env(safe-area-inset-top)) !important; width: auto; }
  .goruntuleyici-govde { padding: 0; }
  .unite-izgara { grid-template-columns: 40px repeat(var(--sutun, 4), minmax(44px, 1fr)); }
  .bilgi-satir dt { width: 110px; }
  .form-alt { padding-bottom: calc(16px + env(safe-area-inset-bottom)); }
}
@media (max-width: 560px) {
  .portfoy-izgara { grid-template-columns: minmax(0, 1fr); }
  .not-ekle .btn-grup button span { display: none; }
  .not-ekle .btn-grup button { padding: 0 11px; }
}
@media (max-width: 420px) {
  .kpi-deger { font-size: 21px; }
  .karsilama h1 { font-size: 21px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* ---------- Yazdırma ---------- */
@media print {
  .yan, .ust, .alt-menu, .fab, .tostlar, .eylemler, .btn { display: none !important; }
  .kabuk { display: block; }
  body { background: #fff; }
  .kart { box-shadow: none; break-inside: avoid; }
}

/* ---------- Belge önizleme (yazdırma) ---------- */
.belge-onizleme { position: fixed; inset: 0; z-index: 130; background: rgba(15,15,14,.92); display: flex; flex-direction: column; animation: soluk-gir .18s; }
.belge-arac { display: flex; align-items: center; gap: 8px; padding: 10px 14px; padding-top: calc(10px + env(safe-area-inset-top)); color: #fff; }
.belge-arac b { font-size: 14px; min-width: 0; }
.belge-govde { flex: 1; min-height: 0; display: flex; justify-content: center; padding: 0 12px 12px; }
.belge-govde iframe { width: 100%; max-width: 860px; height: 100%; border: 0; border-radius: 10px; background: #fff; box-shadow: var(--golge-lg); }

/* ---------- Mülk takibi: aylık kira ızgarası ---------- */
.ay-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); gap: 6px; margin-bottom: 14px; }
.ay-kutu { display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 8px 4px; border-radius: 10px; border: 1px solid var(--cizgi); background: var(--yuzey-2); font-size: 12px; color: var(--metin-2); transition: transform .12s, box-shadow var(--gecis); }
.ay-kutu:hover { transform: translateY(-1px); box-shadow: var(--golge); }
.ay-kutu b { font-size: 14px; color: var(--metin); }
.ay-kutu .ay-ad { font-weight: 800; text-transform: uppercase; letter-spacing: .05em; font-size: 10.5px; }
.ay-kutu .ay-durum { font-size: 10.5px; font-weight: 700; }
.ay-kutu.odendi { background: var(--basari-bg); border-color: color-mix(in srgb, var(--basari) 35%, transparent); color: var(--basari); }
.ay-kutu.gecikti { background: var(--tehlike-bg); border-color: color-mix(in srgb, var(--tehlike) 45%, transparent); color: var(--tehlike); }
.ay-kutu.kismi { background: var(--uyari-bg); border-color: color-mix(in srgb, var(--uyari) 40%, transparent); color: var(--uyari); }
.ay-kutu.bu-ay { border: 2px solid var(--altin); }
.ay-kutu.iptal { opacity: .45; text-decoration: line-through; }

/* ---------- Canlı güncelleme şeridi ---------- */
.canli-serit { position: fixed; left: 50%; top: calc(var(--ust-yuk) + 10px + env(safe-area-inset-top)); transform: translateX(-50%); z-index: 45; display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 20px; background: var(--altin); color: #1D1D1B; font-weight: 800; font-size: 13px; box-shadow: var(--golge-lg); animation: tost-gir .25s ease both; white-space: nowrap; }
.canli-serit:hover { background: #F7C95E; }
/* ---------- Mobilde yatay kaymayı engelle ---------- */
.icerik { overflow-x: clip; }
@supports not (overflow-x: clip) { .icerik { overflow-x: hidden; } }
@media (max-width: 960px) {
  input, select, textarea { font-size: 16px !important; }
}