/* ===========================================================================
   Yönetim Paneli (serkangungor.online/sg/admin) — Agents projesiyle birebir aynı tasarım (2026-09-29):
   metalik grafit + fırçalanmış gümüş sidebar (DashboardShell.tsx), grafit giriş paneli (AuthLayout.tsx +
   AuthWaves.tsx), glass-card / glass-mesh-bg, §4.8.2 başlık bandı (sol dikey şerit YOK), zinc grafit CTA'lar.
   SADECE AÇIK TEMA. Değerler Agents/frontend/app/globals.css ve bileşenlerden birebir alındı.
   =========================================================================== */
:root {
  color-scheme: only light;
  --background: #ffffff;
  --foreground: #0a0a0a;          /* oklch(0.145 0 0) */
  --card: #ffffff;
  --muted: #f5f5f5;               /* oklch(0.97 0 0) */
  --muted-foreground: #6b6b6b;    /* oklch(0.5 0 0) */
  --border: #e5e5e5;              /* oklch(0.922 0 0) */
  --primary: #34373e;             /* oklch(0.32 0.01 265) — grafit */
  --ring: rgba(82, 85, 93, .5);   /* oklch(0.45 0.01 265 / .5) */
  --radius: 10px;                 /* 0.625rem */
  --glass-bg: rgba(255, 255, 255, .55);
  --glass-border: rgba(10, 10, 10, .10);
  --zinc-100: #f4f4f5; --zinc-300: #d4d4d8; --zinc-400: #a1a1aa; --zinc-500: #71717a;
  --zinc-600: #52525b; --zinc-700: #3f3f46; --zinc-800: #27272a; --zinc-900: #18181b;
  --brushed: repeating-linear-gradient(90deg, rgba(255, 255, 255, .025) 0 1px, transparent 1px 3px),
             radial-gradient(120% 50% at 0% 0%, rgba(255, 255, 255, .22), transparent 60%);
  --silver-text: linear-gradient(180deg, #ffffff 0%, #e4e7ec 45%, #a9b0ba 100%);
  --glass-ring: rgba(255, 255, 255, .75);
  /* Agents CTA / başlık ikonu: zinc-600 → zinc-700 → zinc-900 */
  --grad-signature: linear-gradient(90deg, var(--zinc-600), var(--zinc-700) 50%, var(--zinc-900));
  --grad-avatar: linear-gradient(135deg, var(--zinc-600), var(--zinc-700) 50%, var(--zinc-900));
  --ease: cubic-bezier(0, 0, .2, 1);
  --font: "Geist", system-ui, -apple-system, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { height: 100%; }
body.cs { margin: 0; font-family: var(--font); font-size: 14px; color: var(--foreground); background: var(--background); -webkit-font-smoothing: antialiased; }
.ic { width: 16px; height: 16px; flex: 0 0 auto; }
.cs-muted { color: var(--muted-foreground); }
a { color: var(--primary); }

/* ---- Kabuk: sidebar + header + ana alan ------------------------------------------ */
.cs-shell { display: flex; height: 100vh; }
.cs-side {
  /* .graphite-sidebar + .graphite-brushed-sheen (::after) + üst/sağ ışık çizgileri */
  position: relative; display: flex; flex-direction: column; width: 240px; flex: 0 0 240px;
  background: linear-gradient(160deg, #4a4e57 0%, #34373e 38%, #23252a 100%);
  color: #fff;
}
.cs-side::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: var(--brushed); }
.cs-side::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 1px; z-index: 1; pointer-events: none; background: linear-gradient(90deg, rgba(255, 255, 255, .30), rgba(255, 255, 255, .10), transparent); }
.cs-side__edge { position: absolute; inset: 0 0 0 auto; width: 1px; pointer-events: none; background: linear-gradient(180deg, rgba(255, 255, 255, .20), rgba(255, 255, 255, .06), rgba(255, 255, 255, .12)); }
.cs-side > *:not(.cs-side__edge) { position: relative; z-index: 1; }
.cs-side__brand { display: flex; align-items: center; gap: 10px; height: 56px; flex: 0 0 56px; padding: 0 20px; border-bottom: 1px solid rgba(255, 255, 255, .08); }
.cs-side__brand img { width: 30px; height: 30px; flex: 0 0 auto; }
.cs-side__brand span { padding: .2em 0; font-size: 15px; font-weight: 700; letter-spacing: -.01em; line-height: 1; background: var(--silver-text); -webkit-background-clip: text; background-clip: text; color: transparent; white-space: nowrap; }
.cs-side__nav { flex: 1; overflow-y: auto; padding: 12px; display: flex; flex-direction: column; gap: 2px; }
.cs-side__group { margin: 12px 0 0; padding: 0 12px 4px; font-size: 10px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--zinc-400); }
.cs-side__group:first-child { margin-top: 0; }
.cs-side__link {
  position: relative; display: flex; align-items: center; gap: 12px;
  padding: 8px 12px; border-radius: 10px;
  color: var(--zinc-300); font-size: 14px; font-weight: 500; text-decoration: none;
  transition: all .15s var(--ease);
}
.cs-side__link .ic { color: var(--zinc-300); }
.cs-side__link:hover { background: rgba(255, 255, 255, .08); color: #fff; }
.cs-side__link:hover .ic { color: #fff; }
/* Aktif: parlak gümüş cam + solda gümüş gösterge */
.cs-side__link.is-active {
  background: linear-gradient(90deg, rgba(255, 255, 255, .28), rgba(255, 255, 255, .10));
  color: #fff;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12), inset 0 1px 0 rgba(255, 255, 255, .35), 0 4px 14px -6px rgba(0, 0, 0, .6);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
}
.cs-side__link.is-active::before {
  content: ""; position: absolute; left: 0; top: 50%; width: 3px; height: 20px; transform: translateY(-50%);
  border-radius: 0 999px 999px 0; background: linear-gradient(180deg, #fff, var(--zinc-300), var(--zinc-500));
  box-shadow: 0 0 8px rgba(255, 255, 255, .45);
}
.cs-side__link.is-active .ic { color: #fff; }
.cs-side__link:focus-visible { outline: none; box-shadow: 0 0 0 2px rgba(255, 255, 255, .5); }
.cs-side__badge { margin-left: auto; min-width: 22px; padding: 1px 7px; border-radius: 999px; background: rgba(255, 255, 255, .14); color: var(--zinc-100); font-size: 11px; font-weight: 700; text-align: center; }
.cs-side__badge.is-hot { background: linear-gradient(90deg, #f43f5e, #e11d48); color: #fff; }
.cs-side__sep { height: 1px; margin: 12px 0 8px; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .15), transparent); }
.cs-user { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-top: 1px solid rgba(255, 255, 255, .08); }
.cs-user__av { display: grid; place-items: center; flex: 0 0 auto; width: 36px; height: 36px; border-radius: 50%; background: linear-gradient(135deg, var(--zinc-400), var(--zinc-700)); box-shadow: 0 0 0 1px rgba(255, 255, 255, .3); color: #fff; font-size: 12px; font-weight: 700; object-fit: cover; }
.cs-user--link { text-decoration: none; transition: background .15s; }
.cs-user--link:hover, .cs-user--link:focus-visible { background: rgba(255, 255, 255, .06); outline: none; }
.cs-user b { display: block; font-size: 14px; font-weight: 500; color: var(--zinc-100); }
.cs-user small { display: block; font-size: 11px; color: var(--zinc-400); }

/* ---- Alt menü şeridi — Agents DynamicSubSidebar birebir (.graphite-subbar, 64px, ikon + ipucu) ---- */
.cs-subside {
  position: relative; z-index: 30; display: flex; flex-direction: column; align-items: center; width: 64px; flex: 0 0 64px;
  background: linear-gradient(180deg, #3a3d44, #26282d 60%, #1b1c20);
  box-shadow: inset -1px 0 0 rgba(0, 0, 0, .5);
}
.cs-subside::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 1px; background: rgba(255, 255, 255, .10); pointer-events: none; }
.cs-subside::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, rgba(0, 0, 0, .30), transparent 50%, transparent); }
.cs-subside__top { position: relative; z-index: 1; width: 100%; height: 56px; flex: 0 0 56px; }
.cs-subside__nav { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 4px; width: 100%; padding: 12px; }
.cs-subside__link {
  position: relative; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px;
  color: var(--zinc-300); text-decoration: none; transition: all .15s var(--ease);
}
.cs-subside__link .ic { width: 18px; height: 18px; }
.cs-subside__link:hover { background: rgba(255, 255, 255, .08); color: #fff; }
.cs-subside__link.is-active {
  background: linear-gradient(90deg, rgba(255, 255, 255, .28), rgba(255, 255, 255, .10)); color: #fff;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12), inset 0 1px 0 rgba(255, 255, 255, .35), 0 4px 14px -6px rgba(0, 0, 0, .6);
}
.cs-subside__link:focus-visible { outline: none; box-shadow: 0 0 0 2px rgba(255, 255, 255, .5); }
.cs-subside__tip {
  position: absolute; left: 100%; top: 50%; z-index: 50; margin-left: 8px; transform: translateY(-50%);
  padding: 4px 10px; border: 1px solid rgba(255, 255, 255, .15); border-radius: 6px; white-space: nowrap;
  background: rgba(24, 24, 27, .9); color: #fff; font-size: 12px; font-weight: 500;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .15s;
}
.cs-subside__link:hover .cs-subside__tip, .cs-subside__link:focus-visible .cs-subside__tip { opacity: 1; visibility: visible; }
@media (max-width: 768px) { .cs-subside { display: none; } }

.cs-col { display: flex; flex: 1; flex-direction: column; min-width: 0; }
.cs-header { display: flex; align-items: center; gap: 12px; height: 56px; flex: 0 0 56px; padding: 0 24px; border-bottom: 1px solid var(--border); background: var(--card); }
.cs-header h1 { flex: 1; margin: 0; font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cs-header__right { margin: 0; display: flex; align-items: center; gap: 12px; }
.cs-header .cs-header__menu { display: none; }
.cs-iconbtn { display: inline-grid; place-items: center; width: 32px; height: 32px; border: 0; border-radius: 6px; background: transparent; color: var(--muted-foreground); cursor: pointer; transition: background-color .15s, color .15s; }
.cs-iconbtn:hover { background: var(--muted); color: var(--foreground); }
.cs-iconbtn--logout:hover { background: rgba(239, 68, 68, .10); color: #dc2626; }
.cs-iconbtn:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--ring); }

/* glass-mesh-bg + bg-muted/30 */
.cs-main {
  flex: 1; min-height: 0; overflow-y: auto; padding: 24px;
  display: flex; flex-direction: column; gap: 20px;
  background-color: rgba(245, 245, 245, .3);
  background-image:
    radial-gradient(at 12% 18%, color-mix(in oklab, #94a3b8 12%, transparent) 0, transparent 45%),
    radial-gradient(at 88% 12%, color-mix(in oklab, #a1a1aa 10%, transparent) 0, transparent 50%),
    radial-gradient(at 70% 90%, color-mix(in oklab, #64748b 7%, transparent) 0, transparent 55%),
    radial-gradient(at 0% 100%, color-mix(in oklab, #38bdf8 4%, transparent) 0, transparent 50%);
  background-attachment: fixed;
}

/* ---- glass-card + §4.8.2 başlık bandı ----------------------------------------------- */
.cs-card {
  padding: 20px;
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  border-radius: 16px;
  box-shadow: inset 0 1px 0 var(--glass-ring), 0 20px 25px -5px rgba(0, 0, 0, .10), 0 8px 10px -6px rgba(0, 0, 0, .10);
  -webkit-backdrop-filter: blur(22px); backdrop-filter: blur(22px);
}
.cs-card__head {
  position: relative; overflow: hidden;
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  margin: -20px -20px 16px; padding: 20px 20px 12px;
  border-bottom: 1px solid var(--border); border-radius: 16px 16px 0 0;
  background: var(--card);
}
/* Agents: başlık bantlarında sol dikey şerit YOK (kullanıcı kararı 2026-09-28) */
.cs-card__stripe { display: none; }
.cs-card__id { display: flex; align-items: center; gap: 12px; min-width: 0; }
.cs-card__id h2 { margin: 0; font-size: 18px; font-weight: 700; letter-spacing: -.02em; }
.cs-card__id p { margin: 2px 0 0; font-size: 12px; color: var(--muted-foreground); }
.cs-card__actions { display: flex; align-items: center; gap: 8px; }
.cs-avatar { display: grid; place-items: center; width: 44px; height: 44px; flex: 0 0 auto; border-radius: 16px; background: var(--grad-avatar); color: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, .05), 0 0 0 1px rgba(255, 255, 255, .20); }
.cs-avatar .ic { width: 20px; height: 20px; }
.cs-avatar--lg { width: 52px; height: 52px; }

/* ---- Düğmeler (shadcn Button: sm h-8, default h-9, rounded-md) ------------------------- */
.cs-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  height: 36px; padding: 0 14px;
  border: 1px solid transparent; border-radius: 10px;
  font: 500 14px var(--font); white-space: nowrap; cursor: pointer; text-decoration: none;
  transition: filter .15s, background-color .15s, color .15s, border-color .15s, box-shadow .15s;
}
.cs-btn--sm { height: 32px; padding: 0 10px; font-size: 13px; }
.cs-btn--sm .ic { width: 14px; height: 14px; }
.cs-btn--block { width: 100%; height: 40px; }
.cs-btn--primary { border: 0; background: var(--grad-signature); color: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, .05); }
.cs-btn--primary:hover { color: #fff; }
.cs-btn--primary:hover { filter: brightness(1.1); }
.cs-btn--outline { background: #fff; border-color: var(--border); color: var(--foreground); box-shadow: 0 1px 2px rgba(0, 0, 0, .05); }
.cs-btn--outline:hover { background: var(--muted); }
.cs-btn--danger { background: transparent; color: #dc2626; }
.cs-btn--danger:hover { background: rgba(239, 68, 68, .10); }
.cs-btn:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--ring); }

/* Segment (Yayında / Reddedilen) */
.cs-seg { display: inline-flex; padding: 3px; border-radius: 8px; background: var(--muted); }
.cs-seg a { padding: 5px 12px; border-radius: 6px; color: var(--muted-foreground); font-size: 13px; font-weight: 500; text-decoration: none; }
.cs-seg a.is-on { background: #fff; color: var(--foreground); box-shadow: 0 1px 2px rgba(0, 0, 0, .08); }

/* Rozetler (STANDARD semantik: Açık=rose, İşlemde=amber, Çözüldü=emerald) */
.cs-chip { display: inline-flex; align-items: center; gap: 4px; padding: 1px 8px; border-radius: 6px; font-size: 11.5px; font-weight: 600; white-space: nowrap; border: 1px solid transparent; }
.cs-chip--amber { background: rgba(245, 158, 11, .12); color: #b45309; border-color: rgba(245, 158, 11, .25); }
.cs-chip--emerald { background: rgba(16, 185, 129, .10); color: #047857; border-color: rgba(16, 185, 129, .22); }
.cs-chip--sky { background: rgba(14, 165, 233, .10); color: #0369a1; border-color: rgba(14, 165, 233, .22); }
.cs-chip--violet { background: rgba(82, 82, 91, .10); color: var(--zinc-700); border-color: rgba(82, 82, 91, .22); }

/* ---- Liste satırları ------------------------------------------------------------------- */
.cs-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.cs-row { padding: 16px; border: 1px solid var(--border); border-radius: 12px; background: #fff; transition: box-shadow .2s var(--ease); }
.cs-row:hover { box-shadow: 0 4px 12px -2px rgba(0, 0, 0, .08); }
.cs-row__top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cs-row__top strong { font-size: 15px; font-weight: 600; }
.cs-row__top time { margin-left: auto; font-size: 12px; color: var(--muted-foreground); }
.cs-row__meta { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; margin: 6px 0 0; font-size: 12.5px; color: var(--muted-foreground); }
.cs-row__meta .ic { width: 13px; height: 13px; }
.cs-row__meta a { color: var(--primary); text-decoration: none; }
.cs-row__meta a:hover { text-decoration: underline; }
.cs-row__body { margin: 10px 0 12px; font-size: 14px; line-height: 1.6; color: #262626; white-space: pre-line; overflow-wrap: anywhere; }
.cs-actions { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: 0; }
.cs-actions .cs-btn--danger { margin-left: auto; }
.cs-empty { display: grid; justify-items: center; gap: 6px; padding: 36px 16px; color: var(--muted-foreground); text-align: center; }
.cs-empty .ic { width: 28px; height: 28px; color: #a3a3a3; }
.cs-empty p { margin: 0; }

/* ---- Formlar ---------------------------------------------------------------------------- */
.cs-form { display: grid; gap: 14px; padding: 16px; border: 1px solid var(--border); border-radius: 12px; background: #fff; }
.cs-field { display: grid; gap: 6px; font-size: 13px; font-weight: 500; }
.cs-field input, .cs-field textarea, .cs-field select {
  width: 100%; min-height: 36px; padding: 8px 12px;
  border: 1px solid var(--border); border-radius: 10px; background: rgba(255, 255, 255, .7);
  font: 400 14px var(--font); color: var(--foreground);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
  transition: border-color .15s, box-shadow .15s;
}
.cs-field textarea { resize: vertical; line-height: 1.5; }
.cs-field input:focus, .cs-field textarea:focus, .cs-field select:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px var(--ring); }

.cs-alert { display: flex; align-items: center; gap: 8px; margin: 0; padding: 10px 14px; border-radius: 10px; font-size: 13.5px; font-weight: 500; }
.cs-alert--ok { background: rgba(16, 185, 129, .10); color: #047857; border: 1px solid rgba(16, 185, 129, .25); }
.cs-alert--err { background: rgba(244, 63, 94, .08); color: #be123c; border: 1px solid rgba(244, 63, 94, .25); }


/* ---- Tablolar ----------------------------------------------------- */
.cs-table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: 12px; background: #fff; }
.cs-table { width: 100%; border-collapse: collapse; font-size: 13.5px; min-width: 560px; }
.cs-table th, .cs-table td { padding: 10px 14px; text-align: left; border-bottom: 1px solid var(--border); }
.cs-table th { background: var(--muted); font-size: 12px; font-weight: 600; color: var(--muted-foreground); }
.cs-table tr:last-child td { border-bottom: 0; }
.cs-table:not(.cs-table--log) td:not(:first-child), .cs-table:not(.cs-table--log) th:not(:first-child) { text-align: right; font-variant-numeric: tabular-nums; }
.cs-table a { color: var(--primary); font-weight: 500; text-decoration: none; }
.cs-table tr.is-warn td { background: rgba(245, 158, 11, .07); color: #92400e; }
.cs-table code { font-size: 12px; white-space: pre-wrap; word-break: break-word; }
.cs-sys { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.cs-sys li { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 14px; border: 1px solid var(--border); border-radius: 10px; background: #fff; font-size: 13.5px; }
.cs-sys__mark { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; color: #fff; font-size: 12px; font-weight: 800; }
.cs-sys__mark .ic { width: 13px; height: 13px; }
.cs-sys li.is-ok .cs-sys__mark { background: #10b981; }
.cs-sys li.is-warn { border-color: rgba(245, 158, 11, .35); background: rgba(245, 158, 11, .06); }
.cs-sys li.is-warn .cs-sys__mark { background: #f59e0b; }

/* ---- Giriş ekranı — Agents AuthLayout.tsx birebir (5fr / 7fr; sol grafit panel) ------------------ */
.cs-auth { display: grid; grid-template-columns: 5fr 7fr; min-height: 100vh; font-family: "Roboto", system-ui, sans-serif; }
.cs-auth__brand {
  position: relative; isolation: isolate; overflow: hidden;
  display: grid; grid-template-rows: 1fr auto 1fr;           /* .auth-panel-grid */
  background: linear-gradient(160deg, #1b1c20 0%, #121316 45%, #09090b 100%);   /* .graphite-auth-panel */
  color: #fff;
}
.cs-auth__sheen { position: absolute; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .012) 0 1px, transparent 1px 3px),
              radial-gradient(110% 40% at 0% 0%, rgba(255, 255, 255, .06), transparent 60%); }   /* .graphite-auth-sheen */
.cs-auth__glow { position: absolute; width: 320px; height: 320px; border-radius: 50%; filter: blur(64px); pointer-events: none; }
.cs-auth__glow--1 { right: -96px; top: 33%; background: rgba(255, 255, 255, .05); }
.cs-auth__glow--2 { bottom: -112px; left: 25%; background: rgba(0, 0, 0, .40); }
.cs-auth__waves { position: absolute; inset: 0; pointer-events: none;
  -webkit-mask-image: radial-gradient(130% 90% at 100% 100%, #000 45%, transparent 95%);
  mask-image: radial-gradient(130% 90% at 100% 100%, #000 45%, transparent 95%); }                   /* .auth-pattern */
.cs-auth__waves svg { display: block; width: 100%; height: 100%; }
.cs-auth__edge { position: absolute; inset: 0 0 0 auto; width: 1px; pointer-events: none; background: linear-gradient(180deg, rgba(255, 255, 255, .25), rgba(255, 255, 255, .10), rgba(255, 255, 255, .05)); }
/* Gümüş metin: dikey dolgu Ö/İ/Ü noktaları kutudan taşıp boyanmadan kalmasın diye (negatif margin yerleşimi korur) */
.cs-silver { padding: .2em 0; margin: -.2em 0; background: var(--silver-text); -webkit-background-clip: text; background-clip: text; color: transparent; }
.cs-auth__top { position: relative; align-self: start; padding: 48px 48px 0; }
.cs-auth__logo { display: inline-flex; align-items: center; gap: 12px; }
.cs-auth__logo img { width: 34px; height: 34px; flex: 0 0 auto; }
.cs-auth__name { font-size: 18px; font-weight: 700; line-height: 1; letter-spacing: -.025em; }
.cs-auth__div { width: 1px; height: 16px; background: rgba(255, 255, 255, .15); }
.cs-auth__tag { transform: translateY(1px); font-size: 12px; font-weight: 500; line-height: 1; letter-spacing: .05em; text-transform: uppercase; }
.cs-auth__pitch { position: relative; padding: 0 48px; }
.cs-auth__pitch h1 { margin: 0; max-width: 42rem; font-size: min(36px, calc((41.6667vw - 96px) / 13.2)); font-weight: 900; line-height: 1.25; letter-spacing: -.025em; white-space: nowrap; }
.cs-auth__pitch p { margin: 20px 0 0; max-width: 42rem; font-size: 14px; line-height: 1.625; color: var(--zinc-300); }
.cs-auth__mpitch { display: none; }
.cs-auth__foot { position: relative; align-self: end; display: flex; align-items: center; justify-content: space-between; padding: 24px 48px; border-top: 1px solid rgba(255, 255, 255, .10); font-size: 11px; line-height: 1; }
.cs-auth__main { display: flex; align-items: center; justify-content: center; padding: 40px 48px; background: var(--card); }
/* Form: max-w-md, gap-4; başlık text-2xl bold; etiket xs medium muted; alan rounded-lg px-4 py-2.5 */
.cs-auth__form { display: flex; flex-direction: column; gap: 16px; width: 100%; max-width: 448px; }
.cs-auth__form h2 { margin: 0; font-size: 24px; font-weight: 700; line-height: 1.33; }
.cs-auth__form .cs-muted { margin: -8px 0 0; font-size: 14px; line-height: 1.5; }
.cs-auth__form .cs-field { gap: 4px; font-size: 12px; font-weight: 500; color: var(--muted-foreground); }
.cs-auth__form .cs-field input { min-height: 0; padding: 10px 16px; border-radius: 10px; background: var(--card); font-size: 14px; box-shadow: none; }
.cs-auth__form .cs-field input:focus { border-color: var(--zinc-500); box-shadow: 0 0 0 2px rgba(113, 113, 122, .2); }
.cs-auth__form .cs-field input.cs-code { font-size: 22px; }
/* Giriş düğmesi: .graphite-button + iç ışık + ince halka */
.cs-auth__form .cs-btn--primary {
  height: auto; margin-top: 4px; padding: 10px 16px; border-radius: 10px;
  background: linear-gradient(160deg, #4a4e57 0%, #34373e 45%, #23252a 100%);
  font-size: 14px; font-weight: 600;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 4px 12px -4px rgba(0, 0, 0, .45), inset 0 0 0 1px rgba(255, 255, 255, .1);
}
.cs-auth__form .cs-btn--primary:hover { filter: brightness(1.25); }

/* ---- Duyarlı ---------------------------------------------------------------------------------- */
@media (max-width: 900px) {
  .cs-side { position: fixed; inset: 0 auto 0 0; z-index: 60; transform: translateX(-100%); transition: transform .22s var(--ease); }
  .cs-side.is-open { transform: none; box-shadow: 24px 0 48px rgba(0, 0, 0, .25); }
  .cs-scrim { position: fixed; inset: 0; z-index: 55; background: rgba(0, 0, 0, .25); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); }
  .cs-header { padding: 0 12px; }
  .cs-header .cs-header__menu { display: inline-grid; }
  .cs-main { padding: 14px; }
  .cs-card { padding: 16px; }
  .cs-card__head { margin: -16px -16px 14px; padding: 16px 16px 12px; }
  .cs-row__top time { margin-left: 0; width: 100%; }
  .cs-auth { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
  .cs-auth__brand { display: block; }
  .cs-auth__top { padding: 32px 32px 0; }
  .cs-auth__pitch { display: none; }
  .cs-auth__mpitch { display: block !important; position: relative; padding: 24px 32px; margin: 0; font-size: 14px; font-weight: 500; }
  .cs-auth__waves { display: none; }
  .cs-auth__foot { padding: 20px 32px; }
  .cs-auth__main { padding: 40px 24px; }
}
@media (prefers-reduced-motion: reduce) { .cs-side, .cs-row, .cs-btn { transition: none; } }

/* ===========================================================================
   Genişletmeler: 2FA, hesap, yazı editörü, site metinleri, mesajlar
   =========================================================================== */
.cs-btn--link { height: auto; padding: 4px 0; background: none; border: 0; color: var(--muted-foreground); font-size: 13px; text-decoration: underline; text-underline-offset: 3px; box-shadow: none; }
.cs-btn--link:hover { color: var(--foreground); }
.cs-code { font-family: "Geist Mono", ui-monospace, monospace !important; font-size: 22px !important; letter-spacing: .35em; text-align: center; }
.cs-mono { font-family: "Geist Mono", ui-monospace, monospace; }
.cs-header__ip { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 999px; background: var(--muted); color: var(--muted-foreground); font-size: 12px; font-weight: 500; white-space: nowrap; }
.cs-header__ip .ic { width: 14px; height: 14px; }
.cs-side__brand img { background: transparent; box-shadow: none; border-radius: 0; }
.cs-side__link.is-off { opacity: .35; pointer-events: none; }
.cs-card--warn { border-color: rgba(245, 158, 11, .45); box-shadow: 0 0 0 4px rgba(245, 158, 11, .12), 0 20px 25px -5px rgba(0, 0, 0, .10); }
.cs-grid2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px; }
.cs-grid2 .cs-form p { margin: 0; }
.cs-form--inline { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); align-items: end; margin-top: 12px; }
.cs-list--compact { gap: 8px; }
.cs-row--compact { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 10px 14px; }
.cs-row--compact > span { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cs-row--new { border-left: 3px solid var(--primary); }
.cs-check { display: flex; align-items: flex-start; gap: 8px; font-size: 13.5px; cursor: pointer; }
.cs-check input { margin-top: 3px; accent-color: var(--primary); }

/* 2FA kurulumu */
.cs-steps { margin: 0 0 16px; padding-left: 20px; display: grid; gap: 6px; font-size: 14px; line-height: 1.55; }
.cs-2fa { display: grid; grid-template-columns: auto 1fr; gap: 24px; align-items: start; }
.cs-qr { width: 216px; height: 216px; padding: 12px; border: 1px solid var(--border); border-radius: 12px; background: #fff; }
.cs-qr img, .cs-qr svg { display: block; width: 100%; height: 100%; }
.cs-secret { display: block; padding: 10px 12px; border-radius: 8px; background: var(--muted); font: 600 15px "Geist Mono", ui-monospace, monospace; letter-spacing: .08em; word-break: break-all; user-select: all; }
.cs-trust { margin: 0; padding: 12px 14px; border: 1px solid var(--border); border-radius: 10px; display: grid; gap: 8px; }
.cs-trust legend { padding: 0 6px; font-size: 13px; font-weight: 600; }
.cs-trust p { margin: 0; font-size: 13px; }
.cs-codes { margin: 0 0 14px; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.cs-codes li { padding: 10px; border: 1px dashed #d4d4d4; border-radius: 8px; background: #fff; text-align: center; font: 600 15px "Geist Mono", ui-monospace, monospace; letter-spacing: .06em; }

.cs-field small { font-weight: 400; color: var(--muted-foreground); }

/* Site metinleri */
.cs-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }
.cs-chipnav { padding: 6px 12px; border: 1px solid var(--border); border-radius: 999px; background: #fff; color: var(--foreground); font-size: 13px; font-weight: 500; text-decoration: none; }
.cs-chipnav small { color: var(--muted-foreground); }
.cs-chipnav:hover { background: var(--muted); }
.cs-chipnav.is-on { border-color: transparent; background: var(--grad-signature); color: #fff; }
.cs-chipnav.is-on small { color: rgba(255, 255, 255, .7); }
.cs-texts { display: grid; gap: 12px; }
.cs-text { margin: 0; padding: 14px; border: 1px solid var(--border); border-radius: 12px; background: #fff; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.cs-text legend { padding: 0 6px; font-size: 12px; }
.cs-text legend code { color: var(--muted-foreground); }
.cs-sticky-save { position: sticky; bottom: -24px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 4px -20px -20px; padding: 14px 20px; border-top: 1px solid var(--border); border-radius: 0 0 16px 16px; background: rgba(255, 255, 255, .92); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.cs-sticky-save .cs-muted { font-size: 12.5px; }

@media (max-width: 900px) {
  .cs-header__ip { display: none; }
  .cs-2fa { grid-template-columns: 1fr; justify-items: center; }
  .cs-2fa__form { width: 100%; }
  .cs-text { grid-template-columns: 1fr; }
  .cs-sticky-save { bottom: -14px; margin: 4px -16px -16px; }
}

/* Hesap → Profil */
.cs-profile { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.cs-profile__av { display: grid; place-items: center; flex: 0 0 auto; width: 96px; height: 96px; border-radius: 50%; object-fit: cover; background: linear-gradient(135deg, var(--zinc-400), var(--zinc-700)); color: #fff; font-size: 30px; font-weight: 700; box-shadow: 0 0 0 4px #fff, 0 0 0 5px var(--border); }
.cs-profile__fields { display: grid; gap: 14px; flex: 1 1 280px; }


/* adlibilisim.online — hizmetler tablosu ve formlar */
.cs-form--grid { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); align-items: end; }
.cs-form--grid .cs-field--wide, .cs-form--grid > .cs-check { grid-column: 1 / -1; }
.cs-table--services td { vertical-align: middle; }
.cs-table--services td:first-child b { font-weight: 600; }
.cs-table--services td small { display: block; margin-top: 2px; font-size: 12px; color: var(--muted-foreground); }
.cs-table--services tr.is-off td { color: var(--muted-foreground); }
.cs-actions--end { justify-content: flex-end; flex-wrap: nowrap; }
.cs-actions--end .cs-btn--danger { margin-left: 0; }
.cs-chip--rose { background: rgba(244, 63, 94, .10); color: #be123c; border-color: rgba(244, 63, 94, .20); }
/* adlibilisim.online — talep ayrıntısı */
.cs-num { width: 90px; min-height: 32px; padding: 4px 8px; border: 1px solid var(--border); border-radius: 8px; font: 500 13.5px var(--font); text-align: right; font-variant-numeric: tabular-nums; }
.cs-num--wide { width: 130px; }
.cs-num:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px var(--ring); }
.cs-table tfoot td { background: var(--muted); font-size: 13px; }
.cs-table tfoot td:first-child { text-align: right; color: var(--muted-foreground); }
.cs-link { color: var(--foreground); text-decoration: none; font-family: "Geist Mono", ui-monospace, monospace; }
.cs-link:hover { text-decoration: underline; }
form.cs-card > .cs-form { margin-top: 14px; }

/* Alan yüksekliği eşitleme: tarayıcı <select> ve tarih alanını yazı kutusundan 2px uzun çiziyor (38 / 36).
   İçerik alanındaki tüm tek satırlı alanlar 38px (giriş ekranı .cs-auth__form kendi ölçüsünde kalır). */
.cs-main .cs-field input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.cs-main .cs-field select { height: 38px; min-height: 38px; padding-top: 0; padding-bottom: 0; line-height: 36px; }
.cs-main .cs-field select { padding-right: 32px; }
.cs-main .cs-field input[type="file"] { min-height: 38px; }

/* adlibilisim.online — talep dosya kartı */
.cs-dossier { padding: 0; overflow: hidden; flex-shrink: 0; }   /* overflow:hidden esnek sütunda kartı küçülebilir yapar → sıkışmasın */
.cs-dossier__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 20px; border-bottom: 1px solid var(--border); background: var(--card); }
.cs-dossier__title { display: flex; align-items: center; gap: 14px; min-width: 0; }
.cs-dossier__title .cs-avatar { width: 52px; height: 52px; }
.cs-dossier__eyebrow { margin: 0; font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--muted-foreground); }
.cs-dossier__title h2 { margin: 2px 0 6px; font-size: 22px; font-weight: 700; letter-spacing: -.01em; }
.cs-dossier__sub { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 0; font-size: 12.5px; color: var(--muted-foreground); }
.cs-dossier__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 12px; padding: 16px 20px 0; }
.cs-dossier__tile { display: flex; flex-direction: column; gap: 10px; padding: 14px 16px; border: 1px solid var(--border); border-radius: 12px; background: #fff; }
.cs-dossier__tile--money { background: linear-gradient(180deg, #fff, rgba(16, 185, 129, .05)); }
.cs-dossier__label { display: flex; align-items: center; gap: 6px; margin: 0; font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--muted-foreground); }
.cs-dossier__label .ic { width: 14px; height: 14px; }
.cs-dossier__main { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0; font-size: 16px; font-weight: 600; }
.cs-dossier__amount { margin: 0; font-size: 22px; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.cs-dossier__amount small { margin-left: 6px; font-size: 12px; font-weight: 500; color: var(--muted-foreground); letter-spacing: 0; }
.cs-dossier__dl { display: grid; gap: 8px; margin: 0; }
.cs-dossier__dl > div { display: grid; gap: 1px; }
.cs-dossier__dl dt { font-size: 11.5px; color: var(--muted-foreground); }
.cs-dossier__dl dd { margin: 0; font-size: 13.5px; font-weight: 500; overflow-wrap: anywhere; }
.cs-dossier__dl dd a { color: var(--foreground); text-decoration: none; }
.cs-dossier__dl dd a:hover { text-decoration: underline; }
.cs-dossier__dl dd .cs-chip { margin-left: 4px; }
.cs-dossier__desc { display: grid; gap: 8px; margin: 12px 20px 20px; padding: 14px 16px; border: 1px solid var(--border); border-left: 3px solid var(--zinc-500); border-radius: 12px; background: var(--muted); }
.cs-dossier__desc p:last-child { margin: 0; font-size: 14px; line-height: 1.65; white-space: pre-line; overflow-wrap: anywhere; }
@media (max-width: 900px) { .cs-dossier__head { padding: 16px; } .cs-dossier__grid { padding: 14px 16px 0; } .cs-dossier__desc { margin: 12px 16px 16px; } }

/* Geçici bildirimler: birkaç saniye sonra solup kaybolur (panel.js / portal Flash bileşeni) */
.cs-alert { transition: opacity .35s var(--ease), transform .35s var(--ease); }
.cs-alert.is-hiding { opacity: 0; transform: translateY(-4px); }
@media (prefers-reduced-motion: reduce) { .cs-alert { transition: none; } }
/* adlibilisim.online — talep dosyaları */
.cs-files__group { margin: 4px 0 8px; font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--muted-foreground); }
.cs-files__group + .cs-list, .cs-list + .cs-files__group { margin-top: 10px; }
.cs-files__none { margin: 0 0 8px; font-size: 13px; }
.cs-file { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; }
.cs-file__main { min-width: 0; font-size: 13.5px; }
.cs-file__sha { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 4px; font-size: 11.5px; }
.cs-file__sha > span:first-child { width: 220px; color: var(--muted-foreground); }
.cs-file__sha code { font: 500 11.5px "Geist Mono", ui-monospace, monospace; overflow-wrap: anywhere; }
.cs-report-up { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--border); }
.cs-report-up .cs-muted { flex: 1 1 280px; font-size: 12.5px; }
.cs-report-up label.cs-btn { cursor: pointer; }
.cs-report-up__status { flex-basis: 100%; margin: 0; padding: 8px 12px; border-radius: 8px; background: var(--muted); font-size: 13px; font-weight: 500; }
.cs-report-up__status.is-ok { background: rgba(16, 185, 129, .10); color: #047857; }
.cs-report-up__status.is-err { background: rgba(244, 63, 94, .08); color: #be123c; }
@media (max-width: 700px) { .cs-file { flex-direction: column; align-items: stretch; } .cs-file__sha > span:first-child { width: auto; } }
.cs-form--wide-cols { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }   /* uzun aşama adları seçicide kesilmesin */
.cs-file__info { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 6px 0 2px; font-size: 12px; color: var(--zinc-700); }
.cs-file__info b { font-weight: 600; color: var(--muted-foreground); }
.cs-file__info sup { margin-left: 1px; color: var(--muted-foreground); }
/* adlibilisim.online — ödeme */
.cs-actions--spaced { margin-top: 10px; }
.cs-paydecide { margin-top: 12px; }
.cs-legal-sha { margin: 0; font-size: 11.5px; overflow-wrap: anywhere; }
.cs-legal-sha code { font: 500 11px "Geist Mono", ui-monospace, monospace; }
.cs-row__acks { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 0; }
.cs-legal-meta { display: flex; gap: 8px; margin: 0 0 14px; padding: 10px 12px; border-radius: 10px; background: var(--muted); font-size: 12.5px; line-height: 1.55; color: var(--zinc-700); }
.cs-legal-meta .ic { flex: 0 0 auto; margin-top: 2px; }

/* SGF marka logosu (yatay, şeffaf zeminli) — 2026-10-07: portal + panel kenar çubuğu ve giriş paneli */
.cs-side__brand { justify-content: center; padding: 0 12px; }
.cs-side__brand img.cs-sgf { width: auto; height: 56px; max-width: 100%; object-fit: contain; }
.cs-auth__logo img.cs-sgf { width: auto; height: 72px; margin-left: -8px; max-width: 100%; filter: drop-shadow(0 4px 12px rgba(0, 0, 0, .45)); }
@media (max-width: 900px) { .cs-auth__logo img.cs-sgf { height: 60px; } }
/* Kenar çubuğu logosu biraz daha büyük: logo şeridi, alt menü üstü ve başlık çubuğu birlikte 64px (çizgiler hizalı kalsın) */
.cs-side__brand, .cs-subside__top, .cs-header { height: 64px; flex-basis: 64px; }
.cs-side__brand img.cs-sgf { height: 64px; }
/* Hiza: kenar çubuğu logosunda gölge YOK (gölge alt çizginin altına taşıp çizgiyi aşağıda gösteriyordu). Alt menü sütununda çizgi YOK (kullanıcı kararı). */

/* ---- Genel Bakış: Agents StatCard (gradyan zemin, buzlu ikon kapsülü, büyük değer, sağ altta soluk dev ikon) ---- */
.cs-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; padding: 4px; margin: -4px -4px 20px; }
.cs-stat {
  position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: flex-start; gap: 12px;
  padding: 20px; border-radius: 16px; color: #fff; text-decoration: none;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1);
  transition: transform .2s var(--ease), box-shadow .2s var(--ease);
}
.cs-stat::before { content: ""; position: absolute; inset: 0 0 auto; height: 1px; background: rgba(255, 255, 255, .4); pointer-events: none; }
.cs-stat:hover { transform: translateY(-4px); box-shadow: 0 20px 25px -5px rgba(0, 0, 0, .12), 0 8px 10px -6px rgba(0, 0, 0, .1); }
.cs-stat:focus-visible { outline: 2px solid var(--ring); outline-offset: 3px; }
.cs-stat--amber   { background: linear-gradient(135deg, #f59e0b, #d97706); }
.cs-stat--sky     { background: linear-gradient(135deg, #0ea5e9, #0284c7); }
.cs-stat--violet  { background: linear-gradient(135deg, #8b5cf6, #7c3aed); }
.cs-stat--emerald { background: linear-gradient(135deg, #10b981, #059669); }
.cs-stat__deco { position: absolute; right: 12px; bottom: 12px; color: rgba(255, 255, 255, .2); pointer-events: none; z-index: -1; }
.cs-stat__deco .ic { width: 18px; height: 18px; transform: scale(4.5); transform-origin: bottom right; }
.cs-stat__icon {
  flex: 0 0 auto; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 16px;
  background: rgba(255, 255, 255, .15); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .25);
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
}
.cs-stat__icon .ic { width: 18px; height: 18px; }
.cs-stat__text { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; align-self: stretch; }
.cs-stat__label { font-size: 10.5px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: rgba(255, 255, 255, .78); line-height: 1.35; }
.cs-stat__value { margin-top: auto; padding-top: 12px; font-size: 48px; font-weight: 800; line-height: 1; letter-spacing: -.02em; font-variant-numeric: tabular-nums; text-shadow: 0 1px 2px rgba(0, 0, 0, .12); }

.cs-dash { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; align-items: start; }
.cs-due { flex-wrap: nowrap; }
.cs-due__date { display: flex !important; flex-direction: column; align-items: flex-start !important; gap: 0 !important; min-width: 108px; line-height: 1.3; }
.cs-due__date b { font-size: 13px; font-weight: 600; }
.cs-due__date small { font-size: 11px; color: var(--muted-foreground); }
.cs-due__main { flex: 1 1 auto; min-width: 0; }
.cs-due__left { flex: 0 0 auto; }
.cs-mini { flex-direction: column; align-items: stretch !important; gap: 4px !important; }
.cs-mini__top { display: flex !important; align-items: center; gap: 8px; flex-wrap: wrap; }
.cs-mini__top time { margin-left: auto; font-size: 12px; color: var(--muted-foreground); }
.cs-mini__body { display: block !important; font-size: 13px; color: var(--muted-foreground); overflow-wrap: anywhere; }

@media (max-width: 1100px) { .cs-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } .cs-dash { grid-template-columns: 1fr; } }
@media (max-width: 520px) {
  .cs-stats { gap: 10px; }
  .cs-stat { flex-direction: column; gap: 10px; padding: 14px; }
  .cs-stat__icon { width: 36px; height: 36px; border-radius: 12px; }
  .cs-stat__label { letter-spacing: .12em; }
  .cs-stat__value { font-size: 36px; padding-top: 8px; }
  .cs-stat__deco .ic { transform: scale(3.2); }
  .cs-due { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) { .cs-stat { transition: none; } .cs-stat:hover { transform: none; } }

/* ---- Hukuki Metinler: sayfa yüksekliği sabit, yalnız metin kutusu kayar (portal /yasal ile aynı ilke) ---- */
.cs-main--fixed .cs-card--fill { flex: 1 1 0; min-height: 520px; display: flex; flex-direction: column; }
.cs-main--fixed .cs-card--fill > .cs-card__head, .cs-main--fixed .cs-legal-meta { flex: 0 0 auto; }
.cs-form--fill { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.cs-form--fill > * { flex: 0 0 auto; }
.cs-form--fill > .cs-field--grow { flex: 1 1 auto; min-height: 0; grid-template-rows: auto minmax(0, 1fr); }
.cs-form--fill .cs-field--grow textarea { height: 100%; min-height: 160px; resize: none; overflow-y: auto; }
@media (max-width: 900px) { .cs-card--fill .cs-seg { display: flex; flex-wrap: wrap; } .cs-card--fill .cs-seg a { white-space: nowrap; } }
.cs-legal-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.cs-legal-ver { cursor: default; font-weight: 500; color: var(--zinc-700); }
a.cs-legal-ver { cursor: pointer; }
.cs-legal-foot > .cs-btn--primary { margin-left: auto; }

/* ---- Safari yaylanma (overscroll) alanı: menü ve alt menünün arkası beyaz görünmesin ----
   1) Panel uygulama ekranı: yaylanma kapalı (Safari 16+). İç kaydırıcılar sona gelince sayfayı esnetmez.
   2) Yedek: WebKit yaylanma rengini html + body arka plan RENKLERİNİ bindirerek hesaplar → body'nin açık zemini
      renk değil görsel; html zemini sütunlarla aynı: 240px menü grafiti, 64px alt menü, sonra açık içerik. */
html.cs-root, html.cs-root body { overscroll-behavior: none; }
.cs-root .cs-main, .cs-root .cs-side__nav { overscroll-behavior: contain; }
html.cs-root { background: linear-gradient(90deg, #34373e 0 240px, #2b2d32 240px 304px, #fafafa 304px); }
html.cs-root body.cs { background: linear-gradient(var(--background), var(--background)); }
@media (max-width: 900px) { html.cs-root { background: linear-gradient(90deg, #2b2d32 0 64px, #fafafa 64px); } }
@media (max-width: 768px) { html.cs-root { background: #fafafa; } }

/* ---- Ücret Tarifesi: sabit sayfa, liste kendi içinde kayar; satırlar sürükle-bırak ile sıralanır ---- */
.cs-table-wrap--fill { flex: 1 1 auto; min-height: 0; overflow: auto; }
.cs-table-wrap--fill thead th { position: sticky; top: 0; z-index: 2; }
.cs-reorder-status { flex: 0 0 auto; margin: 0 0 12px; padding: 8px 12px; border-radius: 10px; font-size: 13px; background: var(--muted); color: var(--zinc-700); }
.cs-reorder-status.is-ok { background: rgba(16, 185, 129, .10); color: #047857; }
.cs-reorder-status.is-err { background: rgba(244, 63, 94, .10); color: #be123c; }
.cs-grip-col { width: 36px; padding-left: 8px !important; padding-right: 0 !important; }
.cs-grip {
  display: grid; place-items: center; width: 28px; height: 32px; padding: 0; border: 0; border-radius: 6px;
  background: transparent; color: var(--zinc-400); cursor: grab; touch-action: none;
}
.cs-grip:hover { background: var(--muted); color: var(--zinc-700); }
.cs-grip:focus-visible { outline: 2px solid var(--ring); outline-offset: 1px; }
[data-reorder] tr { cursor: grab; }
[data-reorder] tr :is(a, button:not(.cs-grip), input) { cursor: pointer; }
.cs-dragging, .cs-dragging * { cursor: grabbing !important; user-select: none; -webkit-user-select: none; }
[data-reorder] tr.is-dragging td { background: #f4f4f5; box-shadow: inset 0 1px 0 var(--border), inset 0 -1px 0 var(--border); }
[data-reorder] tr.is-dragging td:first-child { box-shadow: inset 3px 0 0 var(--primary), inset 0 1px 0 var(--border), inset 0 -1px 0 var(--border); }
[data-reorder].is-saving { opacity: .6; pointer-events: none; }

/* Hizmeti Düzenle / Hizmet Ekle: kart sayfaya tam yerleşir, açıklama alanı boşluğu doldurur, düğmeler sağda */
.cs-svc-grid { display: grid; gap: 14px; }
.cs-form-foot { display: flex; justify-content: flex-end; align-items: center; gap: 10px; flex-wrap: wrap; }
.cs-form--fill > .cs-check { margin: 0; }
/* Sabit sayfalarda kart pencereye sığmazsa sayfa değil formun içi kayar; düğme satırı altta görünür kalır */
.cs-main--fixed .cs-card--fill { min-height: 0; }
.cs-main--fixed .cs-form--fill { overflow-y: auto; }
.cs-main--fixed .cs-form-foot, .cs-main--fixed .cs-legal-foot { position: sticky; bottom: -16px; z-index: 2; margin: 0 -16px -16px; padding: 12px 16px 16px; background: #fff; border-top: 1px solid transparent; }
/* Tutamak sütunu başta: hizmet adı sütunu sola hizalı kalsın (genel kural ilk sütun dışını sağa yaslar) */
.cs-table.cs-table--services td.cs-grip-col + td, .cs-table.cs-table--services th.cs-grip-col + th { text-align: left; }
.cs-table--services .cs-grip-col + td b { font-weight: 600; }
/* Form içi kaydığında büyüyen alan ezilmesin: en az etiket + kutunun en küçük yüksekliği */
.cs-form--fill > .cs-field--grow { min-height: min-content; }
.cs-tarife-form .cs-field--grow textarea { min-height: 96px; }

/* =====================================================================================================
   Stüdyo · Site İçerikleri — görsel düzenleyici (editor.js). Üç bölmeli: katmanlar · tuval · özellikler.
   ===================================================================================================== */
.cs-alert--warn { background: rgba(245, 158, 11, .10); border-color: rgba(245, 158, 11, .30); color: #92400e; }
.sb {
  --sb-accent: #6366f1; --sb-accent-soft: rgba(99, 102, 241, .12); --sb-line: #e4e4e7;
  flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; overflow: hidden;
  border: 1px solid var(--glass-border); border-radius: 16px; background: #fff;
  box-shadow: inset 0 1px 0 var(--glass-ring), 0 20px 25px -5px rgba(0, 0, 0, .10), 0 8px 10px -6px rgba(0, 0, 0, .10);
}
.sb svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 auto; }
.sb-bar {
  flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
  padding: 10px 12px; border-bottom: 1px solid var(--sb-line); background: linear-gradient(180deg, #fff, #fafafa);
}
.sb-bar__group { display: flex; align-items: center; gap: 8px; min-width: 0; }
.sb-site { position: relative; display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 10px; border: 1px solid var(--sb-line); border-radius: 9px; background: #fff; color: var(--zinc-700); }
.sb-site select { appearance: none; -webkit-appearance: none; border: 0; background: transparent; padding: 0 18px 0 0; font: 600 13px var(--font); color: var(--foreground); cursor: pointer; outline: none;
  background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position: right 6px top 50%, right 2px top 50%; background-size: 4px 4px; background-repeat: no-repeat; }
.sb-site:focus-within { border-color: var(--sb-accent); box-shadow: 0 0 0 3px var(--sb-accent-soft); }
.sb-seg { display: inline-flex; padding: 3px; border-radius: 9px; background: var(--muted); }
.sb-seg button { height: 28px; min-width: 34px; padding: 0 10px; border: 0; border-radius: 7px; background: transparent; color: var(--muted-foreground); font: 600 12px var(--font); cursor: pointer; display: grid; place-items: center; }
.sb-seg button:hover { color: var(--foreground); }
.sb-seg button.is-on { background: #fff; color: var(--foreground); box-shadow: 0 1px 2px rgba(0, 0, 0, .1); }
.sb-zoom { font: 500 11.5px "Geist Mono", ui-monospace, monospace; color: var(--muted-foreground); min-width: 38px; }
.sb-icon { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--zinc-700); cursor: pointer; }
.sb-icon:hover:not(:disabled) { background: var(--muted); }
.sb-icon:disabled { opacity: .35; cursor: default; }
.sb-status { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; color: var(--muted-foreground); white-space: nowrap; max-width: 420px; overflow: hidden; text-overflow: ellipsis; }
.sb-status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--zinc-300); flex: 0 0 auto; }
.sb-status.is-draft::before { background: #f59e0b; }
.sb-status.is-busy::before { background: var(--sb-accent); animation: sb-pulse 1s infinite; }
.sb-status.is-err { color: #be123c; }
.sb-status.is-err::before { background: #e11d48; }
@keyframes sb-pulse { 50% { opacity: .3; } }
.sb-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 34px; padding: 0 13px; border: 1px solid var(--sb-line); border-radius: 9px;
  background: #fff; color: var(--foreground); font: 600 13px var(--font); text-decoration: none; cursor: pointer; white-space: nowrap; transition: background .15s, box-shadow .15s;
}
.sb-btn:hover:not(:disabled) { background: var(--muted); }
.sb-btn:disabled { opacity: .45; cursor: default; }
.sb-btn--primary { border-color: transparent; background: var(--grad-signature); color: #fff; box-shadow: 0 6px 16px -8px rgba(24, 24, 27, .7); }
.sb-btn--primary:hover:not(:disabled) { background: var(--grad-signature); filter: brightness(1.2); }
.sb-btn--danger { color: #be123c; }
.sb-btn--danger:hover:not(:disabled) { background: rgba(244, 63, 94, .08); }
.sb-btn--block { width: 100%; }
.sb-body { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: 236px minmax(0, 1fr) 320px; }

/* Katmanlar */
.sb-layers { min-height: 0; display: flex; flex-direction: column; border-right: 1px solid var(--sb-line); background: #fcfcfc; }
.sb-pane__head { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; padding: 11px 14px; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted-foreground); border-bottom: 1px solid var(--sb-line); }
.sb-tree { flex: 1 1 auto; min-height: 0; overflow: auto; padding: 6px; overscroll-behavior: contain; }
.sb-node {
  display: flex; align-items: center; gap: 6px; width: 100%; min-height: 28px; padding: 3px 8px 3px calc(8px + var(--d) * 14px); border: 0; border-radius: 7px;
  background: transparent; color: var(--zinc-700); font: 500 12.5px var(--font); text-align: left; cursor: pointer;
}
.sb-node:hover { background: var(--muted); }
.sb-node.is-top { margin-top: 2px; font-weight: 600; color: var(--foreground); }
.sb-node__car { display: inline-block; width: 12px; color: var(--zinc-400); transition: transform .15s; }
.sb-node[aria-expanded="true"] .sb-node__car { transform: rotate(90deg); }
.sb-node__k { flex: 0 0 auto; padding: 0 5px; border-radius: 4px; background: rgba(82, 82, 91, .08); color: var(--zinc-500); font-size: 10.5px; font-weight: 600; }
.sb-node.is-top .sb-node__k { display: none; }
.sb-node__t { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sb-node.is-on { background: var(--sb-accent-soft); color: #3730a3; box-shadow: inset 2px 0 0 var(--sb-accent); }

/* Tuval */
.sb-canvas { position: relative; min-width: 0; min-height: 0; background: #eceef1; background-image: radial-gradient(rgba(24, 24, 27, .07) 1px, transparent 1px); background-size: 16px 16px; }
.sb-stage { position: absolute; inset: 0; display: flex; justify-content: center; padding: 16px 24px; overflow: hidden; }
.sb-frame { position: relative; flex: 0 0 auto; border-radius: 10px; overflow: hidden; background: #fff; box-shadow: 0 0 0 1px rgba(24, 24, 27, .08), 0 18px 40px -18px rgba(24, 24, 27, .45); }
.sb-frame iframe { display: block; border: 0; transform-origin: 0 0; background: #fff; }
.sb-overlay { position: absolute; inset: 0; pointer-events: none; z-index: 2; overflow: hidden; }
.sb-box { position: absolute; left: 0; top: 0; border-radius: 3px; will-change: transform; }
.sb-box--hover { outline: 1px dashed rgba(99, 102, 241, .8); outline-offset: 1px; }
.sb-box--hover::after { content: attr(data-label); position: absolute; left: -1px; top: -19px; padding: 1px 6px; border-radius: 4px 4px 0 0; background: rgba(99, 102, 241, .85); color: #fff; font: 600 10.5px var(--font); white-space: nowrap; }
.sb-box--sel { outline: 2px solid var(--sb-accent); outline-offset: 1px; box-shadow: 0 0 0 9999px rgba(15, 15, 30, .0); }
.sb-drop { position: absolute; left: 0; top: 0; border-radius: 4px; background: var(--sb-accent); box-shadow: 0 0 0 3px rgba(99, 102, 241, .25); }
.sb-drop::before, .sb-drop::after { content: ""; position: absolute; width: 10px; height: 10px; border-radius: 50%; background: #fff; border: 2px solid var(--sb-accent); top: 50%; transform: translate(-50%, -50%); }
.sb-drop::before { left: 0; } .sb-drop::after { left: 100%; }
.sb-drop.is-v::before, .sb-drop.is-v::after { left: 50%; top: 0; }
.sb-drop.is-v::after { top: 100%; }
.sb-tools {
  position: absolute; left: 0; top: 0; z-index: 3; display: flex; align-items: center; gap: 2px; padding: 3px; border-radius: 9px;
  background: #1e1b4b; box-shadow: 0 8px 20px -6px rgba(15, 15, 40, .55); will-change: transform;
}
.sb-tools__tag { padding: 0 8px 0 6px; color: #c7d2fe; font: 600 11.5px var(--font); white-space: nowrap; }
.sb-tools button { display: grid; place-items: center; width: 26px; height: 26px; border: 0; border-radius: 6px; background: transparent; color: #e0e7ff; font: 600 14px var(--font); cursor: pointer; }
.sb-tools button:hover:not(:disabled) { background: rgba(255, 255, 255, .14); }
.sb-tools button:disabled { opacity: .3; cursor: default; }
.sb-tools button[hidden] { display: none; }
.sb-tools button[data-act="move"] { cursor: grab; }
.sb-tools button.is-danger:hover:not(:disabled) { background: rgba(244, 63, 94, .35); }
.sb-shield { position: absolute; inset: 0; z-index: 4; cursor: copy; }
.sb.is-moving .sb-shield { cursor: grabbing; }
.sb-hint { position: absolute; left: 50%; bottom: 18px; z-index: 5; transform: translateX(-50%); margin: 0; padding: 9px 14px; border-radius: 10px; background: #1e1b4b; color: #e0e7ff; font-size: 12.5px; font-weight: 500; box-shadow: 0 12px 28px -10px rgba(15, 15, 40, .6); white-space: nowrap; }
.sb-loading { position: absolute; inset: 0; display: none; place-items: center; align-content: center; gap: 12px; color: var(--muted-foreground); font-size: 13px; }
.sb-loading span { width: 26px; height: 26px; border-radius: 50%; border: 3px solid var(--zinc-300); border-top-color: var(--sb-accent); animation: sb-spin .8s linear infinite; }
@keyframes sb-spin { to { transform: rotate(360deg); } }
.sb.is-loading .sb-loading { display: grid; }
.sb.is-loading .sb-frame { visibility: hidden; }

/* Özellikler + bileşenler */
.sb-side { min-height: 0; display: flex; flex-direction: column; border-left: 1px solid var(--sb-line); background: #fff; }
.sb-props { flex: 1 1 auto; min-height: 0; overflow: auto; padding: 14px; overscroll-behavior: contain; }
.sb-empty { display: grid; justify-items: center; text-align: center; gap: 6px; padding: 18px 8px; color: var(--muted-foreground); }
.sb-empty h3 { margin: 4px 0 0; font-size: 15px; color: var(--foreground); }
.sb-empty p { margin: 0; font-size: 13px; line-height: 1.55; }
.sb-empty__ic { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: var(--sb-accent-soft); color: var(--sb-accent); }
.sb-empty__ic svg { width: 20px; height: 20px; }
.sb-keys { display: grid; gap: 7px; width: 100%; margin: 14px 0 0; padding: 12px; list-style: none; border-radius: 10px; background: var(--muted); text-align: left; font-size: 12px; color: var(--zinc-700); }
kbd { display: inline-block; min-width: 18px; margin-right: 3px; padding: 1px 5px; border: 1px solid var(--sb-line); border-bottom-width: 2px; border-radius: 5px; background: #fff; font: 600 10.5px var(--font); text-align: center; }
.sb-crumbs { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; margin-bottom: 10px; color: var(--zinc-400); font-size: 11px; }
.sb-crumbs button { padding: 2px 6px; border: 0; border-radius: 5px; background: transparent; color: var(--muted-foreground); font: 500 11.5px var(--font); cursor: pointer; }
.sb-crumbs button:hover { background: var(--muted); color: var(--foreground); }
.sb-crumbs button.is-on { color: #3730a3; background: var(--sb-accent-soft); }
.sb-props__head { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.sb-kind { font-size: 16px; font-weight: 700; letter-spacing: -.01em; }
.sb-lock { padding: 2px 7px; border-radius: 6px; background: rgba(82, 82, 91, .08); color: var(--zinc-600); font-size: 11px; font-weight: 600; }
.sb-group { padding: 12px 0; border-top: 1px solid var(--sb-line); display: grid; gap: 10px; }
.sb-group h4 { display: flex; align-items: baseline; justify-content: space-between; margin: 0; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted-foreground); }
.sb-group h4 small { text-transform: none; letter-spacing: 0; font-weight: 500; color: #b45309; }
.sb-field { display: grid; gap: 5px; font-size: 12.5px; font-weight: 600; color: var(--zinc-700); }
.sb-field small { font-weight: 500; color: var(--muted-foreground); }
.sb-field input, .sb-field textarea {
  width: 100%; box-sizing: border-box; padding: 8px 10px; border: 1px solid var(--sb-line); border-radius: 8px; background: #fff;
  font: 400 13px/1.5 var(--font); color: var(--foreground); resize: vertical; transition: border-color .15s, box-shadow .15s;
}
.sb-field input { height: 34px; }
.sb-field input:focus, .sb-field textarea:focus { outline: none; border-color: var(--sb-accent); box-shadow: 0 0 0 3px var(--sb-accent-soft); }
.sb-flag { display: inline-block; margin-right: 4px; padding: 0 5px; border-radius: 4px; background: var(--zinc-800); color: #fff; font-size: 10px; font-weight: 700; }
.sb-text { display: grid; gap: 4px; }
.sb-fmt { display: flex; gap: 2px; }
.sb-fmt button { width: 26px; height: 24px; border: 1px solid var(--sb-line); border-radius: 6px; background: #fff; color: var(--zinc-700); font: 600 12px var(--font); cursor: pointer; }
.sb-fmt button:hover { background: var(--muted); }
.sb-note { margin: 0; font-size: 11.5px; line-height: 1.5; color: var(--muted-foreground); }
.sb-note code { font: 500 10.5px "Geist Mono", ui-monospace, monospace; padding: 1px 5px; border-radius: 4px; background: var(--muted); }
.sb-note--warn { color: #92400e; }
.sb-check { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--zinc-700); cursor: pointer; }
.sb-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.sb-actions .sb-btn { height: 32px; font-size: 12.5px; }
.sb-img { display: flex; align-items: center; gap: 10px; padding: 8px; border: 1px solid var(--sb-line); border-radius: 10px; background: repeating-conic-gradient(#f4f4f5 0% 25%, #fff 0% 50%) 50% / 12px 12px; }
.sb-img img { width: 64px; height: 48px; object-fit: contain; border-radius: 6px; background: #fff; box-shadow: 0 0 0 1px var(--sb-line); }
.sb-img span { display: grid; min-width: 0; font-size: 12px; font-weight: 600; overflow-wrap: anywhere; }
.sb-img small { font-weight: 500; color: var(--muted-foreground); }
.sb-upload { display: block; cursor: pointer; }
.sb-lib { flex: 0 0 auto; border-top: 1px solid var(--sb-line); background: #fcfcfc; }
.sb-lib__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; padding: 10px 12px 12px; }
.sb-comp {
  display: grid; justify-items: center; gap: 5px; padding: 9px 4px 7px; border: 1px solid var(--sb-line); border-radius: 10px; background: #fff;
  color: var(--zinc-700); font: 600 10.5px/1.2 var(--font); text-align: center; cursor: pointer; transition: border-color .15s, box-shadow .15s, transform .15s;
}
.sb-comp svg { width: 20px; height: 20px; color: var(--zinc-500); }
.sb-comp:hover { border-color: var(--sb-accent); box-shadow: 0 6px 14px -8px rgba(99, 102, 241, .6); transform: translateY(-1px); }
.sb-comp:hover svg, .sb-comp.is-on svg { color: var(--sb-accent); }
.sb-comp.is-on { border-color: var(--sb-accent); background: var(--sb-accent-soft); }
.sb-narrow { display: none; }

/* Sürümler penceresi */
.sb-dialog { width: min(560px, calc(100vw - 32px)); max-height: min(640px, calc(100vh - 64px)); padding: 0; border: 0; border-radius: 16px; box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .4); }
.sb-dialog::backdrop { background: rgba(15, 15, 20, .35); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
.sb-dialog header { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid var(--border); }
.sb-dialog h3 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 16px; }
.sb-dialog > p { margin: 14px 16px 6px; font-size: 13px; }
.sb-dialog .cs-list { padding: 8px 16px 16px; }

@media (max-width: 1280px) { .sb-body { grid-template-columns: 200px minmax(0, 1fr) 290px; } .sb-lib__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1100px) { .sb-body { grid-template-columns: minmax(0, 1fr) 290px; } .sb-layers { display: none; } .sb-zoom { display: none; } }
@media (max-width: 1023px) { .sb-bar, .sb-body { display: none; } .sb-narrow { display: grid; justify-items: center; gap: 10px; padding: 48px 24px; text-align: center; color: var(--muted-foreground); } .sb-narrow .ic { width: 28px; height: 28px; } .sb-narrow p { margin: 0; max-width: 420px; } }

/* Site İçerikleri · renkler: öğe başına hazır tonlar + tema paneli */
.sb-swrow { display: grid; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--zinc-700); }
.sb-sw { display: flex; flex-wrap: wrap; gap: 8px; }
.sb-swatch { width: 28px; height: 28px; padding: 0; border: 2px solid #fff; border-radius: 50%; cursor: pointer; box-shadow: 0 0 0 1px var(--sb-line), 0 1px 2px rgba(0, 0, 0, .08); transition: transform .12s, box-shadow .12s; }
.sb-swatch:hover { transform: scale(1.08); }
.sb-swatch.is-on { box-shadow: 0 0 0 2px var(--sb-accent), 0 2px 6px -2px rgba(99, 102, 241, .5); }
.sb-swatch--none { background: linear-gradient(135deg, #fff 45%, #e11d48 45% 55%, #fff 55%); }
#sbThemeBtn.is-on { border-color: var(--sb-accent); background: var(--sb-accent-soft); color: #3730a3; }
.sb-theme { flex: 1 1 auto; min-height: 0; overflow: auto; padding: 14px; overscroll-behavior: contain; display: grid; align-content: start; gap: 12px; }
.sb-theme__head { display: flex; align-items: center; justify-content: space-between; }
.sb-theme__head h3 { margin: 0; font-size: 16px; }
.sb-warn { padding: 10px 12px; border-radius: 10px; background: rgba(245, 158, 11, .10); border: 1px solid rgba(245, 158, 11, .30); color: #92400e; font-size: 12px; line-height: 1.55; }
.sb-tokens { display: grid; gap: 4px; }
.sb-token { display: grid; grid-template-columns: 30px minmax(0, 1fr) 104px 28px; align-items: center; gap: 8px; padding: 5px 6px; border-radius: 9px; }
.sb-token:hover { background: var(--muted); }
.sb-token.is-changed { background: var(--sb-accent-soft); }
.sb-token input[type="color"] { width: 30px; height: 30px; padding: 0; border: 1px solid var(--sb-line); border-radius: 8px; background: #fff; cursor: pointer; }
.sb-token input[type="color"]::-webkit-color-swatch-wrapper { padding: 3px; }
.sb-token input[type="color"]::-webkit-color-swatch { border: 0; border-radius: 5px; }
.sb-token__chip { width: 30px; height: 30px; border-radius: 8px; box-shadow: inset 0 0 0 1px var(--sb-line); }
.sb-token__name { display: grid; min-width: 0; line-height: 1.25; }
.sb-token__name b { font-size: 12.5px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sb-token__name code { font: 500 10.5px "Geist Mono", ui-monospace, monospace; color: var(--muted-foreground); }
.sb-token__val { width: 100%; box-sizing: border-box; height: 28px; padding: 0 7px; border: 1px solid var(--sb-line); border-radius: 7px; font: 500 11px "Geist Mono", ui-monospace, monospace; }
.sb-token__val:focus { outline: none; border-color: var(--sb-accent); box-shadow: 0 0 0 3px var(--sb-accent-soft); }
.sb-theme__foot { position: sticky; bottom: -14px; display: flex; justify-content: space-between; gap: 8px; margin: 0 -14px; padding: 10px 14px 14px; background: #fff; border-top: 1px solid var(--sb-line); }
.sb-theme__hist { display: grid; gap: 6px; }
.sb-theme__hist h4 { margin: 4px 0 0; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted-foreground); }
.sb-theme__hist .sb-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 8px; border: 1px solid var(--sb-line); border-radius: 9px; font-size: 12.5px; }
.sb-theme__hist small { color: var(--muted-foreground); }
/* Araç çubuğu tek satır: orta genişlikte ikincil düğmeler yalnız ikon; tema paneli sütuna sığar */
@media (max-width: 1800px) { .sb-btn .sb-btn__t { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } .sb-btn:has(.sb-btn__t) { padding: 0 10px; } .sb-zoom { display: none; } }
.sb-bar__group { flex-wrap: nowrap; }
.sb-site select { max-width: 170px; text-overflow: ellipsis; }
.sb-theme { grid-template-columns: minmax(0, 1fr); }
.sb-theme > * { min-width: 0; }
.sb-token { grid-template-columns: 30px minmax(0, 1fr) 92px 28px; }
.sb-theme__foot .sb-btn { flex: 1 1 0; min-width: 0; padding: 0 10px; }

/* =====================================================================================================
   Stüdyo · Hukuki Metinler — site seçimli metin aracı (legal-editor.js)
   ===================================================================================================== */
.lg { --sb-accent: #6366f1; --sb-accent-soft: rgba(99, 102, 241, .12); --sb-line: #e4e4e7; }
.lg .cs-card__head { flex: 0 0 auto; }
.lg-site select { max-width: 240px; }
.lg-tabs { flex: 0 0 auto; display: flex; flex-wrap: wrap; align-self: flex-start; margin-bottom: 12px; }
.lg-form { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; gap: 10px; }
.lg-bar { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.lg-tools { display: flex; align-items: center; gap: 2px; padding: 3px; border: 1px solid var(--sb-line); border-radius: 10px; background: #fff; }
.lg-tools button { min-width: 30px; height: 28px; padding: 0 7px; border: 0; border-radius: 7px; background: transparent; color: var(--zinc-700); font: 600 13px var(--font); cursor: pointer; }
.lg-tools button:hover { background: var(--muted); color: var(--foreground); }
.lg-tools button:focus-visible { outline: 2px solid var(--sb-accent); outline-offset: 1px; }
.lg-sep { width: 1px; height: 18px; margin: 0 4px; background: var(--sb-line); }
.lg-view { margin-left: auto; }
.lg-find { flex: 0 0 auto; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 8px; border: 1px solid var(--sb-line); border-radius: 10px; background: #fafafa; }
.lg-find input { height: 32px; padding: 0 10px; border: 1px solid var(--sb-line); border-radius: 8px; font: 400 13px var(--font); min-width: 0; flex: 1 1 160px; }
.lg-find input:focus { outline: none; border-color: var(--sb-accent); box-shadow: 0 0 0 3px var(--sb-accent-soft); }
.lg-find .sb-btn { height: 32px; }
.lg-find__n { font-size: 12px; color: var(--muted-foreground); min-width: 80px; }
.lg-help { flex: 0 0 auto; padding: 8px 12px; border-radius: 10px; background: var(--sb-accent-soft); color: #3730a3; font-size: 12.5px; line-height: 1.8; }
.lg-help code { padding: 1px 6px; border-radius: 5px; background: #fff; font: 500 11.5px "Geist Mono", ui-monospace, monospace; color: var(--foreground); }
.lg-pane { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; gap: 10px; }
.lg-pane[hidden] { display: none; }
.lg-title { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 10px; font-size: 13px; font-weight: 600; color: var(--zinc-700); }
.lg-title input { height: 36px; padding: 0 12px; border: 1px solid var(--sb-line); border-radius: 9px; font: 600 14px var(--font); }
.lg-title input:focus, .lg-text:focus { outline: none; border-color: var(--sb-accent); box-shadow: 0 0 0 3px var(--sb-accent-soft); }
.lg-split { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
.lg-text {
  width: 100%; height: 100%; min-height: 0; box-sizing: border-box; padding: 14px 16px; resize: none; overflow: auto; overscroll-behavior: contain;
  border: 1px solid var(--sb-line); border-radius: 12px; background: #fff; font: 400 13.5px/1.7 "Geist Mono", ui-monospace, monospace; color: var(--foreground); tab-size: 2;
}
.lg-preview { min-height: 0; overflow: auto; overscroll-behavior: contain; border: 1px solid var(--sb-line); border-radius: 12px; background: #fafafa; }
.lg-doc { max-width: 720px; margin: 0 auto; padding: 20px 26px; font: 400 14.5px/1.75 var(--font); color: #3f3f46; }
.lg-doc .notice__block { margin: 0 0 26px; }
.lg-doc h3 { margin: 0 0 10px; font-size: 16px; font-weight: 800; letter-spacing: -.01em; color: var(--foreground); }
.lg-doc p { margin: 0 0 12px; text-align: justify; }
.lg-doc ul { margin: 0 0 12px; padding-left: 20px; }
.lg-doc li { margin: 0 0 5px; }
.lg-doc a { color: var(--foreground); text-decoration: underline; text-underline-offset: 3px; }
.lg-doc code { padding: 1px 5px; border-radius: 5px; background: var(--muted); font: 500 12.5px "Geist Mono", ui-monospace, monospace; }
.lg-doc .notice__table-wrap { overflow-x: auto; border: 1px solid var(--sb-line); border-radius: 10px; background: #fff; }
.lg-doc table { width: 100%; border-collapse: collapse; font-size: 13px; }
.lg-doc th, .lg-doc td { padding: 9px 12px; border-bottom: 1px solid var(--sb-line); text-align: left; vertical-align: top; }
.lg-doc th { background: var(--muted); font-weight: 700; color: var(--foreground); }
.lg-doc tr:last-child td { border-bottom: 0; }
.lg-empty { color: var(--muted-foreground); font-style: italic; }
.lg[data-view="edit"] .lg-split { grid-template-columns: 1fr; } .lg[data-view="edit"] .lg-preview { display: none; }
.lg[data-view="preview"] .lg-split { grid-template-columns: 1fr; } .lg[data-view="preview"] .lg-text { display: none; }
.lg-foot { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.lg-foot__l, .lg-foot__r { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.lg-foot__r { margin-left: auto; }
.lg-count { font-size: 12px; color: var(--muted-foreground); }
.lg-count.is-dirty { color: #b45309; font-weight: 600; }
.lg-dialog { width: min(860px, calc(100vw - 32px)); }
.lg-dialog > p { margin: 14px 16px 6px; font-size: 13px; }
.lg-diff { max-height: min(560px, calc(100vh - 160px)); overflow: auto; padding: 12px 16px 16px; }
.lg-diff h4 { margin: 10px 0 6px; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted-foreground); }
.lg-diff__t { border: 1px solid var(--sb-line); border-radius: 10px; overflow: hidden; font: 400 12.5px/1.6 "Geist Mono", ui-monospace, monospace; }
.lg-d { display: grid; grid-template-columns: 22px 1fr; padding: 2px 10px 2px 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.lg-d span { text-align: center; color: var(--muted-foreground); user-select: none; }
.lg-d--add { background: rgba(16, 185, 129, .10); } .lg-d--add span { color: #047857; }
.lg-d--del { background: rgba(244, 63, 94, .08); text-decoration: line-through; text-decoration-color: rgba(190, 18, 60, .35); } .lg-d--del span { color: #be123c; }
.lg-d--eq { color: var(--muted-foreground); }
.lg-d--skip { display: block; padding: 4px 12px; background: var(--muted); color: var(--muted-foreground); font-style: italic; }
@media (max-width: 1100px) { .lg-split { grid-template-columns: 1fr; } .lg-preview { display: none; } .lg[data-view="preview"] .lg-preview { display: block; } }
.lg-foot .cs-btn:disabled { opacity: .45; cursor: default; box-shadow: none; filter: none; transform: none; }

/* =====================================================================================================
   Ayarlar · Profil (profile.js) — solda kimlik kartı, sağda alanlar; sabit sayfa, alt şerit kaydet
   ===================================================================================================== */
.pf, .sc-dlg { --pf-accent: #6366f1; --pf-accent-soft: rgba(99, 102, 241, .12); --pf-line: #e4e4e7; }
.pf .cs-card__head { flex: 0 0 auto; }
.pf-form { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.pf-body { flex: 1 1 auto; min-height: 0; overflow: auto; overscroll-behavior: contain; display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 22px; align-content: start; align-items: stretch; padding: 2px; }
.pf-id {
  display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 26px 22px 22px; border-radius: 16px; text-align: center;
  background: linear-gradient(180deg, rgba(99, 102, 241, .06), rgba(255, 255, 255, 0) 55%), #fff; border: 1px solid var(--pf-line);
}
.pf-drop { position: relative; display: grid; place-items: center; width: 148px; height: 148px; border-radius: 50%; cursor: pointer; outline: none; }
.pf-drop:focus-visible { box-shadow: 0 0 0 3px #fff, 0 0 0 6px var(--pf-accent); }
.pf-av {
  display: grid; place-items: center; width: 148px; height: 148px; overflow: hidden; border-radius: 50%;
  background: var(--grad-avatar); color: #fff; font-size: 46px; font-weight: 700; letter-spacing: .02em;
  box-shadow: 0 0 0 4px #fff, 0 0 0 5px var(--pf-line), 0 18px 34px -16px rgba(24, 24, 27, .55);
}
.pf-av img { width: 100%; height: 100%; object-fit: cover; }
.pf-drop__hint {
  position: absolute; inset: 0; display: grid; place-items: center; align-content: center; gap: 6px; border-radius: 50%;
  background: rgba(15, 15, 25, .55); color: #fff; font-size: 12px; font-weight: 600; opacity: 0; transition: opacity .18s;
}
.pf-drop__hint svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; margin: 0 auto; }
.pf-drop:hover .pf-drop__hint, .pf-drop:focus-visible .pf-drop__hint, .pf-drop.is-over .pf-drop__hint { opacity: 1; }
.pf-drop.is-over .pf-av { box-shadow: 0 0 0 4px #fff, 0 0 0 7px var(--pf-accent); }
.pf-id__name { display: grid; gap: 2px; }
.pf-id__name b { font-size: 18px; font-weight: 700; letter-spacing: -.01em; overflow-wrap: anywhere; }
.pf-id__name span { font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted-foreground); }
.pf-id__actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; }
.pf-id__actions [hidden] { display: none; }
.pf-rm { color: #be123c; }
.pf-id__note { margin: 0; font-size: 11.5px; line-height: 1.55; color: var(--muted-foreground); }
.pf-id__meta { width: 100%; margin: 6px 0 0; padding: 14px 0 0; border-top: 1px dashed var(--pf-line); display: grid; gap: 10px; text-align: left; }
.pf-id__meta div { display: grid; gap: 2px; }
.pf-id__meta dt { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--muted-foreground); }
.pf-id__meta dd { margin: 0 0 0 22px; font-size: 13.5px; font-weight: 500; overflow-wrap: anywhere; }
.pf-main { display: grid; gap: 18px; align-content: start; }
.pf-duo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.pf-chip { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 12px; background: linear-gradient(160deg, #4a4e57 0%, #34373e 38%, #23252a 100%); color: #fff; }
.pf-chip__av { display: grid; place-items: center; flex: 0 0 auto; width: 38px; height: 38px; overflow: hidden; border-radius: 50%; background: var(--grad-avatar); font-size: 13px; font-weight: 700; box-shadow: 0 0 0 2px rgba(255, 255, 255, .18); }
.pf-chip__av img { width: 100%; height: 100%; object-fit: cover; }
.pf-chip b { font-size: 14px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pf-sec__list { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 10px; }
.pf-sec__list li { display: flex; align-items: center; gap: 10px; font-size: 13.5px; font-weight: 500; }
.pf-sec__list li > .ic { width: 16px; height: 16px; color: var(--muted-foreground); }
.pf-sec__list span { flex: 1; }
.pf-badge { font-style: normal; font-size: 11.5px; font-weight: 600; padding: 3px 9px; border-radius: 999px; color: #047857; background: rgba(16, 185, 129, .12); }
.pf-badge.is-off { color: #b45309; background: rgba(245, 158, 11, .14); }
.pf-sec { padding: 20px 22px 22px; border: 1px solid var(--pf-line); border-radius: 16px; background: #fff; }
.pf-sec header { margin-bottom: 16px; }
.pf-sec h3 { margin: 0 0 3px; font-size: 15px; font-weight: 700; letter-spacing: -.01em; }
.pf-sec header p { margin: 0; font-size: 12.5px; color: var(--muted-foreground); }
.pf-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.pf-field { display: grid; gap: 6px; align-content: start; font-size: 12.5px; font-weight: 600; color: var(--zinc-700); }
.pf-field em { font-style: normal; font-weight: 500; color: var(--muted-foreground); }
.pf-field input {
  height: 42px; padding: 0 13px; border: 1px solid var(--pf-line); border-radius: 10px; background: #fff;
  font: 500 14px var(--font); color: var(--foreground); transition: border-color .15s, box-shadow .15s;
}
.pf-field input:hover { border-color: var(--zinc-300); }
.pf-field input:focus { outline: none; border-color: var(--pf-accent); box-shadow: 0 0 0 3px var(--pf-accent-soft); }
.pf-field input.is-invalid { border-color: #e11d48; box-shadow: 0 0 0 3px rgba(244, 63, 94, .12); }
.pf-field small { font-weight: 500; font-size: 11.5px; line-height: 1.5; color: var(--muted-foreground); }
.pf-err { color: #be123c !important; min-height: 0; }
.pf-err:empty { display: none; }
.pf-confirm { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 14px; margin-top: 18px; padding: 14px 16px; border-radius: 12px; background: rgba(245, 158, 11, .08); border: 1px solid rgba(245, 158, 11, .28); }
.pf-confirm[hidden] { display: none; }
.pf-confirm__ic { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 11px; background: #fff; color: #b45309; box-shadow: 0 0 0 1px rgba(245, 158, 11, .3); }
.pf-confirm__ic .ic { width: 18px; height: 18px; }
.pf-foot { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 16px -20px -20px; padding: 14px 20px; border-top: 1px solid var(--pf-line); background: rgba(255, 255, 255, .85); border-radius: 0 0 16px 16px; }
.pf-state { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--muted-foreground); }
.pf-state::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #10b981; }
.pf-state.is-dirty { color: #b45309; font-weight: 600; } .pf-state.is-dirty::before { background: #f59e0b; }
.pf-state.is-err { color: #be123c; font-weight: 600; } .pf-state.is-err::before { background: #e11d48; }
.pf-foot__btns { display: flex; gap: 10px; margin-left: auto; }
.pf-foot .cs-btn:disabled { opacity: .45; cursor: default; box-shadow: none; filter: none; transform: none; }
/* Kırpma penceresi */
.pf-crop { width: min(440px, calc(100vw - 32px)); }
.pf-crop__stage { position: relative; width: 340px; height: 340px; max-width: calc(100vw - 80px); max-height: calc(100vw - 80px); margin: 18px auto 10px; border-radius: 16px; overflow: hidden; cursor: grab; touch-action: none; outline: none; background: #18181b; }
.pf-crop__stage.is-drag { cursor: grabbing; }
.pf-crop__stage:focus-visible { box-shadow: 0 0 0 3px var(--pf-accent); }
.pf-crop__stage canvas { width: 100%; height: 100%; display: block; }
.pf-crop__mask { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle closest-side, transparent calc(100% - 1px), rgba(15, 15, 20, .6) 100%); }
.pf-crop__mask::after { content: ""; position: absolute; inset: 0; border-radius: 50%; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .85); }
.pf-crop__zoom { display: flex; align-items: center; gap: 12px; padding: 0 30px; color: var(--muted-foreground); font-weight: 700; }
.pf-crop__zoom input { flex: 1; accent-color: var(--pf-accent); }
.pf-crop__hint { margin: 6px 16px 0; text-align: center; font-size: 12px; color: var(--muted-foreground); }
.pf-crop footer { display: flex; justify-content: flex-end; gap: 10px; padding: 14px 16px 16px; }
@media (max-width: 1360px) { .pf-duo { grid-template-columns: 1fr; } }
@media (max-width: 1100px) { .pf-body { grid-template-columns: 1fr; } .pf-id { flex-direction: row; flex-wrap: wrap; text-align: left; justify-content: flex-start; } .pf-id__meta { flex: 1 1 100%; } }
@media (max-width: 640px) { .pf-grid { grid-template-columns: 1fr; } .pf-id { flex-direction: column; align-items: center; text-align: center; } .pf-id__meta { flex: none; } .pf-foot__btns { width: 100%; } .pf-foot__btns .cs-btn { flex: 1; justify-content: center; } }

/* =====================================================================================================
   Ayarlar · Log (log.js) — üstte filtreler, ortada kendi içinde kayan tablo (gün başlıklı), altta sayfalama
   ===================================================================================================== */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.lv { --lv-line: #e4e4e7; }
.lv .cs-card__head { flex: 0 0 auto; }
.lv a[aria-disabled="true"] { opacity: .45; pointer-events: none; }
.lv-filters { flex: 0 0 auto; display: grid; gap: 12px; padding-bottom: 14px; border-bottom: 1px solid var(--lv-line); }
.lv-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.lv-seg { display: inline-flex; padding: 3px; border-radius: 10px; background: var(--muted); }
.lv-seg button { padding: 6px 12px; border: 0; border-radius: 7px; background: transparent; color: var(--muted-foreground); font: 500 13px var(--font); cursor: pointer; transition: background .15s, color .15s; }
.lv-seg button:hover { color: var(--foreground); }
.lv-seg button.is-on { background: #fff; color: var(--foreground); font-weight: 600; box-shadow: 0 1px 2px rgba(0, 0, 0, .08); }
.lv-seg button:focus-visible, .lv-kind:focus-visible { outline: 2px solid #6366f1; outline-offset: 2px; }
.lv-dates { display: inline-flex; align-items: center; gap: 6px; padding: 3px 4px; border-radius: 10px; border: 1px dashed var(--lv-line); color: var(--muted-foreground); }
.lv-dates.is-on { border-style: solid; border-color: #6366f1; background: rgba(99, 102, 241, .06); }
.lv-dates input { height: 30px; padding: 0 8px; border: 1px solid transparent; border-radius: 7px; background: transparent; font: 500 13px var(--font); color: var(--foreground); }
.lv-dates input:hover { background: #fff; border-color: var(--lv-line); }
.lv-dates input:focus { outline: none; background: #fff; border-color: #6366f1; box-shadow: 0 0 0 3px rgba(99, 102, 241, .12); }
.lv-search { position: relative; display: flex; align-items: center; flex: 1 1 220px; min-width: 200px; }
.lv-search > .ic { position: absolute; left: 11px; width: 16px; height: 16px; color: var(--muted-foreground); pointer-events: none; }
.lv-search input { width: 100%; height: 36px; padding: 0 34px 0 34px; border: 1px solid var(--lv-line); border-radius: 10px; background: #fff; font: 500 13.5px var(--font); color: var(--foreground); }
.lv-search input:focus { outline: none; border-color: #6366f1; box-shadow: 0 0 0 3px rgba(99, 102, 241, .12); }
.lv-search kbd { position: absolute; right: 9px; padding: 1px 6px; border: 1px solid var(--lv-line); border-radius: 5px; font: 600 11px var(--font); color: var(--muted-foreground); background: var(--muted); pointer-events: none; }
.lv-search input:focus + kbd, .lv-search input:not(:placeholder-shown) + kbd { display: none; }
.lv-toggle { position: relative; display: inline-flex; align-items: center; gap: 9px; font-size: 13px; font-weight: 500; cursor: pointer; user-select: none; white-space: nowrap; }
.lv-toggle input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.lv-toggle__ui { position: relative; width: 34px; height: 20px; border-radius: 999px; background: var(--zinc-300); transition: background .18s; }
.lv-toggle__ui::after { content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, .2); transition: transform .18s; }
.lv-toggle input:checked + .lv-toggle__ui { background: #f59e0b; }
.lv-toggle input:checked + .lv-toggle__ui::after { transform: translateX(14px); }
.lv-toggle input:focus-visible + .lv-toggle__ui { outline: 2px solid #6366f1; outline-offset: 2px; }
.lv-kinds { display: flex; gap: 8px; flex-wrap: wrap; }
.lv-kind {
  --c: #52525b; --bg: rgba(82, 82, 91, .08);
  display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 6px 0 11px; border: 1px solid var(--lv-line); border-radius: 999px;
  background: #fff; color: var(--zinc-700); font: 500 13px var(--font); cursor: pointer; transition: border-color .15s, background .15s, color .15s;
}
.lv-kind .ic { width: 14px; height: 14px; color: var(--c); }
.lv-kind b { min-width: 22px; padding: 1px 7px; border-radius: 999px; background: var(--muted); font-size: 11.5px; font-weight: 600; text-align: center; font-variant-numeric: tabular-nums; color: var(--muted-foreground); }
.lv-kind:hover { border-color: var(--c); }
.lv-kind.is-on { border-color: var(--c); background: var(--bg); color: var(--c); font-weight: 600; }
.lv-kind.is-on b { background: var(--c); color: #fff; }
.lv-kind.is-empty:not(.is-on) { opacity: .55; }
.lv-kind:first-child.is-on { --c: #18181b; --bg: rgba(24, 24, 27, .06); }
.lv-kind--sky, .lv-badge--sky { --c: #0369a1; --bg: rgba(14, 165, 233, .1); }
.lv-kind--violet, .lv-badge--violet { --c: #6d28d9; --bg: rgba(139, 92, 246, .1); }
.lv-kind--emerald, .lv-badge--emerald { --c: #047857; --bg: rgba(16, 185, 129, .1); }
.lv-kind--amber, .lv-badge--amber { --c: #b45309; --bg: rgba(245, 158, 11, .12); }
.lv-kind--rose, .lv-badge--rose { --c: #be123c; --bg: rgba(244, 63, 94, .1); }
.lv-kind--zinc, .lv-badge--zinc { --c: #52525b; --bg: rgba(82, 82, 91, .09); }
.lv-summary { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 12px 2px 10px; font-size: 13px; color: var(--muted-foreground); }
.lv-summary b { color: var(--foreground); font-variant-numeric: tabular-nums; }
.lv-summary__range { display: inline-flex; align-items: center; gap: 5px; margin-left: 10px; padding: 2px 9px; border-radius: 999px; background: var(--muted); font-size: 12px; font-weight: 500; font-variant-numeric: tabular-nums; }
.lv-summary__range .ic { width: 13px; height: 13px; }
.lv-clear { display: inline-flex; align-items: center; gap: 5px; color: #4f46e5; font-weight: 600; text-decoration: none; }
.lv-clear .ic { width: 14px; height: 14px; }
.lv-clear:hover { text-decoration: underline; }
.lv-table { position: relative; flex: 1 1 auto; min-height: 0; overflow: auto; overscroll-behavior: contain; border: 1px solid var(--lv-line); border-radius: 12px; background: #fff; transition: opacity .15s; outline: none; }
.lv-table:focus-visible { box-shadow: 0 0 0 3px rgba(99, 102, 241, .2); }
.lv.is-loading .lv-table { opacity: .45; pointer-events: none; }
.lv-t { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 13.5px; }
.lv-t thead th { position: sticky; top: 0; z-index: 2; padding: 10px 14px; background: #fafafa; border-bottom: 1px solid var(--lv-line); text-align: left; font-size: 11.5px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--muted-foreground); }
.lv-t td { padding: 10px 14px; border-bottom: 1px solid #f1f1f3; vertical-align: middle; }
.lv-t tbody tr:not(.lv-t__day):hover td { background: #fafafb; }
.lv-t__day th { position: sticky; top: 37px; z-index: 1; padding: 8px 14px; background: linear-gradient(#f4f4f6, #f4f4f6); border-bottom: 1px solid var(--lv-line); text-align: left; font-size: 12px; font-weight: 700; color: var(--zinc-700); }
.lv-t__time { width: 92px; white-space: nowrap; font-variant-numeric: tabular-nums; color: var(--muted-foreground); }
.lv-t__kind { width: 190px; }
.lv-t__ip { width: 170px; text-align: right !important; }
.lv-t__ip code { font-size: 12px; color: var(--muted-foreground); }
.lv-t__ev { color: var(--foreground); overflow-wrap: anywhere; }
.lv-badge { display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px 3px 7px; border-radius: 999px; background: var(--bg); color: var(--c); font-size: 12px; font-weight: 600; white-space: nowrap; }
.lv-badge .ic { width: 13px; height: 13px; }
.lv-t tr.is-warn td { background: rgba(245, 158, 11, .07); }
.lv-t tr.is-warn:hover td { background: rgba(245, 158, 11, .12); }
.lv-t tr.is-warn td:first-child { box-shadow: inset 3px 0 0 #f59e0b; }
.lv-warn { display: inline-grid; place-items: center; vertical-align: -3px; margin-right: 7px; color: #d97706; }
.lv-warn .ic { width: 15px; height: 15px; }
.lv-empty { display: grid; place-items: center; align-content: center; gap: 8px; min-height: 100%; padding: 48px 20px; text-align: center; }
.lv-empty__ic { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; background: rgba(99, 102, 241, .1); color: #4f46e5; }
.lv-empty__ic .ic { width: 24px; height: 24px; }
.lv-empty b { font-size: 15px; }
.lv-empty p { margin: 0 0 6px; max-width: 360px; font-size: 13px; color: var(--muted-foreground); }
.lv-foot { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding-top: 12px; }
.lv-foot__note { font-size: 12px; color: var(--muted-foreground); }
.lv-pager { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.lv-pager__n { font-size: 13px; color: var(--muted-foreground); font-variant-numeric: tabular-nums; }
.lv-pager__n b { color: var(--foreground); }
.lv-pager .is-disabled { opacity: .45; pointer-events: none; }
@media (max-width: 900px) {
  .lv-t__kind { width: auto; }
  .lv-t thead .lv-t__ip, .lv-t td.lv-t__ip { display: none; }
  .lv-t__day th { top: 37px; }
}
@media (max-width: 640px) {
  .lv-t thead { display: none; }
  .lv-t__day th { top: 0; }
  .lv-t tbody tr:not(.lv-t__day) { display: grid; grid-template-columns: auto 1fr; gap: 4px 10px; padding: 10px 12px; border-bottom: 1px solid #f1f1f3; }
  .lv-t tbody tr:not(.lv-t__day) td { padding: 0; border: 0; background: none; }
  .lv-t td.lv-t__ev { grid-column: 1 / -1; }
  .lv-t tr.is-warn { background: rgba(245, 158, 11, .07); box-shadow: inset 3px 0 0 #f59e0b; }
  .lv-t tr.is-warn td:first-child { box-shadow: none; }
  .lv-seg { overflow-x: auto; max-width: 100%; }
  .lv-kinds { flex-wrap: nowrap; overflow-x: auto; margin: 0 -2px; padding: 2px; scrollbar-width: none; }
  .lv-kinds::-webkit-scrollbar { display: none; }
  .lv-kind { flex: 0 0 auto; }
  .lv-search kbd { display: none; }
  .lv-filters { gap: 10px; padding-bottom: 10px; }
}

/* =====================================================================================================
   Ayarlar · Sistem Durumu — üstte genel durum şeridi, solda gruplu kontroller, sağda kendi içinde kayan hata listesi
   ===================================================================================================== */
.ss { --ss-line: #e4e4e7; }
.ss .cs-card__head { flex: 0 0 auto; }
.ss-hero {
  flex: 0 0 auto; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 16px 20px; border-radius: 16px; border: 1px solid;
}
.ss-hero--ok { border-color: rgba(16, 185, 129, .3); background: linear-gradient(100deg, rgba(16, 185, 129, .12), rgba(16, 185, 129, .03) 60%); }
.ss-hero--warn { border-color: rgba(245, 158, 11, .35); background: linear-gradient(100deg, rgba(245, 158, 11, .14), rgba(245, 158, 11, .03) 60%); }
.ss-hero__pulse { position: relative; display: grid; place-items: center; flex: 0 0 auto; width: 44px; height: 44px; border-radius: 50%; color: #fff; font-size: 20px; font-weight: 800; }
.ss-hero__pulse .ic { width: 22px; height: 22px; }
.ss-hero--ok .ss-hero__pulse { background: #10b981; box-shadow: 0 8px 20px -8px rgba(16, 185, 129, .8); }
.ss-hero--warn .ss-hero__pulse { background: #f59e0b; box-shadow: 0 8px 20px -8px rgba(245, 158, 11, .8); }
.ss-hero__pulse::after { content: ""; position: absolute; inset: -5px; border-radius: 50%; border: 2px solid currentColor; opacity: 0; animation: ss-pulse 2.4s ease-out infinite; }
.ss-hero--ok .ss-hero__pulse::after { color: #10b981; }
.ss-hero--warn .ss-hero__pulse::after { color: #f59e0b; }
@keyframes ss-pulse { 0% { transform: scale(.9); opacity: .6; } 100% { transform: scale(1.35); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .ss-hero__pulse::after { animation: none; } }
.ss-hero__text { display: grid; gap: 2px; flex: 1 1 220px; }
.ss-hero__text b { font-size: 17px; font-weight: 700; letter-spacing: -.01em; }
.ss-hero--ok .ss-hero__text b { color: #065f46; }
.ss-hero--warn .ss-hero__text b { color: #92400e; }
.ss-hero__text span { font-size: 12.5px; color: var(--muted-foreground); font-variant-numeric: tabular-nums; }
.ss-hero__stats { display: flex; gap: 10px; margin: 0; }
.ss-hero__stats div { min-width: 96px; padding: 8px 14px; border-radius: 12px; background: rgba(255, 255, 255, .75); border: 1px solid var(--ss-line); }
.ss-hero__stats dt { font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--muted-foreground); }
.ss-hero__stats dd { margin: 2px 0 0; font-size: 22px; font-weight: 700; line-height: 1.1; font-variant-numeric: tabular-nums; color: var(--zinc-700); }
.ss-hero__stats dd small { font-size: 13px; font-weight: 600; color: var(--muted-foreground); }
.ss-hero__stats .is-ok dd { color: #047857; }
.ss-hero__stats .is-warn dd { color: #b45309; }
.ss-hero__stats .is-err dd { color: #be123c; }
.ss-body { position: relative; flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 16px; margin-top: 16px; }
.ss-groups { min-height: 0; overflow: auto; overscroll-behavior: contain; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: max-content; gap: 16px; align-content: start; align-items: start; padding: 2px; }
.ss-col { display: grid; gap: 16px; align-content: start; }
.ss-group { border: 1px solid var(--ss-line); border-radius: 16px; background: #fff; }
.ss-group header { display: flex; align-items: center; gap: 10px; padding: 10px 16px; border-bottom: 1px solid #f1f1f3; border-radius: 16px 16px 0 0; background: linear-gradient(180deg, #fafafa, #fff); }
.ss-group li:last-child { border-radius: 0 0 15px 15px; }
.ss-group__ic { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; background: var(--muted); color: var(--zinc-700); box-shadow: inset 0 0 0 1px var(--ss-line); }
.ss-group__ic .ic { width: 16px; height: 16px; }
.ss-group h3 { flex: 1; margin: 0; font-size: 14px; font-weight: 700; }
.ss-pill { padding: 2px 9px; border-radius: 999px; font-size: 11.5px; font-weight: 600; white-space: nowrap; }
.ss-pill--ok { color: #047857; background: rgba(16, 185, 129, .12); }
.ss-pill--warn { color: #b45309; background: rgba(245, 158, 11, .14); }
.ss-pill--err { color: #be123c; background: rgba(244, 63, 94, .12); }
.ss-pill--muted { color: var(--muted-foreground); background: var(--muted); }
.ss-group ul { list-style: none; margin: 0; padding: 4px 0; }
.ss-check { display: flex; align-items: center; gap: 12px; padding: 8px 16px; }
.ss-check + .ss-check { border-top: 1px solid #f4f4f5; }
.ss-check__mark { display: grid; place-items: center; flex: 0 0 auto; width: 22px; height: 22px; border-radius: 50%; color: #fff; font-size: 12px; font-weight: 800; }
.ss-check__mark .ic { width: 13px; height: 13px; }
.ss-check.is-ok .ss-check__mark { background: #10b981; }
.ss-check.is-warn .ss-check__mark { background: #f59e0b; }
.ss-check.is-info .ss-check__mark { background: #94a3b8; font-family: Georgia, serif; font-style: italic; }
.ss-check.is-warn { background: rgba(245, 158, 11, .06); box-shadow: inset 3px 0 0 #f59e0b; }
.ss-check__text { display: grid; gap: 1px; flex: 1; min-width: 0; }
.ss-check__text b { font-size: 13.5px; font-weight: 600; overflow-wrap: anywhere; }
.ss-check__text > span { font-size: 12.5px; color: var(--muted-foreground); overflow-wrap: anywhere; }
.ss-check.is-warn .ss-check__text > span { color: #92400e; }
.ss-check__val { flex: 0 0 auto; padding: 2px 8px; border-radius: 7px; background: var(--muted); font: 600 12px ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--zinc-700); }
.ss-errors { min-height: 0; display: flex; flex-direction: column; border: 1px solid var(--ss-line); border-radius: 16px; background: #fff; overflow: hidden; }
.ss-errors header { display: flex; align-items: center; gap: 10px; padding: 12px 16px 0; }
.ss-errors h3 { flex: 1; margin: 0; font-size: 14px; font-weight: 700; }
.ss-errors__sub { margin: 2px 16px 10px; font-size: 12px; color: var(--muted-foreground); }
.ss-errors__list { flex: 1 1 auto; min-height: 0; overflow: auto; overscroll-behavior: contain; list-style: none; margin: 0; padding: 0 0 6px; border-top: 1px solid #f1f1f3; outline: none; }
.ss-errors__list:focus-visible { box-shadow: inset 0 0 0 2px rgba(99, 102, 241, .35); }
.ss-errors__list li { display: grid; gap: 6px; padding: 12px 16px; border-bottom: 1px solid #f4f4f5; }
.ss-errors__list li.is-recent { box-shadow: inset 3px 0 0 #f43f5e; }
.ss-err__meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.ss-err__place { padding: 1px 8px; border-radius: 6px; background: rgba(244, 63, 94, .1); color: #be123c; font-size: 11.5px; font-weight: 600; }
.ss-errors__list li:not(.is-recent) .ss-err__place { background: var(--muted); color: var(--muted-foreground); }
.ss-err__meta time { font-size: 11.5px; color: var(--muted-foreground); font-variant-numeric: tabular-nums; }
.ss-errors__list code { font-size: 12px; line-height: 1.5; color: var(--zinc-700); white-space: pre-wrap; overflow-wrap: anywhere; }
.ss-errors__empty { flex: 1; display: grid; place-items: center; align-content: center; gap: 8px; padding: 30px 20px; text-align: center; border-top: 1px solid #f1f1f3; }
.ss-errors__empty > span { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: rgba(16, 185, 129, .12); color: #059669; }
.ss-errors__empty > span .ic { width: 22px; height: 22px; }
.ss-errors__empty b { font-size: 14px; }
.ss-errors__empty p { margin: 0; max-width: 260px; font-size: 12.5px; color: var(--muted-foreground); }
.ss.is-loading .ss-body { opacity: .5; transition: opacity .15s; }
@media (max-width: 1360px) { .ss-body { grid-template-columns: minmax(0, 1fr) 320px; } }
@media (max-width: 1180px) { .ss-groups { grid-template-columns: 1fr; } }
@media (max-width: 960px) {
  .ss-body { display: flex; flex-direction: column; overflow: auto; overscroll-behavior: contain; }
  .ss-groups, .ss-errors { flex: 0 0 auto; min-height: auto; overflow: visible; }
  .ss-errors__list { overflow: visible; }
}
@media (max-width: 640px) { .ss-hero__stats { width: 100%; } .ss-hero__stats div { flex: 1; min-width: 0; } }

/* =====================================================================================================
   Ayarlar · Ödeme Bilgileri (payment.js) — Profil düzeni (.pf-*) + kullanıcının göreceği kart ve örnek hesap
   ===================================================================================================== */
.pb-copy { display: inline-flex; align-items: center; gap: 5px; flex: 0 0 auto; height: 28px; padding: 0 9px; border: 1px solid var(--pf-line); border-radius: 8px; background: #fff; color: var(--zinc-700); font: 600 12px var(--font); cursor: pointer; transition: border-color .15s, color .15s, background .15s; }
.pb-copy .ic { width: 13px; height: 13px; }
.pb-copy:hover { border-color: var(--zinc-300); background: var(--muted); }
.pb-copy.is-done { border-color: rgba(16, 185, 129, .4); color: #047857; background: rgba(16, 185, 129, .08); }
.pb-copy:disabled { opacity: .45; cursor: default; }
.pb-mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace !important; letter-spacing: .03em; }
.pb-ok { display: inline-flex; align-items: center; gap: 5px; color: #047857 !important; font-weight: 600 !important; }
.pb-ok .ic { width: 13px; height: 13px; }
.pb-ok[hidden], .pb-hint[hidden] { display: none; }
.pb-hint { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 7px 10px; border-radius: 8px; background: var(--muted); color: var(--zinc-700) !important; }
.pb-hint__use { padding: 0; border: 0; background: none; color: #4f46e5; font: 600 11.5px var(--font); cursor: pointer; }
.pb-hint__use:hover { text-decoration: underline; }
.pb-suffix { position: relative; display: block; }
.pb-suffix input { width: 100%; padding-right: 34px !important; font-variant-numeric: tabular-nums; }
.pb-suffix em { position: absolute; right: 13px; top: 50%; transform: translateY(-50%); font-style: normal; font-weight: 600; color: var(--muted-foreground); pointer-events: none; }
/* Alçak ekranlarda (dizüstü) kontrol kartları kaydırma gerektirmeden sığsın */
@media (max-height: 860px) and (min-width: 961px) {
  .ss-hero { padding: 11px 18px; }
  .ss-hero__pulse { width: 38px; height: 38px; }
  .ss-hero__stats div { padding: 6px 12px; }
  .ss-hero__stats dd { font-size: 19px; }
  .ss-body { margin-top: 14px; }
  .ss-check { padding: 6px 16px; }
  .ss-group header { padding: 8px 16px; }
  .ss-groups, .ss-col { gap: 14px; }
}

/* =====================================================================================================
   Ayarlar · Güvenlik (security.js) — durum şeridi (.ss-hero), 2×2 panel, işlemler pencerelerde
   ===================================================================================================== */
.sc { --ss-line: #e4e4e7; }
.sc .cs-card__head { flex: 0 0 auto; }
.sc-body { position: relative; flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto minmax(0, 1fr); gap: 16px; margin-top: 16px; }
.sc-panel { display: flex; flex-direction: column; min-height: 0; border: 1px solid var(--ss-line); border-radius: 16px; background: #fff; }
.sc-panel > header { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-bottom: 1px solid #f1f1f3; }
.sc-panel > header > div { flex: 1; min-width: 0; }
.sc-panel h3 { margin: 0; font-size: 14px; font-weight: 700; }
.sc-panel header p { margin: 1px 0 0; font-size: 12px; color: var(--muted-foreground); }
.sc-panel__ic { display: grid; place-items: center; flex: 0 0 auto; width: 32px; height: 32px; border-radius: 9px; background: var(--muted); color: var(--zinc-700); box-shadow: inset 0 0 0 1px var(--ss-line); }
.sc-panel__ic .ic { width: 16px; height: 16px; }
.sc-facts { margin: 0; padding: 6px 16px; display: grid; }
.sc-facts > div { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 12px; align-items: center; padding: 9px 0; }
.sc-facts > div + div { border-top: 1px dashed #ececef; }
.sc-facts dt { font-size: 12px; font-weight: 600; color: var(--muted-foreground); }
.sc-facts dd { margin: 0; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13.5px; font-weight: 500; }
.sc-panel__actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: auto; padding: 12px 16px 14px; border-top: 1px solid #f4f4f5; }
.sc-danger { color: #be123c; }
.sc-danger:hover { border-color: rgba(244, 63, 94, .45); background: rgba(244, 63, 94, .05); }
.sc-meter { display: inline-flex; gap: 3px; }
.sc-meter i { width: 10px; height: 14px; border-radius: 3px; background: #e4e4e7; }
.sc-meter i.on { background: #10b981; }
.sc-meter.is-low i.on { background: #f59e0b; }
.sc-panel--list { overflow: hidden; }
.sc-now { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0; padding: 10px 16px; border-bottom: 1px solid #f4f4f5; font-size: 12.5px; color: var(--muted-foreground); }
.sc-now code, .sc-list code { font: 600 12px ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--zinc-700); }
.sc-list { flex: 1 1 auto; min-height: 0; overflow: auto; overscroll-behavior: contain; list-style: none; margin: 0; padding: 4px 0; }
.sc-list li { display: flex; align-items: center; gap: 10px; padding: 9px 16px; }
.sc-list li + li { border-top: 1px solid #f4f4f5; }
.sc-list li > div { display: grid; gap: 2px; flex: 1; min-width: 0; }
.sc-list li > div > span { font-size: 12px; color: var(--muted-foreground); overflow-wrap: anywhere; }
.sc-list li.is-here { background: rgba(16, 185, 129, .05); box-shadow: inset 3px 0 0 #10b981; }
.sc-list form { margin: 0; }
.sc-icon-btn { display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid transparent; border-radius: 8px; background: none; color: var(--muted-foreground); cursor: pointer; transition: color .15s, background .15s, border-color .15s; }
.sc-icon-btn .ic { width: 15px; height: 15px; }
.sc-icon-btn:hover, .sc-icon-btn:focus-visible { color: #be123c; background: rgba(244, 63, 94, .07); border-color: rgba(244, 63, 94, .25); outline: none; }
.sc-list--log b { font-size: 13px; font-weight: 600; overflow-wrap: anywhere; }
.sc-dot { flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%; background: #10b981; box-shadow: 0 0 0 3px rgba(16, 185, 129, .15); }
.sc-list--log li.is-warn { background: rgba(245, 158, 11, .06); }
.sc-list--log li.is-warn .sc-dot { background: #f59e0b; box-shadow: 0 0 0 3px rgba(245, 158, 11, .18); }
.sc-list--log li.is-warn b { color: #92400e; }
.sc-empty { flex: 1; display: grid; place-items: center; align-content: center; gap: 8px; padding: 24px; text-align: center; color: var(--muted-foreground); }
.sc-empty .ic { width: 22px; height: 22px; }
.sc-empty p { margin: 0; font-size: 12.5px; }
/* Pencereler */
.sc-dlg { width: min(460px, calc(100vw - 32px)); }
.sc-dlg form { display: contents; }
.sc-dlg__body { display: grid; gap: 14px; padding: 16px; }
.sc-dlg footer { display: flex; align-items: center; justify-content: flex-end; gap: 10px; flex-wrap: wrap; padding: 12px 16px 16px; border-top: 1px solid var(--border); }
.sc-dlg--codes footer { justify-content: space-between; }
.sc-dlg .cs-btn:disabled { opacity: .45; cursor: default; box-shadow: none; filter: none; transform: none; }
.sc-dlg__note { margin: 0; padding: 10px 12px; border-radius: 10px; background: var(--muted); font-size: 12.5px; line-height: 1.55; color: var(--zinc-700); }
.sc-dlg__note--warn { background: rgba(245, 158, 11, .1); color: #92400e; }
.sc-code { font: 600 18px ui-monospace, SFMono-Regular, Menlo, monospace !important; letter-spacing: .35em; text-align: center; }
.sc-strength { display: flex; align-items: center; gap: 10px; }
.sc-strength__bar { flex: 1; height: 5px; border-radius: 999px; background: #e4e4e7; overflow: hidden; }
.sc-strength__bar i { display: block; height: 100%; width: 0; border-radius: inherit; transition: width .2s, background .2s; }
.sc-strength.is-1 i { width: 25%; background: #e11d48; }
.sc-strength.is-2 i { width: 50%; background: #f59e0b; }
.sc-strength.is-3 i { width: 75%; background: #84cc16; }
.sc-strength.is-4 i { width: 100%; background: #10b981; }
.sc-strength small { min-width: 112px; text-align: right; }
@media (max-width: 1100px) {
  .sc-body { grid-template-columns: 1fr; grid-template-rows: none; grid-auto-rows: max-content; overflow: auto; overscroll-behavior: contain; }
  .sc-panel { min-height: auto; }
  .sc-panel--list { overflow: visible; }
  .sc-list { overflow: visible; }
}
@media (max-height: 860px) and (min-width: 1101px) {
  .sc .ss-hero { padding: 11px 18px; }
  .sc .ss-hero__pulse { width: 38px; height: 38px; }
  .sc .ss-hero__stats div { padding: 6px 12px; }
  .sc .ss-hero__stats dd { font-size: 19px; }
  .sc-panel > header { padding: 10px 16px; }
  .sc-facts > div { padding: 7px 0; }
}
/* Güvenlik: panel düğmeleri sağda; durum şeridindeki değerler sayfanın metin ölçeğinde */
.sc-panel__actions { justify-content: flex-end; }
.sc .ss-hero__stats div, .ss .ss-hero__stats div { min-width: 88px; padding: 7px 12px; }
.sc .ss-hero__stats dt, .ss .ss-hero__stats dt { font-size: 10.5px; }
.sc .ss-hero__stats dd, .ss .ss-hero__stats dd { margin-top: 1px; font-size: 15px; font-weight: 700; line-height: 1.3; }
.sc .ss-hero__stats dd small, .ss .ss-hero__stats dd small { font-size: 12px; }
@media (max-height: 860px) and (min-width: 961px) { .sc .ss-hero__stats dd, .ss .ss-hero__stats dd { font-size: 15px; } .ss .ss-hero__stats div { padding: 7px 12px; } }

/* =====================================================================================================
   Ödeme Bilgileri — solda hesap bilgileri formu, sağda kullanıcının portalda gördüğü ödeme ekranının önizlemesi
   ===================================================================================================== */
.pb { --pf-line: #e4e4e7; }
.pb-body { position: relative; flex: 1 1 auto; min-height: 0; overflow: auto; overscroll-behavior: contain; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.18fr); gap: 18px; align-items: start; padding: 2px; }
.pb-panel { display: flex; flex-direction: column; border: 1px solid var(--pf-line); border-radius: 16px; background: #fff; }
.pb-panel__head { display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: 1px solid #f1f1f3; }
.pb-panel__head > div { flex: 1; min-width: 0; }
.pb-panel__head h3 { margin: 0; font-size: 14px; font-weight: 700; }
.pb-panel__head p { margin: 1px 0 0; font-size: 12px; color: var(--muted-foreground); }
.pb-panel__body { display: grid; gap: 16px; padding: 18px; }
.pb-panel--preview { background: linear-gradient(180deg, #fafafa, #fff 120px); }
.pb-rate { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 16px; border-top: 1px dashed #ececef; }
.pb-rate__text { display: grid; gap: 2px; min-width: 0; }
.pb-rate__text label { font-size: 12.5px; font-weight: 600; color: var(--zinc-700); cursor: pointer; }
.pb-rate__text small { font-size: 11.5px; color: var(--muted-foreground); }
.pb-rate .pb-suffix { flex: 0 0 104px; }
.pb-rate .pb-suffix input { height: 40px; text-align: right; font-weight: 600; }
/* Önizleme: portaldaki .cs-pay__bank + .cs-tax görünümü */
.pb-preview { gap: 14px; }
.pb-pay { display: grid; gap: 10px; padding: 14px 16px; border: 1px solid var(--pf-line); border-radius: 12px; background: #fff; }
.pb-pay__bank { display: flex; align-items: center; gap: 10px; min-height: 30px; padding-bottom: 10px; border-bottom: 1px solid #f1f1f3; }
.pb-pay__bank img { display: block; height: 22px; width: auto; max-width: 100%; }
.pb-pay__bank b { font-size: 14px; font-weight: 700; }
.pb-acct__mono { display: grid; place-items: center; flex: 0 0 auto; width: 30px; height: 30px; border-radius: 9px; background: var(--muted); color: var(--zinc-700); font-size: 12px; font-weight: 700; box-shadow: inset 0 0 0 1px var(--pf-line); }
.pb-pay__label { display: flex; align-items: center; gap: 6px; margin: 0; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted-foreground); }
.pb-pay__label .ic { width: 13px; height: 13px; }
.pb-pay__dl { margin: 0; display: grid; }
.pb-pay__dl > div { display: grid; grid-template-columns: 118px minmax(0, 1fr); align-items: center; gap: 10px; padding: 8px 0; border-top: 1px solid #f1f1f3; font-size: 13px; }
.pb-pay__dl > div:first-child { border-top: 0; }
.pb-pay__dl dt { color: var(--muted-foreground); }
.pb-pay__dl dd { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0; font-weight: 500; min-width: 0; overflow-wrap: anywhere; }
.pb-pay__dl .pb-mono { font-size: 12.5px; white-space: nowrap; }
.pb-pay__dl .is-total dd { font-size: 16px; font-weight: 700; color: #047857; }
.pb-copy { display: inline-flex; align-items: center; gap: 5px; height: 24px; padding: 0 8px; border: 1px solid var(--pf-line); border-radius: 7px; background: #fff; color: var(--zinc-700); font: 600 11.5px var(--font); cursor: pointer; transition: border-color .15s, color .15s, background .15s; }
.pb-copy .ic { width: 12px; height: 12px; }
.pb-copy:hover { border-color: var(--zinc-300); background: var(--muted); }
.pb-copy.is-done { border-color: rgba(16, 185, 129, .4); color: #047857; background: rgba(16, 185, 129, .08); }
.pb-copy:disabled { opacity: .45; cursor: default; }
.pb-tax { margin: 0; display: grid; border: 1px solid var(--pf-line); border-radius: 12px; overflow: hidden; background: #fff; }
.pb-tax > div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 10px 14px; border-top: 1px solid var(--pf-line); font-size: 13px; }
.pb-tax > div:first-child { border-top: 0; }
.pb-tax dt { font-weight: 500; }
.pb-tax dt small { display: block; margin-top: 2px; font-size: 11px; font-weight: 400; color: var(--muted-foreground); }
.pb-tax dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.pb-tax .is-minus dd { color: #b45309; }
.pb-tax .is-total { background: rgba(16, 185, 129, .08); }
.pb-tax .is-total dt, .pb-tax .is-total dd { font-weight: 700; color: #047857; }
.pb-tax .is-muted dt, .pb-tax .is-muted dd { color: var(--muted-foreground); font-weight: 500; }
@media (max-width: 1180px) { .pb-body { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .pb-pay__dl > div { grid-template-columns: 1fr; gap: 2px; } }
/* Ödeme Bilgileri: iki kart eşit boyutta, kartın kenarlarına ve alt şeride eşit uzaklıkta (21 px = kart iç boşluğu) */
.pb-body { --pb-gap: 21px; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: minmax(0, 1fr); align-items: stretch; gap: var(--pb-gap); padding: 0; margin-top: calc(var(--pb-gap) - 16px); overflow: hidden; }
.pb .pf-foot { margin-top: var(--pb-gap, 21px); }
.pb { --pb-gap: 21px; }
.pb-panel { min-height: 0; }
.pb-panel__body { flex: 1 1 auto; min-height: 0; overflow: auto; overscroll-behavior: contain; align-content: start; }
.pb-pay__dl > div { grid-template-columns: 108px minmax(0, 1fr); gap: 8px; }
.pb-pay__dl .pb-mono { font-size: 12px; }
@media (max-width: 1180px) { .pb-body { grid-template-columns: 1fr; grid-template-rows: none; overflow: auto; } .pb-panel__body { overflow: visible; } }
.pb-pay__dl > div { grid-template-columns: 124px minmax(0, 1fr); }
/* Kopyala: önizlemede yalnız simge (ipucu "IBAN'ı kopyala"); kopyalanınca yeşil tik */
.pb-copy { width: 26px; height: 24px; padding: 0; justify-content: center; }
.pb-copy span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.pb-copy { position: relative; }

/* =====================================================================================================
   Genel Bakış — karşılama şeridi + hızlı erişim, renkli sayı kartları, üç panel (iş akışı, süreler, mesajlar); sabit sayfa
   ===================================================================================================== */
.ov { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; gap: 18px; }
.ov > .cs-alert { margin: 0; flex: 0 0 auto; }
.ov-hero {
  flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; padding: 18px 22px; border-radius: 18px; color: #fff;
  background: linear-gradient(160deg, #4a4e57 0%, #34373e 38%, #23252a 100%);
  box-shadow: 0 18px 34px -22px rgba(24, 24, 27, .8), inset 0 1px 0 rgba(255, 255, 255, .12); position: relative; overflow: hidden;
}
.ov-hero::after { content: ""; position: absolute; right: -80px; top: -120px; width: 320px; height: 320px; border-radius: 50%; background: radial-gradient(circle, rgba(255, 255, 255, .1), transparent 70%); pointer-events: none; }
.ov-hero__text { display: grid; gap: 4px; min-width: 0; flex: 1 1 420px; }
.ov-hero__date { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: rgba(255, 255, 255, .6); }
.ov-hero__date .ic { width: 13px; height: 13px; }
.ov-hero h1 { margin: 0; font-size: 22px; font-weight: 700; letter-spacing: -.015em; }
.ov-hero p { margin: 0; font-size: 13.5px; color: rgba(255, 255, 255, .82); }
.ov-hero p b { color: #fff; }
.ov-hero__soon { color: #fcd34d; font-weight: 600; }
.ov-hero__meta { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 12px !important; color: rgba(255, 255, 255, .6) !important; }
.ov-hero__meta .ic { width: 13px; height: 13px; }
.ov-hero__meta code { font: 600 11.5px ui-monospace, SFMono-Regular, Menlo, monospace; color: rgba(255, 255, 255, .78); }
.ov-hero__warn { margin-left: 6px; padding: 1px 8px; border-radius: 999px; background: rgba(245, 158, 11, .2); color: #fcd34d; font-weight: 600; text-decoration: none; }
.ov-hero__warn:hover { background: rgba(245, 158, 11, .3); }
.ov-quick { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(4, 96px); gap: 8px; }
.ov-quick a { display: grid; justify-items: center; gap: 7px; padding: 12px 6px 10px; border-radius: 12px; background: rgba(255, 255, 255, .08); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12); color: #fff; text-decoration: none; text-align: center; transition: background .15s, transform .15s; }
.ov-quick a:hover, .ov-quick a:focus-visible { background: rgba(255, 255, 255, .16); transform: translateY(-2px); outline: none; }
.ov-quick .ic { width: 18px; height: 18px; }
.ov-quick span { font-size: 11.5px; font-weight: 600; line-height: 1.25; }
.ov-stats { flex: 0 0 auto; margin: -4px; }
.ov-stats .cs-stat { padding: 16px 18px; }
.ov-stats .cs-stat__value { font-size: 40px; padding-top: 8px; }
.ov-grid { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.ov-panel { display: flex; flex-direction: column; min-height: 0; border: 1px solid #e4e4e7; border-radius: 16px; background: #fff; overflow: hidden; box-shadow: 0 1px 2px rgba(0, 0, 0, .03); }
.ov-panel > header { flex: 0 0 auto; display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-bottom: 1px solid #f1f1f3; }
.ov-panel > header > div { flex: 1; min-width: 0; }
.ov-panel h3 { margin: 0; font-size: 14px; font-weight: 700; }
.ov-panel header p { margin: 1px 0 0; font-size: 12px; color: var(--muted-foreground); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ov-panel__alert { margin: 10px 16px 0; }
.ov-tone--amber { --c: #b45309; --cb: rgba(245, 158, 11, .14); --cs: #f59e0b; }
.ov-tone--sky { --c: #0369a1; --cb: rgba(14, 165, 233, .12); --cs: #0ea5e9; }
.ov-tone--emerald { --c: #047857; --cb: rgba(16, 185, 129, .12); --cs: #10b981; }
.ov-tone--violet { --c: #6d28d9; --cb: rgba(139, 92, 246, .12); --cs: #8b5cf6; }
.ov-tone--rose { --c: #be123c; --cb: rgba(244, 63, 94, .12); --cs: #f43f5e; }
/* İş akışı */
.ov-flow { flex: 1 1 auto; min-height: 0; overflow: auto; list-style: none; margin: 0; padding: 8px 0; }
.ov-flow__row a { display: grid; grid-template-columns: minmax(0, 1fr) 90px 28px; align-items: center; gap: 12px; padding: 9px 16px; color: inherit; text-decoration: none; transition: background .15s; }
.ov-flow__row a:hover { background: #fafafb; }
.ov-flow__lab { font-size: 13px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ov-flow__lab em { margin-left: 4px; padding: 1px 6px; border-radius: 999px; background: var(--cb); color: var(--c); font-style: normal; font-size: 10.5px; font-weight: 600; }
.ov-flow__bar { height: 8px; border-radius: 999px; background: #f1f1f3; overflow: hidden; }
.ov-flow__bar i { display: block; height: 100%; width: var(--w, 0%); min-width: 0; border-radius: inherit; background: linear-gradient(90deg, var(--cs), color-mix(in srgb, var(--cs) 70%, #fff)); }
.ov-flow__row b { text-align: right; font-size: 15px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--c); }
.ov-flow__row.is-zero .ov-flow__lab, .ov-flow__row.is-zero b { color: var(--muted-foreground); font-weight: 500; }
.ov-flow__row.is-action { background: rgba(245, 158, 11, .06); box-shadow: inset 3px 0 0 #f59e0b; }
.ov-flow__foot { flex: 0 0 auto; margin: 0; padding: 10px 16px; border-top: 1px solid #f4f4f5; font-size: 12px; color: var(--muted-foreground); }
.ov-flow__foot b { color: var(--foreground); }
/* Süreler ve mesajlar */
.ov-list { flex: 1 1 auto; min-height: 0; overflow: auto; overscroll-behavior: contain; list-style: none; margin: 0; padding: 4px 0; }
.ov-list > li + li { border-top: 1px solid #f4f4f5; }
.ov-list a { display: flex; align-items: center; gap: 12px; padding: 10px 16px; color: inherit; text-decoration: none; transition: background .15s; }
.ov-list a:hover, .ov-list a:focus-visible { background: #fafafb; outline: none; }
.ov-due__cal { display: grid; place-items: center; flex: 0 0 auto; width: 42px; height: 44px; border-radius: 10px; background: var(--cb); color: var(--c); line-height: 1; }
.ov-due__cal b { font-size: 17px; font-weight: 800; }
.ov-due__cal small { margin-top: -4px; font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.ov-due__main { display: grid; gap: 2px; flex: 1; min-width: 0; }
.ov-due__main b { font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ov-due__main small { font-size: 12px; color: var(--muted-foreground); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ov-due__left { flex: 0 0 auto; padding: 3px 9px; border-radius: 999px; background: var(--cb); color: var(--c); font-size: 11.5px; font-weight: 700; white-space: nowrap; }
.ov-msg a { align-items: flex-start; }
.ov-msg__av { display: grid; place-items: center; flex: 0 0 auto; width: 34px; height: 34px; border-radius: 50%; background: var(--cb); color: var(--c); font-size: 12px; font-weight: 700; }
.ov-msg__main { display: grid; gap: 1px; flex: 1; min-width: 0; }
.ov-msg__top { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.ov-msg__top b { font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ov-msg__top time { flex: 0 0 auto; font-size: 11.5px; color: var(--muted-foreground); }
.ov-msg__src { font-size: 11.5px; font-weight: 600; color: var(--muted-foreground); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ov-msg__body { font-size: 12.5px; color: var(--zinc-700); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-height: 860px) and (min-width: 1101px) {
  .ov { gap: 14px; }
  .ov-hero { padding: 14px 20px; }
  .ov-hero h1 { font-size: 20px; }
  .ov-quick a { padding: 10px 6px 8px; }
  .ov-stats .cs-stat { padding: 14px 16px; }
  .ov-stats .cs-stat__value { font-size: 34px; }
}
@media (max-width: 1280px) { .ov-quick { grid-template-columns: repeat(4, 84px); } }
@media (max-width: 1100px) {
  .ov { overflow: auto; overscroll-behavior: contain; }
  .ov-grid { grid-template-columns: 1fr; flex: 0 0 auto; }
  .ov-panel { overflow: visible; }
  .ov-list, .ov-flow { overflow: visible; }
  .ov-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) { .ov-quick { grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; } .ov-hero__text { flex-basis: 100%; } }
.ov-flow__group { padding: 10px 16px 4px; font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted-foreground); }
.ov-flow__group:not(:first-child) { margin-top: 6px; border-top: 1px dashed #ececef; padding-top: 12px; }
.ov-flow__row a { grid-template-columns: minmax(0, 1fr) minmax(60px, 120px) 28px; }
.lv-kind--teal, .lv-badge--teal { --c: #0f766e; --bg: rgba(20, 184, 166, .12); }

/* =====================================================================================================
   Sayı kartları (Genel Bakış) — açık buzlu cam, platin ikon rozeti (kullanıcı 2026-10-09: B)
   ===================================================================================================== */
.cs-stat { background: linear-gradient(160deg, rgba(255, 255, 255, .95), rgba(244, 245, 247, .9)) !important; color: #18181b; border: 1px solid #e4e4e7;
  box-shadow: 0 1px 2px rgba(24, 24, 27, .04), 0 14px 28px -18px rgba(24, 24, 27, .35), inset 0 1px 0 #fff; }
.cs-stat:hover { box-shadow: 0 1px 2px rgba(24, 24, 27, .05), 0 20px 34px -18px rgba(24, 24, 27, .42), inset 0 1px 0 #fff; }
.cs-stat::before { display: none; }
.cs-stat__icon { background: linear-gradient(180deg, #ffffff 0%, #eceef1 45%, #cfd3d9 100%); color: #34373e; box-shadow: inset 0 1px 0 #fff, inset 0 0 0 1px rgba(24, 24, 27, .08), 0 3px 8px -3px rgba(24, 24, 27, .3); }
.cs-stat__deco { color: rgba(24, 24, 27, .025); }
.cs-stat__label { color: #71717a; }
.cs-stat__value { color: #23252a; text-shadow: none; }

/* Genel Bakış: finans şeridi */
.ov-fin { flex: 0 0 auto; display: flex; align-items: stretch; border: 1px solid #e4e4e7; border-radius: 14px; background: #fff; overflow: hidden; }
.ov-fin__head { display: flex; align-items: center; gap: 10px; padding: 10px 16px; border-right: 1px solid #f1f1f3; background: #fafafa; }
.ov-fin__head b { font-size: 13px; } .ov-fin__head small { display: block; font-size: 11px; color: var(--muted-foreground); }
.ov-fin__item { flex: 1; display: grid; gap: 1px; padding: 9px 16px; border-right: 1px solid #f4f4f5; text-decoration: none; color: inherit; transition: background .15s; }
.ov-fin__item:hover { background: #fafafb; }
.ov-fin__item span { font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--muted-foreground); }
.ov-fin__item b { font-size: 16px; font-weight: 700; font-variant-numeric: tabular-nums; }
.ov-fin__item b.is-pos { color: #047857; } .ov-fin__item b.is-neg { color: #be123c; }
.ov-fin__more { display: flex; align-items: center; gap: 6px; padding: 0 16px; font-size: 12.5px; font-weight: 600; color: #4f46e5; text-decoration: none; white-space: nowrap; }
.ov-fin__more:hover { background: rgba(99, 102, 241, .06); }

/* =====================================================================================================
   Finans (inc/finance.php, finance.js)
   ===================================================================================================== */
.fn { --fn-line: #e4e4e7; --pf-line: #e4e4e7; }
.fn .cs-card__head { flex: 0 0 auto; }
.fn .cs-card__head .cs-seg + .cs-btn { margin-left: 8px; }
.fn-alert { flex: 0 0 auto; margin: 0 0 12px; }
.fn-seg a { padding: 5px 11px; }
.fn-delta { display: inline-flex; align-items: center; padding: 1px 7px; border-radius: 999px; font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums; }
.fn-delta.is-good { color: #047857; background: rgba(16, 185, 129, .12); }
.fn-delta.is-bad { color: #be123c; background: rgba(244, 63, 94, .1); }
.fn-delta.is-flat { color: var(--muted-foreground); background: var(--muted); }
.fn-delta.is-new { color: #4f46e5; background: rgba(99, 102, 241, .1); }
.fn-kpis { flex: 0 0 auto; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.fn-kpi { position: relative; display: grid; gap: 4px; padding: 13px 14px 12px; border: 1px solid var(--fn-line); border-radius: 14px; background: #fff; color: inherit; text-decoration: none; overflow: hidden; transition: border-color .15s, transform .15s, box-shadow .15s; }
.fn-kpi::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--k); }
a.fn-kpi:hover { border-color: #d4d4d8; transform: translateY(-2px); box-shadow: 0 10px 18px -14px rgba(0, 0, 0, .35); }
.fn-kpi--inc { --k: #10b981; } .fn-kpi--exp { --k: #f43f5e; } .fn-kpi--net { --k: #6366f1; } .fn-kpi--recv { --k: #f59e0b; } .fn-kpi--in { --k: #0ea5e9; } .fn-kpi--done { --k: #14b8a6; }
.fn-kpi__lab { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted-foreground); }
.fn-kpi__lab .ic { width: 13px; height: 13px; color: var(--k); }
.fn-kpi > b { font-size: 19px; font-weight: 800; letter-spacing: -.01em; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fn-kpi--net.is-neg > b { color: #be123c; }
.fn-kpi__sub { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 11.5px; color: var(--muted-foreground); }
.fn-grid { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); grid-template-rows: minmax(0, 1.25fr) minmax(0, 1fr); gap: 16px; }
.fn-panel--jobs { grid-column: 1 / -1; }
.fn-legend { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted-foreground); white-space: nowrap; }
.fn-legend i { width: 10px; height: 10px; border-radius: 3px; margin-left: 6px; } .fn-legend i.is-inc { background: #10b981; } .fn-legend i.is-exp { background: #f43f5e; }
.fn-chartbox { flex: 1 1 auto; min-height: 0; padding: 10px 14px 8px; }
.fn-chart { display: block; width: 100%; height: 100%; }
.fn-chart__grid { stroke: #f1f1f3; stroke-width: 1; }
.fn-chart__ax { fill: #a1a1aa; font: 500 11px var(--font); }
.fn-chart__inc { fill: #10b981; } .fn-chart__exp { fill: #f43f5e; }
.fn-chart rect:hover { opacity: .8; }
.fn-cats { flex: 1 1 auto; min-height: 0; overflow: auto; list-style: none; margin: 0; padding: 6px 0; }
.fn-cats a { display: grid; gap: 6px; padding: 8px 16px; color: inherit; text-decoration: none; }
.fn-cats a:hover { background: #fafafb; }
.fn-cats__top { display: flex; align-items: center; gap: 8px; }
.fn-cats__lab { flex: 1; min-width: 0; font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fn-cats__top b { font-size: 12.5px; font-variant-numeric: tabular-nums; }
.fn-cats__bar { height: 6px; border-radius: 999px; background: #f1f1f3; overflow: hidden; }
.fn-cats__bar i { display: block; height: 100%; width: var(--w, 0%); border-radius: inherit; background: var(--c, #a1a1aa); }
.fn-dot { display: inline-block; flex: 0 0 auto; width: 9px; height: 9px; border-radius: 3px; background: var(--c, #a1a1aa); vertical-align: 0; }
.fn-tablewrap { flex: 1 1 auto; min-height: 0; overflow: auto; overscroll-behavior: contain; }
.fn-tablewrap--fill { border: 1px solid var(--fn-line); border-radius: 12px; background: #fff; }
.fn-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 13px; }
.fn-table thead th { position: sticky; top: 0; z-index: 1; padding: 9px 14px; background: #fafafa; border-bottom: 1px solid var(--fn-line); text-align: left; font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted-foreground); white-space: nowrap; }
.fn-table td { padding: 9px 14px; border-bottom: 1px solid #f4f4f5; vertical-align: middle; }
.fn-table tbody tr:hover td { background: #fafafb; }
.fn-table tr.is-muted td { color: var(--muted-foreground); }
.fn-table .is-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.fn-table .is-pos { color: #047857; font-weight: 600; } .fn-table .is-neg { color: #be123c; font-weight: 600; }
.fn-table td small { display: block; font-size: 11.5px; color: var(--muted-foreground); }
.fn-table a { color: inherit; text-decoration: none; } .fn-table a:hover { color: #4f46e5; text-decoration: underline; }
.fn-date { white-space: nowrap; color: var(--zinc-700); }
.fn-desc { max-width: 380px; overflow-wrap: anywhere; }
.fn-act { width: 1%; white-space: nowrap; text-align: right; }
.fn-act form { display: inline; margin: 0; }
.fn-act .sc-icon-btn { display: inline-grid; }
.fn-edit:hover, .fn-rc:hover { color: #4f46e5 !important; background: rgba(99, 102, 241, .07) !important; border-color: rgba(99, 102, 241, .25) !important; }
.fn-auto { font-size: 11.5px; }
.fn-badge { display: inline-flex; padding: 1px 7px; border-radius: 6px; background: var(--muted); color: var(--zinc-700); font-size: 11px; font-weight: 600; }
.fn-badge--portal { background: rgba(16, 185, 129, .12); color: #047857; }
.fn-cat { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; }
.fn-age { font-weight: 600; } .fn-age.is-late { color: #be123c; }
.fn-strip { flex: 0 0 auto; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.fn-strip > div { display: grid; gap: 2px; padding: 11px 14px; border: 1px solid var(--fn-line); border-radius: 12px; background: #fff; }
.fn-strip span { font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted-foreground); }
.fn-strip b { font-size: 17px; font-weight: 800; font-variant-numeric: tabular-nums; }
.fn-strip small { font-size: 11.5px; color: var(--muted-foreground); }
.fn-strip .is-warn { border-color: rgba(245, 158, 11, .4); background: rgba(245, 158, 11, .06); } .fn-strip .is-warn b { color: #b45309; }
.fn-strip .is-info { border-color: rgba(14, 165, 233, .35); background: rgba(14, 165, 233, .05); } .fn-strip .is-info b { color: #0369a1; }
.fn-split { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 16px; }
.fn-side { min-height: 0; overflow: auto; padding: 4px 2px; }
.fn-side__t { margin: 6px 8px 6px; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted-foreground); }
.fn-side__t + .fn-filter { margin-bottom: 14px; }
.fn-filter { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.fn-filter a { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 7px 10px; border-radius: 9px; color: var(--zinc-700); font-size: 12.5px; text-decoration: none; }
.fn-filter a > span { display: inline-flex; align-items: center; gap: 7px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fn-filter a b { font-size: 11.5px; font-weight: 600; color: var(--muted-foreground); font-variant-numeric: tabular-nums; }
.fn-filter a:hover { background: var(--muted); }
.fn-filter a.is-on { background: #18181b; color: #fff; } .fn-filter a.is-on b { color: rgba(255, 255, 255, .7); }
.fn-main { min-height: 0; display: flex; flex-direction: column; }
.fn-dlg { --pf-line: #e4e4e7; width: min(560px, calc(100vw - 32px)); }
.fn-dlg select { height: 42px; padding: 0 12px; border: 1px solid var(--pf-line); border-radius: 10px; background: #fff; font: 500 14px var(--font); color: var(--foreground); }
.fn-dlg select:focus { outline: none; border-color: #6366f1; box-shadow: 0 0 0 3px rgba(99, 102, 241, .12); }
.fn-dlg .pf-field em { font-style: normal; font-weight: 500; color: var(--muted-foreground); }
.fn-file input[type=file] { height: auto; padding: 8px; font-size: 12.5px; }
.fn-file__cur[hidden], .fn-file__rm[hidden] { display: none !important; }
.fn-money { text-align: right; font-variant-numeric: tabular-nums; }
@media (max-height: 860px) and (min-width: 1101px) { .fn-kpi { padding: 10px 12px; } .fn-kpi > b { font-size: 17px; } .fn-kpis { margin-bottom: 12px; } }
@media (max-width: 1400px) { .fn-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1100px) {
  .fn-grid { grid-template-columns: 1fr; grid-template-rows: none; overflow: auto; }
  .fn-panel--chart { min-height: 300px; }
  .fn-split { grid-template-columns: 1fr; grid-template-rows: auto minmax(0, 1fr); }
  .fn-side { display: flex; gap: 12px; overflow-x: auto; } .fn-side .fn-filter { display: flex; } .fn-side__t { display: none; }
  .fn-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ov-fin { flex-wrap: wrap; } .ov-fin__head { display: none; } .ov-fin__item { flex: 1 1 45%; }
}
@media (max-width: 640px) { .fn-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } .fn-desc { max-width: 200px; } }
.fn-split { grid-template-columns: 270px minmax(0, 1fr); }
.fn-filter a > span { flex: 1 1 auto; }
.fn-filter a b { flex: 0 0 auto; }
.fn-table .cs-mono, .fn-table td:has(> .cs-mono) { white-space: nowrap; }
.fn-table th.fn-desc, .fn-table td.fn-desc { width: 40%; max-width: none; }
.fn-cat { white-space: nowrap; }

/* İş detayı → Giderler kartı */
.fn-jobcard { --fn-line: #e4e4e7; --pf-line: #e4e4e7; }
.fn-strip--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fn-strip b.is-pos { color: #047857; } .fn-strip b.is-neg { color: #be123c; }
.fn-strip .is-gain { border-color: rgba(16, 185, 129, .35); background: rgba(16, 185, 129, .05); } .fn-strip .is-gain b { color: #047857; }
.fn-strip .is-loss { border-color: rgba(244, 63, 94, .35); background: rgba(244, 63, 94, .05); } .fn-strip .is-loss b { color: #be123c; }
.fn-jobcard .fn-tablewrap { max-height: 360px; }
@media (max-width: 640px) { .fn-strip--3 { grid-template-columns: 1fr; } }

/* Finans: özel tarih aralığı (dönem düğmelerinin yanında) */
.fn-range { display: inline-flex; align-items: center; gap: 4px; margin: 0 0 0 8px; padding: 2px 6px; border: 1px dashed #d4d4d8; border-radius: 10px; color: var(--muted-foreground); }
.fn-range > .ic { width: 14px; height: 14px; margin: 0 2px; }
.fn-range.is-on { border-style: solid; border-color: #18181b; background: #fff; color: var(--foreground); box-shadow: 0 1px 2px rgba(0, 0, 0, .06); }
.fn-range input { height: 28px; padding: 0 6px; border: 1px solid transparent; border-radius: 7px; background: transparent; font: 500 12.5px var(--font); color: var(--foreground); }
.fn-range input:hover { background: var(--muted); }
.fn-range input:focus { outline: none; border-color: #6366f1; background: #fff; box-shadow: 0 0 0 3px rgba(99, 102, 241, .12); }
.fn-range.is-busy { opacity: .6; pointer-events: none; }
.fn .cs-card__head > div:last-child, .fn .cs-card__actions { flex-wrap: wrap; justify-content: flex-end; row-gap: 8px; }

/* ---- Lisanslar (SGF masaüstü lisansları) ---- */
.cs-chip--zinc { background: var(--muted); color: var(--zinc-600); border-color: var(--border); }
.ls-decide { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px 24px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); }
.ls-decide form { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px; margin: 0; }
.ls-decide__no { margin-left: auto !important; }
.ls-decide .cs-field input[type="date"] { width: 160px; }
.ls-decide__no .cs-field input { width: 280px; max-width: 100%; }
.ls-decide .cs-check, .ls-op .cs-check { align-self: center; padding-bottom: 2px; }
.ls-ops { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.ls-op { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 14px 16px; border: 1px solid var(--border); border-radius: 12px; background: #fff; }
.ls-op__t { display: flex; align-items: center; gap: 8px; margin: 0; font-weight: 600; }
.ls-op__t .ic { width: 16px; height: 16px; color: var(--muted-foreground); }
.ls-op__f { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px; }
.ls-op__f .cs-field { flex: 1 1 160px; }
.ls-op__n { margin: 0; font-size: 12.5px; }
.ls-op .cs-btn { align-self: flex-start; margin-top: auto; }
.ls-note { display: grid; gap: 10px; }
.ls-table td { vertical-align: top; }
.ls-table td .cs-chip { margin-top: 2px; }
@media (max-width: 720px) { .ls-decide__no { margin-left: 0 !important; } }