:root {
  --mor: #98469E;
  --macenta: #CB479A;
  --pembe: #E44D94;
  --mercan: #F48164;
  --turuncu: #F6A24A;
  --grad: linear-gradient(90deg, var(--turuncu), var(--pembe));
  --ink: #2b1a30;
  --muted: #6b5b6e;
  --line: #e9dfe8;
  --bg: #faf7fb;
  --card: #ffffff;
  --danger: #d64545;
  --ok: #2f9e63;
  font-size: 16px;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  color: var(--ink);
  background: var(--bg);
  line-height: 1.5;
}

a { color: var(--macenta); }

/* ------------------------------------------------------------ üst çubuk */
.topbar {
  background: #1b0f1e;
  color: #fff;
  padding: 0 22px;
  display: flex;
  align-items: center;
  gap: 26px;
  flex-wrap: wrap;
}
.topbar .brand {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 0;
  font-weight: 700;
  letter-spacing: .01em;
}
.topbar .brand img { height: 26px; width: auto; display: block; }
.topbar nav { display: flex; gap: 4px; flex-wrap: wrap; flex: 1; }
.topbar nav a {
  color: #cdbfd0;
  text-decoration: none;
  font-size: .88rem;
  font-weight: 600;
  padding: 16px 12px;
  border-bottom: 3px solid transparent;
  white-space: nowrap;
}
.topbar nav a:hover { color: #fff; }
.topbar nav a.aktif { color: #fff; border-bottom-color: var(--pembe); }
.topbar nav a .rozet {
  display: inline-block;
  background: var(--pembe);
  color: #fff;
  border-radius: 999px;
  padding: 1px 7px;
  font-size: .7rem;
  margin-left: 5px;
}
.topbar .who { font-size: .8rem; color: #a99bad; padding: 12px 0; }
.topbar .who a { color: var(--pembe); text-decoration: none; font-weight: 600; margin-left: 10px; }

/* ------------------------------------------------------------ yerleşim */
.wrap { max-width: 1180px; margin: 0 auto; padding: 26px 18px 60px; }
.wrap.dar { max-width: 420px; }

h1.baslik { font-size: 1.35rem; margin: 0 0 4px; }
.alt-baslik { color: var(--muted); font-size: .88rem; margin: 0 0 22px; }

.kart {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 20px 22px;
  margin-bottom: 18px;
}
.kart > h2 {
  font-size: .95rem;
  margin: 0 0 14px;
  color: var(--mor);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.kart-satir { display: flex; gap: 18px; flex-wrap: wrap; }
.kart-satir > * { flex: 1 1 320px; min-width: 0; }

/* ------------------------------------------------------------ bildirim */
.bildirim {
  border-radius: 11px;
  padding: 12px 16px;
  margin-bottom: 16px;
  font-size: .9rem;
  border: 1px solid;
}
.bildirim.ok { background: #eafbf1; border-color: #bfe6cf; color: #1f6b45; }
.bildirim.hata { background: #fdecea; border-color: #f3c4bf; color: #a3342a; }
.bildirim.uyari { background: #fff6e5; border-color: #f2dcb0; color: #8a6100; }
.bildirim.bilgi { background: #f3eef7; border-color: #e0d3e8; color: #5b3d66; }

/* ------------------------------------------------------------ istatistik */
.stat-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 20px; }
@media (max-width: 760px) { .stat-row { grid-template-columns: repeat(2, 1fr); } }
.stat {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 15px 16px;
  text-decoration: none;
  color: inherit;
  display: block;
}
.stat:hover { border-color: var(--pembe); }
.stat .n { font-size: 1.6rem; font-weight: 700; color: var(--mor); line-height: 1.2; }
.stat .l { font-size: .78rem; color: var(--muted); }

/* ------------------------------------------------------------ araç çubuğu */
.arac {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
.arac input[type="text"], .arac input[type="search"], .arac select {
  padding: 9px 12px;
  border: 1px solid #d9cdd8;
  border-radius: 9px;
  font: inherit;
  background: #fff;
}
.arac input[type="search"] { min-width: 240px; }
.arac .sag { margin-left: auto; display: flex; gap: 8px; }

/* ------------------------------------------------------------ butonlar */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 17px;
  border: none;
  border-radius: 9px;
  background: var(--grad);
  color: #fff;
  font: inherit;
  font-weight: 600;
  font-size: .88rem;
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
}
.btn:hover { filter: brightness(1.06); }
.btn.sade { background: #fff; color: var(--mor); border: 1px solid #d9cdd8; }
.btn.sade:hover { border-color: var(--pembe); filter: none; }
.btn.tehlike { background: #fff; color: var(--danger); border: 1px solid #f0c4c0; }
.btn.tehlike:hover { background: var(--danger); color: #fff; }
.btn.kucuk { padding: 6px 12px; font-size: .8rem; }
.btn:disabled { opacity: .5; cursor: not-allowed; filter: none; }

/* ------------------------------------------------------------ form */
.alan { margin-bottom: 14px; }
.alan label { display: block; font-size: .78rem; color: var(--muted); margin-bottom: 5px; font-weight: 600; }
.alan input[type="text"], .alan input[type="password"], .alan input[type="email"],
.alan select, .alan textarea {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid #d9cdd8;
  border-radius: 9px;
  font: inherit;
  background: #fff;
}
.alan textarea { min-height: 80px; resize: vertical; }
.alan .ipucu { font-size: .76rem; color: var(--muted); margin-top: 4px; }
.alan-ikili { display: flex; gap: 14px; flex-wrap: wrap; }
.alan-ikili > * { flex: 1 1 200px; }

/* ------------------------------------------------------------ tablo */
table.liste {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
}
table.liste th, table.liste td {
  padding: 11px 14px;
  text-align: left;
  border-bottom: 1px solid var(--line);
  font-size: .87rem;
  vertical-align: middle;
}
table.liste th {
  background: #fbf5fa;
  color: var(--mor);
  font-size: .74rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  white-space: nowrap;
}
table.liste tr:last-child td { border-bottom: none; }
table.liste tbody tr:hover td { background: #fdf7fb; }
table.liste td.sag, table.liste th.sag { text-align: right; }
table.liste .ad { font-weight: 600; }
table.liste .adres { font-size: .8rem; color: var(--muted); }
table.liste tr.okunmamis td { background: #fffaf2; }
table.liste tr.okunmamis td:first-child { box-shadow: inset 3px 0 0 var(--turuncu); }

.tablo-kaydir { overflow-x: auto; }
.bos {
  text-align: center;
  color: var(--muted);
  padding: 40px 20px;
  background: #fff;
  border: 1px dashed var(--line);
  border-radius: 12px;
  font-size: .9rem;
}

/* ------------------------------------------------------------ rozet */
.rozet {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 700;
  white-space: nowrap;
}
.rozet.aktif { background: #e4f8ec; color: #1c7a44; }
.rozet.pasif { background: #f1eef5; color: #6b5b73; }
.rozet.var { background: #e4f8ec; color: #1c7a44; }
.rozet.yok { background: #fde9e8; color: #b0342a; }
.rozet.kismi { background: #fff3da; color: #9a6a05; }
.rozet.admin { background: #f3e8ff; color: #7127a8; }
.rozet.danisman { background: #eaf1ff; color: #2454b8; }
.rozet.kod { background: #1b0f1e; color: #ffd9a0; font-family: ui-monospace, Menlo, Consolas, monospace; letter-spacing: .08em; }

/* ------------------------------------------------------------ mail */
.mail-ust { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; align-items: flex-start; }
.mail-konu { font-size: 1.1rem; font-weight: 700; margin: 0 0 6px; }
.mail-meta { font-size: .82rem; color: var(--muted); }
.mail-govde {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 18px 20px;
  white-space: pre-wrap;
  word-break: break-word;
  font-size: .9rem;
}
.mail-govde iframe { width: 100%; min-height: 460px; border: 0; background: #fff; }
.mail-onizleme { color: var(--muted); font-size: .8rem; }

.kopyala-kutu {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #fbf5fa;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 14px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.kopyala-kutu .deger {
  font-family: ui-monospace, Menlo, Consolas, monospace;
  font-size: .95rem;
  word-break: break-all;
  flex: 1;
  min-width: 0;
}
.kopyala-kutu .etiket { font-size: .74rem; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }

/* ------------------------------------------------------------ tanım listesi */
.kv-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px 22px; }
@media (max-width: 760px) { .kv-grid { grid-template-columns: 1fr 1fr; } }
.kv dt { font-size: .72rem; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; }
.kv dd { margin: 2px 0 0; font-size: .9rem; word-break: break-word; }

/* ------------------------------------------------------------ sayfalama */
.sayfalama { display: flex; gap: 6px; justify-content: center; margin-top: 20px; flex-wrap: wrap; }
.sayfalama a, .sayfalama span {
  padding: 7px 13px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: #fff;
  text-decoration: none;
  font-size: .85rem;
  color: var(--ink);
}
.sayfalama .aktif { background: var(--grad); color: #fff; border-color: transparent; font-weight: 700; }

/* ------------------------------------------------------------ diğer */
.satir-islem { display: flex; gap: 6px; justify-content: flex-end; flex-wrap: wrap; }
.ayrac { height: 1px; background: var(--line); margin: 18px 0; border: 0; }
.mono { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: .85rem; }
.kucuk { font-size: .8rem; color: var(--muted); }
details.acilir summary { cursor: pointer; font-weight: 600; font-size: .88rem; color: var(--mor); }
details.acilir[open] summary { margin-bottom: 12px; }

h3.alt-bolum {
  font-size: .8rem;
  margin: 0 0 12px;
  color: var(--mor);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.alan-kopyala { display: flex; gap: 6px; align-items: center; }
.alan-kopyala input { flex: 1; min-width: 0; }
.kv dd .btn.kucuk { margin-left: 6px; padding: 2px 8px; font-size: .72rem; }