/* InfinityFinans — tasarim dili infinityelearning.com */
body { font-family: 'Inter', system-ui, -apple-system, sans-serif; background: #f7f7f8; color: #1a1a1a; }
.brand-red { color: #c41e3a; }
.bg-brand-red { background: #c41e3a; }
.brand-dark { color: #1a1a1a; }

/* Sidebar */
.sidebar { background: linear-gradient(180deg, #1a1a1a 0%, #2d1015 70%, #3a0a14 100%); min-height: 100vh; }
.sidebar a { display:block; padding:.7rem 1rem; color:#e5e5e5; border-radius:.5rem; transition:all .15s; font-weight:500; font-size:.95rem; }
.sidebar a:hover { background: rgba(196,30,58,.15); color:#fff; }
.sidebar a.active { background: #c41e3a; color:#fff; box-shadow: 0 4px 12px rgba(196,30,58,.4); }
.sidebar .brand { padding:1.25rem 1rem; border-bottom:1px solid rgba(255,255,255,.08); margin-bottom:.75rem; }
.sidebar .brand h1 { color:#fff; font-weight:800; font-size:1.05rem; letter-spacing:-.01em; }
.sidebar .brand .tag { color:#c41e3a; font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; margin-top:.25rem; display:block; }

/* Top bar */
.topbar { background:#fff; border-bottom:1px solid #ececec; padding:.75rem 1.5rem; display:flex; align-items:center; gap:1rem; }
.topbar .breadcrumb { color:#666; font-size:.9rem; flex:1; }
.topbar .breadcrumb strong { color:#1a1a1a; }
.btn { padding:.5rem 1rem; border-radius:.5rem; font-weight:600; font-size:.875rem; border:1px solid transparent; cursor:pointer; transition:all .15s; display:inline-flex; align-items:center; gap:.4rem; }
.btn-primary { background:#c41e3a; color:#fff; }
.btn-primary:hover { background:#a91830; }
.btn-secondary { background:#fff; color:#1a1a1a; border-color:#ddd; }
.btn-secondary:hover { background:#f5f5f5; }
.btn-danger { background:#fff; color:#c41e3a; border-color:#c41e3a; }
.btn-danger:hover { background:#fff5f6; }
.btn-danger-solid { background:#c41e3a; color:#fff; }
.btn-danger-solid:hover { background:#8b0e22; }
.btn-ghost { background:transparent; color:#666; }
.btn-ghost:hover { color:#1a1a1a; background:#f5f5f5; }
.btn:disabled { opacity:.5; cursor:not-allowed; }
.btn-sm { padding:.35rem .7rem; font-size:.8rem; }

/* Cards */
.card { background:#fff; border:1px solid #ececec; border-radius:.75rem; box-shadow: 0 1px 3px rgba(0,0,0,.04); }
.card-header { padding:1rem 1.25rem; border-bottom:1px solid #ececec; display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.card-header h2 { font-weight:700; font-size:1.05rem; }
.card-body { padding:1.25rem; }

/* KPI cards — başlık + rakam + sub hepsi tek satır, taşan kısım ... */
.kpi { background:#fff; border:1px solid #ececec; border-radius:.75rem; padding:1.1rem; transition:all .15s; min-width:0; }
.kpi:hover { box-shadow:0 4px 12px rgba(0,0,0,.06); transform:translateY(-1px); }
.kpi .label { color:#666; font-size:.72rem; font-weight:600; text-transform:uppercase; letter-spacing:.04em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.kpi .value { font-size:1.4rem; font-weight:800; margin-top:.4rem; color:#1a1a1a; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.kpi .delta { font-size:.8rem; font-weight:600; margin-top:.35rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.kpi .delta.up { color:#16a34a; }
.kpi .delta.down { color:#c41e3a; }
.kpi .sub { color:#888; font-size:.72rem; margin-top:.2rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* Inline edit görünür ipucu */
.inline-cell { cursor: cell; position: relative; }
.inline-cell:hover { background: #fff5f6 !important; box-shadow: inset 0 0 0 1px rgba(196,30,58,.2); }
.inline-cell:hover::after { content: '✎'; position: absolute; right: 4px; top: 2px; font-size: .7rem; color: #c41e3a; opacity: .6; pointer-events: none; }

/* Tables — G-1 hizalama · Airtable yoğunluğu (mikro tasarım) */
table.data { width:100%; border-collapse:collapse; font-size:.8125rem; line-height:1.35; }
table.data thead th { background:#fafafa; color:#666; text-align:left; padding:.3rem .6rem; font-weight:600; font-size:.68rem; text-transform:uppercase; letter-spacing:.03em; border-bottom:1px solid #ececec; white-space:nowrap; }
table.data tbody td { padding:.3rem .6rem; border-bottom:1px solid #f3f3f3; vertical-align:middle; }
table.data tbody tr:hover { background:#fafafa; }
table.data .col-money { text-align:right; font-variant-numeric: tabular-nums; white-space:nowrap; }
table.data .col-date { text-align:center; color:#666; white-space:nowrap; }
table.data .col-actions { text-align:right; white-space:nowrap; }

/* Status badges */
.badge { display:inline-flex; align-items:center; padding:.1rem .45rem; border-radius:9999px; font-size:.64rem; font-weight:700; text-transform:uppercase; letter-spacing:.03em; white-space:nowrap; }
.badge-issued { background:#dbeafe; color:#1e40af; }
.badge-paid { background:#d1fae5; color:#047857; }
.badge-partially_paid { background:#fef3c7; color:#92400e; }
.badge-overdue { background:#fee2e2; color:#991b1b; }
.badge-draft { background:#f3f4f6; color:#4b5563; }
.badge-cancelled { background:#e5e7eb; color:#6b7280; text-decoration:line-through; }
.badge-active { background:#d1fae5; color:#047857; }
.badge-prospect { background:#dbeafe; color:#1e40af; }
.badge-churned { background:#fee2e2; color:#991b1b; }
.badge-paused { background:#fef3c7; color:#92400e; }
.badge-pending { background:#fef3c7; color:#92400e; }
.badge-approved { background:#dbeafe; color:#1e40af; }
.badge-aktif { background:#d1fae5; color:#047857; }
.badge-ayrildi { background:#fee2e2; color:#991b1b; }
.badge-beklemede { background:#fef3c7; color:#92400e; }

/* Source badge G-6 */
.source-badge { display:inline-block; padding:.1rem .4rem; border-radius:.25rem; font-size:.65rem; font-weight:600; text-transform:uppercase; letter-spacing:.04em; }
.source-manual { background:#dbeafe; color:#1e40af; }
.source-airtable_migration { background:#fef3c7; color:#92400e; }
.source-automation { background:#e0e7ff; color:#4338ca; }
.source-import { background:#f3e8ff; color:#7e22ce; }
.source-api { background:#cffafe; color:#0e7490; }

/* Forms */
.form-group { margin-bottom:1rem; }
.form-group label { display:block; font-size:.825rem; font-weight:600; color:#444; margin-bottom:.35rem; }
.form-group input, .form-group select, .form-group textarea {
  width:100%; padding:.55rem .75rem; border:1px solid #ddd; border-radius:.5rem; font-size:.9rem;
  font-family: inherit; transition:border-color .15s, box-shadow .15s;
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus {
  outline:none; border-color:#c41e3a; box-shadow:0 0 0 3px rgba(196,30,58,.1);
}
.form-row { display:grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap:1rem; }

/* Empty state G-9 */
.empty { padding:3rem 1.5rem; text-align:center; }
.empty .icon { font-size:3rem; margin-bottom:.75rem; opacity:.4; }
.empty h3 { font-weight:700; font-size:1.1rem; margin-bottom:.4rem; }
.empty p { color:#666; font-size:.9rem; margin-bottom:1rem; }

/* Sayfa girişi — kullanıcıya "bu sayfa ne için?" anlatımı */
.page-intro { background: linear-gradient(135deg, #fff5f6 0%, #fff 100%); border:1px solid #fce4e6; border-left:4px solid #c41e3a; padding:1.1rem 1.4rem; border-radius:.6rem; margin-bottom:1.25rem; }
.page-intro h1 { font-size:1.35rem; font-weight:800; color:#1a1a1a; margin-bottom:.35rem; letter-spacing:-.01em; }
.page-intro p { color:#555; font-size:.92rem; line-height:1.5; }
.page-intro p strong { color:#1a1a1a; }
.page-intro .term-row { margin-top:.7rem; display:flex; flex-wrap:wrap; gap:.5rem; }
.page-intro .term { background:#fff; border:1px solid #f3d2d6; padding:.25rem .6rem; border-radius:9999px; font-size:.72rem; color:#7a1022; font-weight:500; }
.page-intro .term strong { color:#c41e3a; margin-right:.3rem; }

/* CompletionCallout G-10 */
.callout { padding:1rem 1.25rem; border-left:4px solid; border-radius:.5rem; margin-bottom:1rem; }
.callout-success { background:#ecfdf5; border-color:#10b981; color:#047857; }
.callout-warning { background:#fffbeb; border-color:#f59e0b; color:#92400e; }
.callout-danger { background:#fef2f2; border-color:#c41e3a; color:#991b1b; }
.callout-info { background:#eff6ff; border-color:#3b82f6; color:#1e3a8a; }

/* Modal */
.modal-backdrop { position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:50; display:flex; align-items:center; justify-content:center; padding:1rem; }
.modal { background:#fff; border-radius:.75rem; max-width:500px; width:100%; padding:1.5rem; }
.modal h3 { font-weight:700; font-size:1.2rem; margin-bottom:.75rem; }

/* Banner G-8 */
.context-banner { background: linear-gradient(90deg, #c41e3a 0%, #a91830 100%); color:#fff; padding:.75rem 1.25rem; border-radius:.5rem; margin-bottom:1rem; display:flex; align-items:center; gap:1rem; }

/* Pagination + counts */
.list-meta { color:#666; font-size:.825rem; padding:.5rem 0; }

/* Loading */
.spinner { border:3px solid #f3f3f3; border-top:3px solid #c41e3a; border-radius:50%; width:24px; height:24px; animation:spin .8s linear infinite; }
@keyframes spin { 0% { transform:rotate(0); } 100% { transform:rotate(360deg); } }
.loading { display:flex; align-items:center; justify-content:center; padding:2rem; gap:.75rem; color:#666; }

/* Sync status indicator */
.sync-status { font-size:.75rem; color:#666; display:flex; align-items:center; gap:.4rem; }
.sync-dot { width:8px; height:8px; border-radius:50%; background:#10b981; }
.sync-dot.stale { background:#f59e0b; }
.sync-dot.error { background:#c41e3a; }

/* Responsive */
@media (max-width: 768px) {
  .sidebar { display:none; }
  .form-row { grid-template-columns: 1fr; }
}
