@keyframes fadeIn {
  0% {
    opacity:0;
    transform:translateY(6px);
  }
  to {
    opacity:1;
    transform:none;
  }
}

:root {
  --primary:#fdc52a;
  --primary-2:#f9b817;
  --primary-hi:#ffe066;
  --secondary:#0e3d20;
  --secondary-light:#155a2f;
  --accent:#1d7a3e;
  --bg:#07210f;
  --bg-2:#0a2914;
  --card:#0d3520;
  --card-2:#114229;
  --card-dark:#061a0c;
  --text:#f5faf6;
  --muted:#9bbba8;
  --border:#1d5c33;
  --border-strong:#2a7a47;
  --success:#4ade80;
  --danger:#ef4444;
  --shadow:0 2px 12px rgba(0,0,0,.4);
  --shadow-lg:0 14px 36px rgba(0,0,0,.55);
  --gold-glow:0 0 24px rgba(253,197,42,.35);
}

body,
html {
  margin:0;
  padding:0;
}

body {
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  background:radial-gradient(ellipse 80% 50%at 20%0,rgba(29,122,62,.45)0,transparent 60%),radial-gradient(ellipse 70% 40%at 80% 10%,rgba(14,61,32,.6)0,transparent 55%),linear-gradient(180deg,#07210f 0,#03100a 100%);
  background-attachment:fixed;
  color:var(--text);
  line-height:1.55;
  min-height:100vh;
}

a {
  color:var(--primary);
  text-decoration:none;
  transition:color .15s;
}

a:hover {
  color:#ffe066;
}

h1,
h2,
h3,
h4 {
  color:var(--text);
  line-height:1.2;
  margin:0 0 .5em;
  font-weight:700;
}

.admin-collapse form {
  max-width:100%;
}

.container {
  margin:0 auto;
  padding:0 20px;
}

.navbar {
  background:linear-gradient(180deg,#0e3d20 0,#07210f 100%);
  border-bottom:2px solid var(--primary);
  position:sticky;
  top:0;
  z-index:100;
}

.logo,
.nav-inner {
  align-items:center;
}

.nav-inner {
  display:flex;
  justify-content:space-between;
}

.logo {
  display:inline-flex;
  text-decoration:none;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-weight:900;
}

.logo:hover {
  color:inherit;
}

.logo-mark {
  color:var(--primary);
  font-style:italic;
}

.logo-tail {
  color:var(--primary);
  background:0 0;
  margin-left:2px;
}

.logo:hover .logo-mark,
.logo:hover .logo-tail {
  color:var(--primary-hi);
}

.logo:hover .logo-tail {
  border-color:var(--primary-hi);
}

.hero-search {
  position:relative;
  display:flex;
  align-items:center;
  width:100%;
  max-width:620px;
  height:60px;
  margin:0 auto 30px;
  background:#fff;
  border-radius:999px;
  box-shadow:0 10px 30px rgba(0,0,0,.25);
  overflow:hidden;
}

.hero-search-icon {
  position:absolute;
  top:50%;
  left:22px;
  transform:translateY(-50%);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#5a4b8a;
  pointer-events:none;
}

.hero-search input,
.hero-search input[type=text] {
  flex:1;
  min-width:0;
  width:100%;
  height:100%;
  padding:0 130px 0 56px;
  background:#fff!important;
  border:0!important;
  outline:0;
  color:#1f2937!important;
  font-size:15px;
  font-family:inherit;
  border-radius:999px;
  box-shadow:none!important;
}

.hero-search input::placeholder {
  color:#9aa3b2;
  font-weight:500;
}

.hero-search button {
  position:absolute;
  top:50%;
  right:6px;
  transform:translateY(-50%);
  margin:0!important;
  height:calc(100% - 12px);
  padding:0 30px;
  background:var(--accent);
  color:#fff;
  border:0;
  cursor:pointer;
  font-size:15px;
  font-weight:700;
  line-height:1;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  transition:background .15s,box-shadow .15s;
}

.hero-search button:hover {
  background:#2a9655;
  box-shadow:0 4px 14px rgba(42,150,85,.4);
  transform:translateY(-50%);
}

@media (max-width:520px) {
  .hero-search {
    height:52px;
  }
  .hero-search input {
    padding:0 96px 0 50px;
    font-size:14px;
  }
  .hero-search button {
    padding:0 18px;
    font-size:13px;
  }
}

.nav-links,
.user-menu {
  display:flex;
  align-items:center;
}

.nav-links>a {
  font-weight:600;
  color:var(--text);
  text-transform:uppercase;
  letter-spacing:.3px;
}

.brand-list li a:hover,
.card-body h3 a:hover,
.hero h1 span,
.hero h1 strong,
.logout:hover,
.nav-links>a:hover,
.sort-tabs a:hover,
.stat strong {
  color:var(--primary);
}

.user-menu {
  gap:10px;
}

.user-name {
  background:rgba(253,197,42,.12);
  border:1px solid var(--primary);
  color:var(--primary)!important;
}

.logout,
.sort-tabs a {
  color:var(--muted);
  font-size:13px;
}

.btn,
.stat span {
  text-transform:uppercase;
}

.btn {
  display:inline-block;
  padding:10px 22px;
  border-radius:8px;
  font-weight:800;
  font-size:13px;
  cursor:pointer;
  border:0;
  transition:all .15s;
  letter-spacing:.5px;
  text-decoration:none;
}

.btn-primary {
  background:linear-gradient(180deg,var(--primary) 0%,var(--primary-2) 100%);
  color:#0d3520;
  box-shadow:0 2px 0 rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.3);
}

.btn-primary:hover {
  background:linear-gradient(180deg,var(--primary-hi) 0%,var(--primary) 100%);
  transform:translateY(-1px);
  box-shadow:var(--gold-glow),0 4px 12px rgba(0,0,0,.3);
}

.btn-outline {
  background:0 0;
  border:2px solid var(--primary);
  color:var(--primary);
  padding:8px 20px;
}

.btn-outline:hover,
.sort-tabs a.active {
  background:var(--primary);
  color:#0d3520;
}

.btn-hero {
  padding:18px 42px;
  font-size:16px;
  background:linear-gradient(180deg,var(--primary) 0%,var(--primary-2) 100%);
  color:#0d3520;
  border-radius:10px;
  box-shadow:var(--gold-glow),0 6px 20px rgba(0,0,0,.4);
}

.btn-hero:hover {
  background:linear-gradient(180deg,var(--primary-hi) 0%,var(--primary) 100%);
  transform:translateY(-2px);
}

.btn-block {
  display:block;
  text-align:center;
}

.btn-danger {
  color:var(--danger);
}

.flash {
  padding:12px 20px;
  border-radius:8px;
  margin:16px auto;
  font-weight:600;
}

.flash-success {
  background:rgba(74,222,128,.15);
  color:#86efac;
  border-left:4px solid var(--success);
}

.flash-error {
  background:rgba(239,68,68,.15);
  color:#fca5a5;
  border-left:4px solid var(--danger);
}

.main {
  padding:24px 20px 60px;
}

.hero,
.hero h1 {
  color:var(--text);
}

.hero {
  background:linear-gradient(135deg,rgba(13,53,32,.95)0,rgba(7,33,15,.92) 100%),radial-gradient(circle at 18% 50%,rgba(253,197,42,.22),transparent 45%),radial-gradient(circle at 82% 50%,rgba(29,122,62,.5),transparent 50%);
  padding:64px 24px;
  text-align:center;
  border-radius:14px;
  margin-bottom:24px;
  border:1px solid var(--border-strong);
  box-shadow:var(--shadow-lg);
  position:relative;
  overflow:hidden;
}

.hero::before {
  content:"";
  position:absolute;
  inset:0;
  background:repeating-linear-gradient(135deg,transparent 0 22px,rgba(253,197,42,.04) 22px 23px),radial-gradient(circle at 50% 120%,rgba(253,197,42,.18),transparent 50%);
  pointer-events:none;
}

.hero-content {
  max-width:820px;
  margin:0 auto;
  position:relative;
  z-index:1;
}

.hero h1 {
  font-size:44px;
  margin-bottom:14px;
  font-weight:900;
  text-shadow:0 2px 16px rgba(0,0,0,.5);
}

.hero p {
  font-size:17px;
  color:#d6eadc;
  margin-bottom:30px;
}

.hero-stats {
  display:flex;
  justify-content:center;
  gap:14px;
  margin-bottom:32px;
  flex-wrap:wrap;
}

.stat {
  text-align:center;
  min-width:130px;
  background:rgba(0,0,0,.3);
  padding:14px 22px;
  border-radius:10px;
  border:1px solid var(--border);
}

.stat strong {
  font-size:28px;
  display:block;
  font-weight:900;
}

.stat span {
  color:#d6eadc;
  font-size:11px;
  letter-spacing:1.2px;
}

.categories-bar {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  padding:14px 0;
  margin-bottom:16px;
  overflow-x:auto;
}

.cat-pill,
.status-tag {
  font-weight:700;
  display:inline-flex;
  align-items:center;
}

.cat-pill {
  padding:8px 18px;
  background:var(--card-dark);
  border:1px solid var(--border);
  color:var(--text)!important;
  border-radius:24px;
  font-size:13px;
  white-space:nowrap;
  transition:all .15s;
  gap:6px;
}

.cat-pill:hover {
  border-color:var(--primary);
  color:var(--primary)!important;
}

.cat-pill.active {
  background:linear-gradient(180deg,var(--primary) 0%,var(--primary-2) 100%);
  color:#0d3520!important;
  border-color:var(--primary);
  box-shadow:0 2px 10px rgba(253,197,42,.4);
}

.status-tag {
  padding:4px 12px;
  border-radius:12px;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.5px;
  gap:4px;
  border:1px solid transparent;
}

.status-open {
  background:rgba(239,68,68,.18);
  color:#fca5a5;
  border-color:rgba(239,68,68,.4);
}

.status-progress {
  background:rgba(253,197,42,.18);
  color:var(--primary);
  border-color:rgba(253,197,42,.5);
}

.status-resolved {
  background:rgba(74,222,128,.18);
  color:#86efac;
  border-color:rgba(74,222,128,.4);
}

.status-form {
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-top:16px;
  padding:14px;
  background:rgba(253,197,42,.06);
  border:1px dashed rgba(253,197,42,.4);
  border-radius:8px;
}

.status-form label {
  margin:0;
  flex:1 1 100%;
}

.status-form select {
  width:auto;
  flex:1;
  min-width:180px;
}

.status-form button {
  margin-top:0;
}

.layout {
  display:grid;
  grid-template-columns:1fr 320px;
  gap:24px;
}

@media (max-width:900px) {
  .layout {
    grid-template-columns:1fr;
  }
}

.section-header {
  margin-bottom:16px;
  gap:10px;
}

.section-header h2 {
  margin:0;
  font-size:22px;
  color:var(--text);
}

.complaint-card,
.sort-tabs {
  display:flex;
  background:var(--card);
  border:1px solid var(--border);
}

.sort-tabs {
  gap:4px;
  padding:4px;
  border-radius:8px;
}

.sort-tabs a {
  padding:7px 16px;
  border-radius:6px;
  font-weight:600;
}

.sort-tabs a.active {
  color:#0a1f17;
}

.complaint-card {
  border-radius:10px;
  margin-bottom:14px;
  box-shadow:var(--shadow);
  overflow:hidden;
  transition:all .2s;
}

.complaint-card:hover {
  background:var(--card-2);
  border-color:var(--primary);
  box-shadow:var(--shadow-lg);
  transform:translateY(-2px);
}

.vote-col {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.25);
  padding:16px 14px;
  min-width:74px;
  border-right:1px solid var(--border);
}

.vote-score {
  font-size:24px;
  font-weight:800;
  color:var(--primary);
}

.vote-label {
  font-size:11px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:1px;
}

.card-body {
  flex:1;
  padding:16px 20px;
}

.card-meta {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-bottom:8px;
  align-items:center;
  font-size:12px;
}

.brand-tag,
.cat-tag {
  padding:4px 12px;
  border-radius:12px;
  font-size:12px;
}

.brand-tag {
  background:var(--primary);
  color:#0a1f17!important;
  font-weight:700;
}

.brand-tag:hover {
  background:#ffe066;
}

.cat-tag {
  background:var(--bg-2);
  color:var(--muted)!important;
  border:1px solid var(--border);
}

.time {
  color:var(--muted);
}

.card-body h3 {
  font-size:18px;
  margin:4px 0 8px;
}

.brand-list li a,
.card-body h3 a,
.comment-head strong,
.comments-section h2 {
  color:var(--text);
}

.card-excerpt {
  color:#b8cec0;
  font-size:14px;
  margin:6px 0;
}

.card-footer {
  display:flex;
  gap:16px;
  align-items:center;
  font-size:13px;
  color:var(--muted);
  margin-top:8px;
}

.read-more {
  margin-left:auto;
  color:var(--primary);
  font-weight:700;
}

.read-more:hover {
  color:#ffe066;
}

.empty,
.widget {
  padding:40px;
  box-shadow:var(--shadow);
}

.widget {
  background:var(--card);
  padding:18px;
  border-radius:10px;
  margin-bottom:16px;
  border:1px solid var(--border);
}

.widget h3 {
  font-size:15px;
  margin-bottom:12px;
  color:var(--primary);
  text-transform:uppercase;
  letter-spacing:.5px;
}

.brand-list,
.footer ul {
  list-style:none;
  padding:0;
  margin:0;
}

.brand-list li {
  display:flex;
  justify-content:space-between;
  padding:9px 0;
  border-bottom:1px solid var(--border);
  font-size:14px;
}

.brand-list li:last-child {
  border-bottom:none;
}

.brand-list li span {
  background:var(--bg-2);
  color:var(--primary);
  padding:2px 10px;
  border-radius:10px;
  font-size:12px;
  font-weight:700;
}

.widget-cta {
  background:linear-gradient(135deg,var(--primary) 0%,#ffd54a 100%);
  border:0;
}

.widget-cta,
.widget-cta h3,
.widget-cta p {
  color:#0a1f17;
}

.widget-cta .btn {
  background:#0a1f17;
}

.widget-cta .btn:hover {
  background:#14543f;
  color:var(--primary);
}

.complaint-detail {
  background:var(--card);
  padding:30px;
  border-radius:10px;
  box-shadow:var(--shadow);
  margin-bottom:20px;
  border:1px solid var(--border);
}

.detail-meta {
  display:flex;
  gap:10px;
  margin-bottom:14px;
  font-size:13px;
  flex-wrap:wrap;
  align-items:center;
}

.complaint-detail h1 {
  font-size:30px;
  margin-bottom:12px;
  color:var(--text);
  /* Uzun/boşluksuz başlıklar kartı taşırmasın */
  max-width:100%;
  min-width:0;
  overflow-wrap:anywhere;
  word-break:break-word;
  hyphens:auto;
}

.detail-author {
  color:var(--muted);
  font-size:14px;
  margin-bottom:18px;
  display:flex;
  gap:10px;
}

.brand-card:hover h3,
.demo-creds strong,
.detail-author a,
.footer a:hover,
.widget-cta .btn {
  color:var(--primary);
}

.detail-body {
  font-size:16px;
  line-height:1.7;
  white-space:pre-wrap;
  margin-bottom:24px;
  color:#d8e8df;
}

.detail-image,
.vote-bar {
  border-radius:8px;
  border:1px solid var(--border);
}

.detail-image {
  display:block;
  max-width:100%;
  margin-top:16px;
}

.vote-bar {
  display:flex;
  align-items:center;
  gap:14px;
  padding:16px;
  background:var(--bg-2);
  margin-top:20px;
}

.vote-btn {
  padding:9px 20px;
  border:1px solid var(--border-strong);
  background:var(--card);
  border-radius:6px;
  cursor:pointer;
  font-size:14px;
  font-weight:600;
  color:var(--text);
  transition:all .15s;
}

.vote-btn:hover:not(:disabled) {
  border-color:var(--primary);
  color:var(--primary);
}

.vote-btn.active {
  background:var(--primary);
  color:#0a1f17;
  border-color:var(--primary);
}

.vote-btn:disabled {
  opacity:.5;
  cursor:not-allowed;
}

.vote-score-big {
  font-size:24px;
  font-weight:800;
  color:var(--primary);
  min-width:30px;
  text-align:center;
}

.inline-form {
  margin-left:auto;
}

.comments-section {
  background:var(--card);
  padding:24px;
  border-radius:10px;
  box-shadow:var(--shadow);
  border:1px solid var(--border);
}

.comment-form {
  margin:16px 0 24px;
}

.comment-form textarea {
  width:100%;
  padding:12px;
  border:1px solid var(--border-strong);
  background:var(--bg-2);
  color:var(--text);
  border-radius:8px;
  resize:vertical;
  font-family:inherit;
  font-size:14px;
}

.comment-form textarea:focus {
  border-color:var(--primary);
  outline:0;
}

.comment-form button {
  margin-top:8px;
}

.comment {
  padding:14px 16px;
  border-left:3px solid var(--border-strong);
  background:var(--bg-2);
  border-radius:6px;
  margin-bottom:12px;
}

.comment.brand-reply {
  border-left-color:var(--primary);
  background:rgba(245,197,24,.08);
}

.comment-head {
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:6px;
  font-size:13px;
  color:var(--muted);
}

.comment p {
  margin:0;
  white-space:pre-wrap;
  color:#d8e8df;
}

.badge {
  background:var(--primary);
  color:#0a1f17;
  padding:2px 10px;
  border-radius:10px;
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.5px;
}

.auth-box,
.form-box {
  max-width:500px;
  margin:30px auto;
  background:var(--card);
  padding:36px;
  border-radius:12px;
  box-shadow:var(--shadow-lg);
  border:1px solid var(--border-strong);
}

.form-box {
  max-width:720px;
}

.auth-box h1,
.form-box h1 {
  margin-bottom:8px;
  color:var(--text);
}

.muted {
  color:var(--muted);
}

.demo-creds,
.small {
  font-size:12px;
}

.demo-creds {
  margin-top:18px;
  padding:12px;
  background:var(--bg-2);
  border:1px solid var(--border);
  border-radius:6px;
  color:var(--muted);
}

form label {
  display:block;
  margin:14px 0 6px;
  font-weight:600;
  font-size:14px;
  color:var(--text);
}

form input,
form select,
form textarea {
  width:100%;
  padding:11px 14px;
  background:var(--bg-2);
  color:var(--text);
  border:1px solid var(--border-strong);
  border-radius:6px;
  font-size:14px;
  font-family:inherit;
  outline:0;
  transition:border-color .15s;
}

form input::placeholder,
form textarea::placeholder {
  color:var(--muted);
}

.modal-form input[type=text]:focus,
.modal-form textarea:focus,
form input:focus,
form select:focus,
form textarea:focus {
  border-color:var(--primary);
}

form button {
  margin-top:18px;
}

.grid-2 {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}

@media (max-width:600px) {
  .grid-2 {
    grid-template-columns:1fr;
  }
}

.brand-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
  gap:16px;
  margin-top:20px;
}

.brand-card {
  background:var(--card);
  padding:26px 16px;
  border-radius:10px;
  box-shadow:var(--shadow);
  text-align:center;
  transition:all .2s;
  border:1px solid var(--border);
  color:var(--text);
}

.brand-card:hover {
  transform:translateY(-4px);
  box-shadow:var(--shadow-lg);
  border-color:var(--primary);
  color:var(--primary);
}

.brand-card h3 {
  color:var(--text);
  font-size:16px;
  margin:6px 0;
}

.brand-icon {
  font-size:38px;
  margin-bottom:8px;
}

.brand-count {
  font-size:12px;
  color:var(--muted);
  margin-top:8px;
  font-weight:600;
}

.brand-header {
  display:flex;
  align-items:center;
  gap:20px;
  padding:28px;
  background:var(--card);
  border-radius:12px;
  box-shadow:var(--shadow);
  margin-bottom:20px;
  flex-wrap:wrap;
  border:1px solid var(--border);
}

.brand-header-icon {
  font-size:50px;
  background:var(--bg-2);
  width:90px;
  height:90px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  border:2px solid var(--primary);
}

.brand-header h1 {
  margin-bottom:6px;
}

.brand-stats {
  margin-left:auto;
  display:flex;
  gap:30px;
}

.brand-stats div {
  text-align:center;
}

.brand-stats strong {
  font-size:26px;
  display:block;
  color:var(--primary);
  font-weight:800;
}

.brand-stats span,
.trust-text span {
  font-size:12px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:1px;
}

.avatar-big,
.profile-header {
  display:flex;
  align-items:center;
}

.profile-header {
  gap:20px;
  padding:28px;
  background:var(--card);
  border-radius:12px;
  box-shadow:var(--shadow);
  margin-bottom:20px;
  border:1px solid var(--border);
}

.avatar-big {
  width:80px;
  height:80px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--primary),#ffd54a);
  color:#0a1f17;
  justify-content:center;
  font-size:38px;
  border:2px solid var(--primary);
}

.brand-header h1,
.profile-header h1 {
  color:var(--text);
}

.error-page {
  text-align:center;
  padding:80px 20px;
}

.error-page h1 {
  font-size:90px;
  color:var(--primary);
  font-weight:800;
}

.error-page p {
  color:var(--muted);
  font-size:18px;
  margin-bottom:24px;
}

.footer {
  background:linear-gradient(180deg,#0a2b20 0,#050d09 100%);
  color:#9bb3a4;
  margin-top:60px;
  padding:50px 0 0;
  border-top:2px solid var(--primary);
}

.footer-logo {
  margin-bottom:14px;
  font-size:20px;
}

.footer-tag {
  color:#9bb3a4;
  font-size:14px;
  line-height:1.6;
  max-width:360px;
}

.footer-inner {
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  gap:32px;
  padding-bottom:30px;
}

@media (max-width:700px) {
  .footer-inner {
    grid-template-columns:1fr;
  }
}

.footer h4 {
  margin-bottom:14px;
  text-transform:uppercase;
  letter-spacing:.5px;
}

.footer ul li {
  padding:5px 0;
}

.footer a {
  color:#9bb3a4;
}

.footer-bottom {
  background:rgba(0,0,0,.4);
  padding:14px 0;
  font-size:13px;
  text-align:center;
  border-top:1px solid var(--border);
}

.page {
  background:var(--card);
  padding:36px;
  border-radius:12px;
  box-shadow:var(--shadow);
  max-width:800px;
  margin:0 auto;
  border:1px solid var(--border);
}

.page h1,
.page h2 {
  color:var(--text);
}

.page ol li,
.page p {
  color:#cfe4d8;
}

.page ol li {
  margin:8px 0;
}

.trust-metrics {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  max-width:720px;
  margin:28px auto 0;
}

.trust-card {
  display:flex;
  align-items:center;
  gap:12px;
  background:rgba(0,0,0,.35);
  border:1px solid var(--border);
  border-radius:14px;
  padding:14px 16px;
  text-align:left;
  backdrop-filter:blur(4px);
  transition:transform .15s,border-color .15s;
}

.trust-card:hover {
  transform:translateY(-2px);
  border-color:var(--primary);
}

.trust-icon {
  width:44px;
  height:44px;
  border-radius:12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}

.trust-text {
  display:flex;
  flex-direction:column;
  line-height:1.2;
}

.trust-text strong {
  font-size:20px;
  color:var(--text);
  font-weight:800;
}

.trust-text span {
  font-size:11px;
  letter-spacing:.8px;
  margin-top:3px;
}

@media (max-width:720px) {
  .trust-metrics {
    grid-template-columns:1fr;
    max-width:420px;
  }
}

.status-filters {
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:18px;
}

.cv-card,
.filter-pill {
  background:var(--card);
  border:1px solid var(--border);
}

.filter-pill {
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 18px;
  border-radius:999px;
  color:var(--text)!important;
  font-size:13px;
  font-weight:600;
  transition:all .15s;
  white-space:nowrap;
}

.filter-pill .dot {
  width:8px;
  height:8px;
  border-radius:50%;
  display:inline-block;
}

.filter-pill:hover {
  border-color:var(--primary);
  background:var(--card-2);
}

.filter-pill.active {
  background:linear-gradient(180deg,var(--primary) 0%,var(--primary-2) 100%);
  color:#0d3520!important;
  border-color:var(--primary);
  box-shadow:0 2px 12px rgba(253,197,42,.4);
}

/* Moderasyon — çoklu kategori filtre çubuğu (filter-pill'leri sarar) */
.admin-mod-filters {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0 0 18px;
}

/* Moderasyon arama çubuğu — Şikayetler ekranıyla aynı görünüm.
   (Mevcut değişken/renk sistemini kullanır; yeni renk tanımlamaz.) */
.admin-mod-search {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  margin:0 0 12px;
}
.admin-mod-search .filter-search {
  flex:1 1 260px;
  min-width:180px;
  height:40px;
  padding:0 12px;
  border:1px solid var(--border);
  border-radius:10px;
  background:var(--card);
  color:var(--text);
  font-size:14px;
  box-sizing:border-box;
}
.admin-mod-search .filter-search::placeholder { color:var(--muted); }
.admin-mod-search .filter-search:focus {
  outline:none;
  border-color:var(--border-strong);
  box-shadow:0 0 0 3px rgba(245,196,71,.15);
}
/* Ara/Temizle butonlari arama input'uyla AYNI hizada dursun.
   KRITIK: global "form button { margin-top:18px }" butonu asagi kaydiriyordu. */
.admin-mod-search .btn {
  margin:0 !important;
  height:40px;
  padding:0 18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
  box-sizing:border-box;
  white-space:nowrap;
  flex:0 0 auto;
}

.admin-mod-search-info {
  margin:0 0 14px;
  font-size:13px;
}


/* Filtre pill içindeki sayaç rozeti (o kategoride kaç pending var) */
.filter-pill-count {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:18px;
  height:18px;
  padding:0 5px;
  border-radius:999px;
  background:var(--card-2);
  color:var(--text);
  font-size:11px;
  font-weight:700;
  line-height:1;
}
.filter-pill.active .filter-pill-count {
  background:rgba(13,53,32,.18);
  color:#0d3520;
}


.cv-card {
  border-radius:16px;
  padding:20px 22px;
  margin-bottom:16px;
  box-shadow:0 2px 10px rgba(0,0,0,.25);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}

.cv-card:hover {
  transform:translateY(-3px);
  box-shadow:0 14px 32px rgba(0,0,0,.45);
  border-color:var(--border-strong);
}

.cv-head {
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}

.cv-author,
.cv-avatar,
.cv-head {
  display:flex;
  align-items:center;
}

.cv-author {
  gap:10px;
}

.cv-avatar {
  width:40px;
  height:40px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--primary) 0%,var(--primary-2) 100%);
  color:#0d3520;
  font-weight:800;
  font-size:16px;
  justify-content:center;
}

.cv-author-name {
  color:var(--text);
  font-weight:700;
  font-size:14px;
  letter-spacing:.3px;
}

.cv-time {
  color:var(--muted);
  font-size:12px;
}

.cv-badge {
  padding:5px 12px;
  border-radius:999px;
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.5px;
  border:1px solid transparent;
  display:inline-flex;
  align-items:center;
  gap:4px;
  white-space:nowrap;
}

.cv-badge-open {
  background:rgba(239,68,68,.18);
  color:#fca5a5;
  border-color:rgba(239,68,68,.45);
}

.cv-badge-progress {
  background:rgba(253,197,42,.2);
  color:var(--primary);
  border-color:rgba(253,197,42,.55);
}

.cv-badge-resolved {
  background:rgba(74,222,128,.2);
  color:#86efac;
  border-color:rgba(74,222,128,.5);
  box-shadow:0 0 16px rgba(74,222,128,.2);
}

.cv-title-link {
  text-decoration:none;
}

.cv-title {
  color:var(--text);
  font-size:18px;
  font-weight:700;
  margin:4px 0 8px;
  line-height:1.35;
  transition:color .15s;
}

.cv-title-link:hover .cv-title,
.footer h4 {
  color:var(--primary);
}

.cv-excerpt {
  color:#cfe4d8;
  font-size:14.5px;
  line-height:1.6;
  margin:0 0 8px;
}

.cv-readmore {
  color:var(--primary);
  font-size:13px;
  font-weight:700;
}

.cv-readmore:hover {
  color:var(--primary-hi);
}

.brand-reply-box {
  background:rgba(253,197,42,.06);
  border-left:3px solid var(--primary);
}

.brand-reply-logo {
  background:linear-gradient(135deg,var(--primary),var(--primary-2));
  font-style:italic;
}

.brand-reply-body {
  flex:1;
  min-width:0;
}

.brand-reply-head {
  flex-wrap:wrap;
}

.brand-reply-head strong {
  font-size:13px;
}

.brand-reply-tag {
  letter-spacing:.5px;
}

.brand-reply-time {
  margin-left:auto;
}

.brand-reply-body p {
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.cv-foot {
  display:flex;
  align-items:center;
  gap:14px;
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid var(--border);
}

.cv-stat {
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:var(--muted);
  font-size:13px;
  font-weight:600;
}

.cv-me-too,
.cv-me-too-form {
  margin-left:auto;
}

.cv-me-too {
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 14px;
  background:rgba(253,197,42,.08);
  border:1px solid rgba(253,197,42,.35);
  color:var(--primary)!important;
  border-radius:999px;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
  transition:all .15s;
  text-decoration:none;
}

.cv-me-too strong {
  background:var(--primary);
  color:#0d3520;
  padding:1px 8px;
  border-radius:10px;
  font-size:12px;
  margin-left:4px;
}

.cv-me-too:hover {
  background:rgba(253,197,42,.18);
  border-color:var(--primary);
  transform:translateY(-1px);
}

.modal-backdrop {
  background:rgba(3,16,10,.75);
  backdrop-filter:blur(6px);
  padding:20px;
  opacity:0;
  pointer-events:none;
  transition:opacity .2s ease;
}

.modal-backdrop[hidden] {
  display:flex;
}

.modal-backdrop.is-open {
  opacity:1;
  pointer-events:auto;
}

.modal-backdrop[hidden]:not(.is-open) {
  display:none!important;
}

.modal-card {
  padding:32px;
  box-shadow:0 24px 64px rgba(0,0,0,.6);
  transform:translateY(20px) scale(.98);
  transition:transform .25s cubic-bezier(.2,.8,.2,1);
}

.modal-backdrop.is-open .modal-card {
  transform:translateY(0) scale(1);
}

.modal-close {
  width:32px;
  height:32px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:all .15s;
}

.modal-close:hover {
  background:rgba(255,255,255,.08);
}

.modal-card h2 {
  color:var(--text);
  margin-bottom:6px;
  font-size:22px;
}

.modal-sub {
  color:var(--muted);
  font-size:14px;
  margin-bottom:18px;
}

.modal-form label {
  display:block;
  margin:12px 0 6px;
  font-weight:600;
  font-size:13px;
  color:var(--text);
}

.modal-form input[type=text],
.modal-form textarea {
  width:100%;
  padding:11px 14px;
  background:var(--bg-2);
  color:var(--text);
  border:1px solid var(--border-strong);
  border-radius:8px;
  font-size:14px;
  font-family:inherit;
  outline:0;
  transition:border-color .15s;
}

.modal-form textarea {
  resize:vertical;
}

.modal-actions {
  display:flex;
  gap:10px;
  justify-content:flex-end;
  flex-wrap:wrap;
  margin-top:22px;
}

.rating-stars {
  display:flex;
}

.rating-stars .star:hover {
  color:var(--primary);
}

::selection {
  background:var(--primary);
  color:#0a1f17;
}

@media (max-width:900px) {
  .container {
    padding:0 14px;
  }
  .main {
    padding:16px 12px 50px;
  }
  .nav-inner {
    gap:12px;
    padding:12px 14px;
  }
  .nav-links {
    gap:10px;
    flex-wrap:wrap;
  }
  .nav-links>a {
    font-size:13px;
  }
  .nav-links .btn,
  .sort-tabs a {
    padding:8px 14px;
    font-size:12px;
  }
  .hero {
    padding:40px 18px;
    border-radius:12px;
  }
  .hero h1 {
    font-size:32px;
    line-height:1.15;
  }
  .hero p {
    font-size:15px;
    margin-bottom:22px;
  }
  .btn-hero {
    padding:14px 30px;
    font-size:15px;
  }
  .layout {
    grid-template-columns:1fr;
    gap:18px;
  }
  .categories-bar {
    padding:10px 0;
  }
  .section-header {
    gap:8px;
  }
  .section-header h2 {
    font-size:19px;
  }
  .sort-tabs a {
    padding:6px 12px;
  }
}

@media (max-width:720px) {
  .hero {
    padding:32px 16px;
  }
  .hero h1 {
    font-size:27px;
  }
  .hero p {
    font-size:14px;
  }
  .hero-search {
    height:54px;
    max-width:100%;
  }
  .hero-search-icon {
    left:18px;
  }
  .hero-search-icon svg {
    width:18px;
    height:18px;
  }
  .hero-search input {
    padding:0 108px 0 48px;
    font-size:14px;
  }
  .hero-search button {
    padding:0 22px;
    font-size:14px;
  }
  .trust-metrics {
    max-width:100%;
    gap:10px;
    margin-top:20px;
  }
  .trust-card {
    padding:12px 14px;
  }
  .trust-icon {
    width:38px;
    height:38px;
  }
  .trust-icon svg {
    width:20px;
    height:20px;
  }
  .trust-text strong {
    font-size:17px;
  }
  .trust-text span {
    font-size:10px;
  }
  .status-filters {
    flex-wrap:nowrap;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    margin:0-14px 16px;
    padding:0 14px 6px;
    scrollbar-width:none;
  }
  .status-filters::-webkit-scrollbar {
    display:none;
  }
  .filter-pill {
    padding:7px 14px;
    font-size:12px;
    flex-shrink:0;
  }
}

@media (max-width:600px) {
  .nav-inner {
    flex-direction:row;
    align-items:center;
  }
  .nav-links {
    justify-content:center;
    width:100%;
    gap:8px;
    row-gap:8px;
  }
  .user-menu {
    gap:6px;
    margin-left:0;
  }
  .user-name {
    font-size:12px;
    padding:5px 10px;
  }
  .hero h1 {
    font-size:24px;
  }
  .cv-me-too span,
  .hero h1 br {
    display:none;
  }
  .hero p {
    font-size:13.5px;
  }
  .btn-hero {
    padding:13px 24px;
    font-size:14px;
    width:100%;
    max-width:320px;
  }
  .brand-grid {
    grid-template-columns:repeat(2,1fr);
    gap:10px;
  }
  .brand-card {
    padding:18px 10px;
  }
  .brand-card h3 {
    font-size:14px;
  }
  .brand-icon {
    font-size:28px;
  }
  .complaint-card {
    flex-direction:row;
  }
  .vote-col {
    min-width:56px;
    padding:10px 6px;
  }
  .modal-card h2,
  .vote-score {
    font-size:19px;
  }
  .vote-label {
    font-size:9px;
  }
  .card-body {
    padding:12px 14px;
  }
  .card-body h3 {
    font-size:16px;
  }
  .card-excerpt {
    font-size:13px;
  }
  .card-footer {
    gap:10px;
    font-size:12px;
    flex-wrap:wrap;
  }
  .cv-card {
    padding:16px 14px;
    border-radius:13px;
  }
  .cv-head {
    gap:8px;
  }
  .cv-avatar {
    width:36px;
    height:36px;
    font-size:14px;
  }
  .cv-author-name {
    font-size:13px;
  }
  .cv-time {
    font-size:11px;
  }
  .cv-badge {
    padding:4px 9px;
    font-size:10px;
  }
  .cv-title {
    font-size:16px;
    line-height:1.3;
  }
  .cv-excerpt {
    font-size:13.5px;
    line-height:1.55;
  }
  .cv-foot {
    gap:10px;
    flex-wrap:wrap;
    padding-top:10px;
  }
  .cv-me-too,
  .cv-stat {
    font-size:12px;
  }
  .cv-me-too {
    margin-left:auto;
    padding:6px 11px;
  }
  .cv-me-too::after {
    content:"+1";
    font-weight:800;
  }
  .cv-me-too strong {
    font-size:11px;
    padding:1px 7px;
  }
  .brand-reply-box {
    padding:12px;
    gap:10px;
    margin-top:12px;
  }
  .brand-reply-logo {
    width:36px;
    height:36px;
    font-size:11px;
  }
  .brand-reply-head strong {
    font-size:12px;
  }
  .brand-reply-tag {
    font-size:9px;
    padding:2px 6px;
  }
  .brand-reply-time {
    font-size:10px;
    flex-basis:100%;
    margin-left:0;
  }
  .brand-reply-body p {
    font-size:12.5px;
  }
  .complaint-detail {
    padding:20px;
  }
  .brand-stats strong,
  .complaint-detail h1 {
    font-size:22px;
  }
  .detail-body,
  .error-page p {
    font-size:15px;
  }
  .vote-bar {
    flex-wrap:wrap;
    gap:10px;
    padding:12px;
  }
  .vote-bar .inline-form {
    margin-left:0;
    width:100%;
  }
  .modal-actions .btn,
  .vote-bar .btn {
    width:100%;
  }
  .comments-section {
    padding:18px;
  }
  .comment {
    padding:12px;
  }
  .auth-box,
  .form-box {
    padding:24px 20px;
    margin:16px 12px;
  }
  .auth-box h1,
  .form-box h1 {
    font-size:20px;
  }
  .brand-header,
  .profile-header {
    padding:20px;
    gap:14px;
    flex-direction:column;
    text-align:center;
  }
  .avatar-big,
  .brand-header-icon {
    width:70px;
    height:70px;
    font-size:30px;
  }
  .brand-stats {
    margin-left:0;
    gap:18px;
    justify-content:center;
    flex-wrap:wrap;
  }
  .brand-stats span {
    font-size:10px;
  }
  .widget {
    padding:16px;
  }
  .widget h3 {
    font-size:14px;
  }
  .sort-tabs {
    overflow-x:auto;
  }
  .error-page {
    padding:50px 16px;
  }
  .error-page h1 {
    font-size:64px;
  }
  .modal-backdrop {
    padding:12px;
    align-items:flex-end;
  }
  .modal-card {
    max-width:100%;
    padding:22px 18px;
    border-radius:16px 16px 0 0;
    max-height:92vh;
  }
  .modal-sub {
    font-size:13px;
  }
  .modal-actions {
    flex-direction:column-reverse;
  }
  .rating-stars .star {
    font-size:28px;
  }
}

@media (max-width:380px) {
  .logo {
    font-size:18px;
  }
  .logo-tail {
    padding:3px 6px 2px;
  }
  .logo-tail,
  .nav-links>a {
    font-size:12px;
  }
  .nav-links .btn {
    padding:7px 11px;
    font-size:11px;
  }
  .hero h1 {
    font-size:21px;
  }
  .hero-search {
    height:50px;
  }
  .hero-search input {
    padding:0 92px 0 42px;
    font-size:13px;
  }
  .hero-search-icon {
    left:14px;
  }
  .hero-search button {
    padding:0 16px;
    font-size:12px;
  }
  .trust-text span {
    font-size:9px;
  }
  .cv-card {
    padding:14px 12px;
  }
  .cv-title,
  .trust-text strong {
    font-size:15px;
  }
}

@media (hover:none) {
  .brand-card:hover,
  .btn-hero:hover,
  .btn-primary:hover,
  .complaint-card:hover,
  .cv-card:hover,
  .trust-card:hover {
    transform:none;
  }
}

.icon-btn {
  color:inherit;
}

.icon-btn:hover {
  background:rgba(255,255,255,.1);
}

.icon-badge {
  border:2px solid #1a1a2e;
  box-sizing:content-box;
}

.icon-badge.static-badge {
  position:static;
  display:inline-block;
  border:0;
  margin-left:8px;
}

.section-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:1rem;
  gap:1rem;
  flex-wrap:wrap;
}

.notif-list {
  list-style:none;
  padding:0;
  margin:0;
  background:#fff;
  border-radius:12px;
  overflow:hidden;
  border:1px solid #e5e7eb;
}

.notif-item {
  border-bottom:1px solid #e5e7eb;
}

.notif-item.is-unread {
  background:rgba(99,102,241,.06);
}

.notif-link {
  color:inherit;
}

.notif-link:hover {
  background:rgba(0,0,0,.03);
}

.notif-icon {
  flex-shrink:0;
  width:40px;
  height:40px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  background:#eef2ff;
}

.notif-type-brand_reply {
  background:#fef3c7;
}

.notif-type-status_change {
  background:#d1fae5;
}

.notif-type-rating_request {
  background:#fce7f3;
}

.notif-type-message {
  background:#dbeafe;
}

.notif-body {
  flex:1;
  min-width:0;
}

.notif-body strong {
  display:block;
  margin-bottom:2px;
}

.notif-body p {
  margin:0 0 4px;
  color:#555;
  font-size:14px;
}

.notif-dot {
  width:10px;
  height:10px;
  border-radius:50%;
  background:#6366f1;
  flex-shrink:0;
  margin-top:8px;
}

.empty {
  text-align:center;
  padding:3rem 1rem;
  color:#6b7280;
  background:#f9fafb;
  border-radius:12px;
}

.conv-list {
  list-style:none;
  padding:0;
  margin:1rem 0 0;
  background:#fff;
  border-radius:12px;
  border:1px solid #e5e7eb;
  overflow:hidden;
}

.conv-item {
  border-bottom:1px solid #e5e7eb;
}

.admin-pending-list li:last-child,
.admin-table tbody tr:last-child td {
  border-bottom:none;
}

.conv-item.is-unread {
  background:rgba(99,102,241,.05);
}

.conv-link {
  color:inherit;
}

.conv-link:hover {
  background:rgba(0,0,0,.03);
}

.conv-avatar {
  width:44px;
  height:44px;
  border-radius:50%;
  background:linear-gradient(135deg,#6366f1,#a855f7);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  font-size:18px;
  flex-shrink:0;
}

.conv-body {
  flex:1;
  min-width:0;
}

.conv-head {
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.conv-preview {
  margin:4px 0 0;
  color:#6b7280;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.chat-page {
  max-width:760px;
  margin:0 auto;
}

.chat-header {
  display:flex;
  align-items:center;
  gap:16px;
  padding-bottom:12px;
  border-bottom:1px solid #e5e7eb;
  margin-bottom:16px;
}

.back-link {
  color:#6366f1;
  text-decoration:none;
  font-weight:600;
}

.chat-title {
  display:flex;
  align-items:center;
  gap:8px;
}

.chat-thread {
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-bottom:12px;
  background:#f9fafb;
  border:1px solid #e5e7eb;
}

.chat-msg {
  display:flex;
}

.chat-msg.mine {
  justify-content:flex-end;
}

.chat-msg.theirs {
  justify-content:flex-start;
}

.chat-bubble {
  background:#fff;
  border:1px solid #e5e7eb;
}

.chat-msg.mine .chat-bubble {
  background:linear-gradient(135deg,#6366f1,#818cf8);
}

.chat-msg.mine .chat-bubble .chat-ref,
.chat-msg.mine .chat-bubble .chat-time,
.chat-msg.mine .chat-bubble .muted {
  color:rgba(255,255,255,.85);
}

.chat-bubble p {
  margin:4px 0;
  word-wrap:break-word;
}

.chat-ref {
  display:inline-block;
  margin-bottom:4px;
  padding:2px 6px;
  border-radius:6px;
  background:rgba(0,0,0,.05);
  text-decoration:none;
}

.chat-msg.mine .chat-ref {
  background:rgba(255,255,255,.18);
}

.chat-time {
  display:block;
  margin-top:4px;
  font-size:11px;
}

.chat-form {
  align-items:flex-end;
}

.chat-form textarea {
  border:1px solid #e5e7eb;
  font-family:inherit;
  resize:vertical;
  min-height:44px;
}

.settings-card {
  background:#fff;
  border:1px solid #e5e7eb;
}

.settings-card h2 {
  margin-top:0;
}

.form-grid,
.form-grid label {
  display:flex;
  flex-direction:column;
  gap:12px;
}

.form-grid label {
  gap:4px;
  font-weight:600;
  font-size:14px;
}

.form-grid input[type=email],
.form-grid input[type=password],
.form-grid input[type=tel],
.form-grid input[type=text],
.form-grid textarea {
  padding:9px 11px;
  border:1px solid #e5e7eb;
  border-radius:8px;
  font-family:inherit;
  font-size:14px;
  font-weight:400;
}

.form-grid .check-row {
  flex-direction:row;
  align-items:center;
  gap:10px;
  font-weight:500;
  cursor:pointer;
}

.rating-box {
  background:linear-gradient(135deg,#fef3c7 0,#fce7f3 100%);
  border:1px solid #fde68a;
}

.rating-box.rating-given {
  background:linear-gradient(135deg,#ecfdf5 0,#f0f9ff 100%);
  border-color:#a7f3d0;
}

.rating-box h3 {
  margin-top:0;
  color:var(--primary)!important;
  margin:0 0 .5rem;
}

.rating-form {
  gap:12px;
  margin-top:12px;
}

.rating-stars .star.is-active,
.rating-stars .star.is-hover,
.rating-stars-static .star.is-active {
  color:#f59e0b;
}

.rating-form textarea {
  border:1px solid #fde68a;
  background:#fff;
}

.rating-stars-static .star {
  font-size:22px;
}

.rating-stars-static strong {
  margin-left:8px;
  color:var(--text);
  font-size:15px;
}

.rating-display,
.rating-form {
  display:flex;
  flex-direction:column;
}

.rating-display blockquote {
  margin:0;
  border-left:3px solid #6366f1;
  color:#4b5563;
  position:relative;
  margin:.85rem 0 .35rem;
  padding:20px 22px 20px 58px;
  background:linear-gradient(135deg,var(--card-dark) 0%,var(--bg-2) 100%);
  border:1px solid var(--border);
  border-left:4px solid var(--primary);
  border-radius:14px;
  color:var(--text);
  font-style:normal;
  font-size:17px;
  font-weight:600;
  line-height:1.5;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03),0 4px 14px rgba(0,0,0,.28);
}

.wizard-page {
  max-width:880px;
  margin:2rem auto;
  padding:0 1rem;
}

.wizard-header h1 {
  margin:0 0 .25rem;
  font-size:1.85rem;
}

.wizard-header .muted {
  margin:0 0 1.5rem;
}

.wizard-steps {
  display:flex;
  gap:8px;
  list-style:none;
  padding:0;
  margin:0 0 2rem;
  counter-reset:step;
}

.wizard-steps .step,
.wizard-steps .step-num {
  display:flex;
  align-items:center;
  font-size:14px;
}

.wizard-steps .step {
  flex:1;
  gap:10px;
  padding:12px 14px;
  background:#f3f4f6;
  border-radius:12px;
  border:1.5px solid transparent;
  cursor:pointer;
  transition:all .15s;
}

.wizard-steps .step:hover {
  background:#e5e7eb;
}

.wizard-steps .step.is-active {
  background:#fff;
  border-color:#6366f1;
}

.wizard-steps .step.is-done {
  background:#dcfce7;
  border-color:#86efac;
}

.wizard-steps .step-num {
  flex-shrink:0;
  width:28px;
  height:28px;
  border-radius:50%;
  background:#9ca3af;
  color:#fff;
  font-weight:700;
  justify-content:center;
}

.wizard-steps .step.is-active .step-num {
  background:#6366f1;
}

.wizard-steps .step.is-done .step-num {
  color:transparent;
  position:relative;
}

.wizard-steps .step.is-done .step-num::before {
  content:"✓";
  font-size:16px;
  position:absolute;
  color:#fff;
}

.wizard-steps .step-label {
  font-weight:600;
  color:#374151;
}

@media (max-width:640px) {
  .wizard-steps .step-label {
    display:none;
  }
  .wizard-steps .step {
    justify-content:center;
    padding:10px;
  }
}

.wizard-form {
  background:#fff;
  box-shadow:0 4px 20px rgba(0,0,0,.06);
  border:1px solid #e5e7eb;
}

.wizard-step {
  display:none;
  animation:fadeIn .25s ease;
}

.wizard-step.is-active {
  display:block;
}

.wizard-step h2 {
  margin:0 0 .5rem;
  font-size:1.4rem;
  color:#111;
}

.wizard-step>.muted {
  margin:0 0 1.5rem;
}

.wizard-actions {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-top:1.75rem;
  gap:1rem;
}

.wizard-actions .btn {
  min-width:120px;
}

.form-label {
  display:block;
  font-weight:600;
  margin-bottom:6px;
  color:#111;
}

.admin-card-danger .admin-card-head h3,
.form-label .req {
  color:#ef4444;
}

.input-meta {
  margin-top:6px;
  font-size:12px;
  color:#6b7280;
}

.wizard-form input[type=text],
.wizard-form textarea {
  width:100%;
  padding:11px 14px;
  border:1.5px solid #e5e7eb;
  border-radius:10px;
  font-family:inherit;
  font-size:15px;
  transition:border-color .15s;
  box-sizing:border-box;
}

.wizard-form input[type=text]:focus,
.wizard-form textarea:focus {
  outline:0;
  border-color:#6366f1;
}

.cat-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
  gap:12px;
  margin-top:.5rem;
}

.cat-card {
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:6px;
  padding:18px 12px;
  background:#f9fafb;
  border:1.5px solid #e5e7eb;
  border-radius:12px;
  cursor:pointer;
  transition:all .15s;
}

.cat-card:hover {
  background:#fff;
  border-color:#a5b4fc;
  transform:translateY(-2px);
  box-shadow:0 4px 12px rgba(0,0,0,.06);
}

.cat-card input[type=radio] {
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.cat-card:has(input:checked) {
  background:linear-gradient(135deg,#eef2ff,#fce7f3);
  border-color:#6366f1;
  background:linear-gradient(135deg,rgba(253,197,42,.15),rgba(29,122,62,.2))!important;
  border-color:var(--primary)!important;
  box-shadow:0 6px 16px rgba(253,197,42,.18)!important;
}

.cat-card-icon {
  font-size:32px;
  line-height:1;
}

.cat-card-name {
  font-weight:600;
  font-size:15px;
  color:#111;
}

.cat-card-desc {
  font-size:11px;
  color:#6b7280;
  line-height:1.35;
}

#image-preview-wrap {
  margin-top:1rem;
  border-radius:12px;
  overflow:hidden;
  border:1px solid #e5e7eb;
  max-width:360px;
}

#image-preview {
  display:block;
  width:100%;
  height:auto;
}

.preview-card {
  margin-top:1.5rem;
  padding:1.25rem;
  background:linear-gradient(135deg,#f9fafb,#fff);
  border:1.5px dashed #d1d5db;
  border-radius:14px;
}

.preview-head {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:.5rem;
  font-size:13px;
}

.preview-cat {
  color:#6366f1;
}

.preview-cat,
.preview-status {
  font-weight:600;
}

.preview-title {
  margin:.25rem 0 .5rem;
  font-size:1.15rem;
  color:#111;
  word-wrap:break-word;
}

.preview-content {
  margin:0;
  white-space:pre-wrap;
  word-wrap:break-word;
  line-height:1.5;
}

.notif-list {
  background:var(--card)!important;
  border:1px solid var(--border)!important;
  box-shadow:var(--shadow);
}

.notif-item {
  border-bottom:1px solid var(--border)!important;
}

.notif-item:last-child {
  border-bottom:none!important;
}

.notif-link {
  padding:14px 16px;
  display:flex;
  gap:12px;
  align-items:flex-start;
  color:var(--text);
  text-decoration:none;
}

.notif-link:hover {
  background:rgba(253,197,42,.06);
  color:var(--text);
}

.notif-item.unread .notif-link {
  background:rgba(253,197,42,.08);
}

.notif-dot {
  background:var(--primary)!important;
}

.notif-title {
  color:var(--text);
  font-weight:700;
}

.notif-body,
.notif-time {
  color:var(--muted);
}

.notif-time {
  font-size:12px;
}

.conv-list,
.empty {
  background:var(--card)!important;
}

.empty {
  color:var(--muted)!important;
  border:1px solid var(--border);
}

.conv-list {
  border:1px solid var(--border)!important;
}

.conv-item {
  border-bottom:1px solid var(--border)!important;
}

.conv-item:last-child {
  border-bottom:none!important;
}

.conv-link {
  padding:14px 16px;
  display:flex;
  gap:12px;
  align-items:center;
  color:var(--text);
  text-decoration:none;
}

.conv-link:hover {
  background:rgba(253,197,42,.06);
}

.conv-item.unread .conv-link {
  background:rgba(253,197,42,.1);
}

.conv-name {
  color:var(--text);
  font-weight:700;
}

.conv-preview {
  color:var(--muted);
  font-size:13px;
}

.chat-bubble .chat-meta,
.conv-time {
  color:var(--muted);
  font-size:11px;
}

.chat-bubble,
.chat-thread {
  border:1px solid var(--border)!important;
}

.chat-thread {
  background:var(--bg-2)!important;
  max-height:60vh;
  overflow-y:auto;
  padding:14px;
  border-radius:12px;
}

.chat-bubble {
  background:var(--card)!important;
  color:var(--text);
  padding:10px 14px;
  border-radius:14px;
  max-width:72%;
}

.chat-msg.mine .chat-bubble {
  background:linear-gradient(135deg,#1d7a3e,#2d9d52)!important;
  color:#fff;
  border-color:transparent!important;
}

.chat-msg.theirs .chat-bubble {
  background:var(--card-dark)!important;
}

.chat-bubble .chat-meta {
  display:block;
  margin-top:4px;
}

.chat-msg.mine .chat-bubble .chat-meta {
  color:rgba(255,255,255,.75);
}

.chat-form {
  display:flex;
  gap:8px;
  margin-top:8px;
}

.chat-form input,
.chat-form textarea {
  flex:1;
  background:var(--bg-2);
  color:var(--text);
  border:1px solid var(--border-strong);
  border-radius:10px;
  padding:10px 14px;
}

.settings-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr));
  gap:1.25rem;
  margin-top:1.5rem;
}


.rating-box,
.settings-card {
  background:var(--card)!important;
  border-radius:14px;
  padding:1.5rem;
  box-shadow:var(--shadow);
}

.settings-card {
  border:1px solid var(--border)!important;
}

.settings-card h2 {
  color:var(--text)!important;
  margin:0 0 1rem;
  font-size:1.1rem;
  padding-bottom:.6rem;
  border-bottom:1px solid var(--border);
}

.settings-card label,
.wizard-page h1 {
  color:var(--text);
}

.rating-form textarea,
.settings-card input[type=email],
.settings-card input[type=password],
.settings-card input[type=tel],
.settings-card input[type=text],
.settings-card textarea {
  background:var(--bg-2)!important;
  color:var(--text)!important;
  border:1px solid var(--border-strong)!important;
  border-radius:8px;
}

.settings-card .check-row {
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin:12px 0;
  color:var(--text);
  cursor:pointer;
}

.settings-card .check-row input[type=checkbox] {
  margin-top:3px;
  width:18px;
  height:18px;
  accent-color:var(--primary);
}

.settings-card .check-row .small {
  color:var(--muted);
  display:block;
  margin-top:2px;
}

.rating-box {
  border:1.5px solid rgba(253,197,42,.35)!important;
  margin-top:1.5rem;
}

.rating-box .muted {
  color:var(--muted)!important;
}

.rating-box.rating-given {
  border-color:var(--border)!important;
  background:var(--bg-2)!important;
}

.rating-stars,
.rating-stars-static {
  display:inline-flex;
  align-items:center;
}

.rating-stars {
  gap:4px;
  margin:.5rem 0;
}

.rating-stars .star {
  background:0 0;
  border:0;
  font-size:32px;
  color:#3d4a44;
  cursor:pointer;
  padding:0 2px;
  transition:transform .1s,color .1s;
  line-height:1;
}

.rating-stars .star:hover {
  transform:scale(1.15);
}

.brand-reply-head strong,
.rating-stars .star.is-active,
.rating-stars .star.is-hover,
.rating-stars-static .star.is-active {
  color:var(--primary);
}

.rating-stars-static {
  gap:2px;
  font-size:22px;
}

.rating-display {
  gap:12px;
}

.rating-display blockquote::before {
  content:"“";
  position:absolute;
  left:14px;
  top:2px;
  font-family:Georgia,"Times New Roman",serif;
  font-size:54px;
  line-height:1;
  color:var(--primary);
  opacity:.85;
}

.rating-form textarea {
  border-radius:10px;
  padding:10px;
  width:100%;
  font-family:inherit;
  margin-top:.5rem;
}

.wizard-steps .step {
  background:var(--bg-2)!important;
  border:1.5px solid var(--border)!important;
  color:var(--muted);
}

.wizard-form,
.wizard-steps .step.is-active,
.wizard-steps .step:hover {
  background:var(--card)!important;
}

.wizard-steps .step.is-active {
  border-color:var(--primary)!important;
  box-shadow:0 4px 12px rgba(253,197,42,.18);
}

.wizard-steps .step.is-done {
  background:rgba(74,222,128,.12)!important;
  border-color:rgba(74,222,128,.4)!important;
}

.wizard-steps .step-num {
  background:#3d4a44;
}

.wizard-steps .step.is-active .step-num {
  background:var(--primary);
  color:#0a2914;
}

.wizard-steps .step.is-done .step-num {
  background:#16a34a;
}

.wizard-steps .step-label {
  color:var(--text);
}

.wizard-form {
  border:1px solid var(--border)!important;
  box-shadow:var(--shadow);
  border-radius:16px;
  padding:2rem;
}

.form-label,
.wizard-step h2 {
  color:var(--text)!important;
}

.input-meta,
.wizard-step>.muted {
  color:var(--muted)!important;
}

.wizard-form input[type=text],
.wizard-form textarea {
  background:var(--bg-2)!important;
  color:var(--text)!important;
  border:1.5px solid var(--border-strong)!important;
}

.wizard-form input[type=text]::placeholder,
.wizard-form textarea::placeholder {
  color:#6b8a78;
}

.wizard-form input[type=text]:focus,
.wizard-form textarea:focus {
  border-color:var(--primary)!important;
  box-shadow:0 0 0 3px rgba(253,197,42,.18)!important;
}

.wizard-form input[type=file] {
  color:var(--muted);
}

.cat-card {
  background:var(--bg-2)!important;
  border:1.5px solid var(--border)!important;
  color:var(--text);
}

.cat-card:hover {
  background:var(--card)!important;
  border-color:rgba(253,197,42,.5)!important;
}

.cat-card-name {
  color:var(--text)!important;
}

.cat-card-desc {
  color:var(--muted)!important;
}

.preview-card {
  background:var(--bg-2)!important;
  border:1.5px dashed var(--border-strong)!important;
  color:var(--text);
}

.preview-cat {
  color:var(--primary)!important;
}

.preview-status {
  color:#ef6e6e!important;
}

.preview-title {
  color:var(--text)!important;
}

.preview-content {
  color:var(--muted)!important;
}

#image-preview-wrap {
  border:1px solid var(--border);
}

.brand-reply-box {
  background:var(--card-dark);
  border:1px solid rgba(253,197,42,.3);
  border-radius:10px;
  padding:12px 14px;
  margin-top:12px;
  display:flex;
  gap:12px;
  align-items:flex-start;
}

.brand-reply-logo {
  flex-shrink:0;
  width:38px;
  height:38px;
  background:var(--primary);
  color:#0a2914;
  font-weight:900;
  border-radius:8px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:11px;
  letter-spacing:.5px;
}

.brand-reply-head {
  display:flex;
  gap:8px;
  align-items:center;
  margin-bottom:4px;
}

.brand-reply-tag {
  background:var(--primary);
  color:#0a2914;
  font-size:10px;
  padding:2px 8px;
  border-radius:10px;
  font-weight:700;
  text-transform:uppercase;
}

.brand-reply-time {
  color:var(--muted);
  font-size:11px;
}

.brand-reply-body p {
  margin:0;
  color:#d8e8df;
  font-size:13px;
  line-height:1.5;
}

.icon-btn {
  background:var(--bg-2);
  color:var(--text);
  border:1px solid var(--border);
  text-decoration:none;
}

.icon-btn:hover {
  background:var(--card);
  border-color:var(--primary);
  color:var(--primary);
}

.icon-btn .badge-count,
.modal-backdrop {
  display:flex;
  align-items:center;
  justify-content:center;
}

.icon-btn .badge-count {
  position:absolute;
  top:-4px;
  right:-4px;
  min-width:18px;
  height:18px;
  padding:0 5px;
  background:#ef4444;
  color:#fff;
  border-radius:9px;
  font-size:10px;
  font-weight:700;
  border:2px solid var(--bg);
}

.modal-backdrop {
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.75);
  z-index:1000;
  padding:1rem;
}

.modal-card {
  background:var(--card)!important;
  border:1px solid var(--border);
  color:var(--text);
  border-radius:14px;
  padding:2rem;
  max-width:600px;
  width:100%;
  max-height:90vh;
  overflow-y:auto;
  position:relative;
}

.modal-close {
  position:absolute;
  top:12px;
  right:14px;
  background:0 0;
  border:0;
  color:var(--muted);
  font-size:28px;
  cursor:pointer;
  line-height:1;
}

.modal-close:hover {
  color:var(--primary);
}

input:focus,
select:focus,
textarea:focus {
  outline:0;
}

.navbar {
  padding:6px 0;
  border-bottom:2px solid rgba(253,197,42,.35);
  box-shadow:0 4px 20px rgba(0,0,0,.35);
}

.nav-inner {
  padding:14px 24px;
  min-height:74px;
  gap:18px;
}

.logo {
  gap:8px!important;
  font-size:30px!important;
  letter-spacing:.5px;
  line-height:1;
}

.logo-mark {
  font-size:30px;
  font-weight:900;
  letter-spacing:1px;
  text-shadow:0 2px 8px rgba(253,197,42,.25);
}

.logo-tail {
  font-size:18px;
  font-weight:800;
  padding:6px 12px 5px;
  border:2px solid var(--primary);
  border-radius:8px;
  letter-spacing:1.2px;
  background:rgba(253,197,42,.05);
}

.logo-slogan {
  display:inline-flex;
  flex-direction:column;
  justify-content:center;
  margin-left:8px;
  padding-left:12px;
  border-left:1.5px solid rgba(253,197,42,.3);
  line-height:1.1;
}

.logo-slogan-main {
  color:var(--text);
  font-size:12px;
  font-weight:700;
  letter-spacing:.5px;
  text-transform:uppercase;
}

.logo-slogan-sub {
  color:var(--muted);
  font-size:11px;
  font-weight:500;
  margin-top:2px;
}

.nav-links {
  gap:18px!important;
}

.nav-links>a {
  font-size:14px!important;
  padding:6px 4px;
  position:relative;
}

.nav-links>a:not(.btn):not(.icon-btn):not(.user-name):not(.logout)::after {
  content:"";
  position:absolute;
  left:4px;
  right:4px;
  bottom:-2px;
  height:2px;
  background:var(--primary);
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .18s;
}

.nav-links>a:not(.btn):not(.icon-btn):not(.user-name):not(.logout):hover::after {
  transform:scaleX(1);
}

.nav-links .btn-primary {
  padding:9px 18px!important;
  font-size:13px!important;
  font-weight:700;
  letter-spacing:.4px;
  box-shadow:0 4px 14px rgba(253,197,42,.25);
  text-transform:uppercase;
}

.user-name {
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 12px;
  background:rgba(253,197,42,.08);
  border:1.5px solid rgba(253,197,42,.35);
  border-radius:24px;
  font-weight:600;
  font-size:13px;
}

.user-name:hover {
  background:rgba(253,197,42,.15);
  border-color:var(--primary);
}

.badge-admin {
  background:var(--primary);
  color:#0a2914;
  font-size:9px;
  font-weight:800;
  padding:2px 7px;
  border-radius:8px;
  letter-spacing:.5px;
  text-transform:uppercase;
}

@media (max-width:768px) {
  .logo-slogan {
    display:none;
  }
  .nav-inner {
    min-height:64px;
    padding:10px 14px;
  }
  .logo-mark {
    font-size:24px;
  }
  .logo-tail {
    font-size:14px;
    padding:4px 9px 3px;
  }
}

.auth-step,
.auth-steps {
  display:flex;
  align-items:center;
}

.auth-steps {
  gap:10px;
  margin:18px 0 22px;
  padding:14px;
  background:var(--bg-2);
  border:1px solid var(--border);
  border-radius:12px;
}

.auth-step {
  gap:8px;
  font-size:13px;
  color:var(--muted);
  font-weight:600;
}

.auth-step-num {
  width:26px;
  height:26px;
  border-radius:50%;
  background:#3d4a44;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  font-size:12px;
  flex-shrink:0;
}

.auth-step-num,
.auth-step.is-active {
  color:var(--text);
}

.auth-step.is-active .auth-step-num {
  background:var(--primary);
  color:#0a2914;
  box-shadow:0 0 0 3px rgba(253,197,42,.18);
}

.auth-step.is-done {
  color:#9be0b3;
}

.auth-step.is-done .auth-step-num {
  background:#16a34a;
  color:#fff;
}

.auth-step-sep {
  flex:1;
  height:2px;
  background:linear-gradient(90deg,var(--border),var(--primary),var(--border));
  opacity:.4;
  border-radius:1px;
}

.phone-confirmed {
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px 14px;
  background:rgba(74,222,128,.08);
  border:1.5px solid rgba(74,222,128,.35);
  border-radius:12px;
  margin:14px 0 18px;
}

.phone-confirmed-icon {
  font-size:24px;
}

.phone-confirmed-text {
  flex:1;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.phone-confirmed-text strong {
  color:var(--text);
  font-size:16px;
  letter-spacing:.3px;
}

.otp-input {
  font-size:28px!important;
  letter-spacing:14px!important;
  text-align:center!important;
  font-family:"SF Mono",Menlo,Consolas,monospace!important;
  font-weight:700!important;
  padding:14px!important;
  background:var(--bg-2)!important;
  border:2px solid var(--border-strong)!important;
  color:var(--primary)!important;
  border-radius:10px;
}

.otp-input:focus {
  border-color:var(--primary)!important;
  box-shadow:0 0 0 4px rgba(253,197,42,.18)!important;
  outline:0!important;
}

.otp-input::placeholder {
  color:#3d4a44;
  letter-spacing:14px;
}

.btn-link {
  background:0 0;
  border:0;
  color:var(--primary);
  font-size:inherit;
  font-weight:600;
  cursor:pointer;
  padding:0;
  text-decoration:underline;
  font-family:inherit;
}

.btn-link:hover {
  color:var(--primary-hi);
  text-decoration:none;
}

.admin-body {
  background:var(--bg,#16201d);
  color:var(--text,#e8efe9);
  margin:0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  min-height:100vh;
  display:flex;
}

.admin-sidebar {
  width:240px;
  background:#0f1a16;
  border-right:1px solid var(--border,#22332b);
  display:flex;
  flex-direction:column;
  position:sticky;
  top:0;
  height:100vh;
  flex-shrink:0;
}

.admin-brand,
.admin-nav a {
  color:var(--text);
  text-decoration:none;
}

.admin-brand {
  display:flex;
  align-items:center;
  gap:10px;
  padding:18px 16px;
  border-bottom:1px solid var(--border,#22332b);
}

.admin-brand-logo {
  width:38px;
  height:38px;
  border-radius:10px;
  background:linear-gradient(135deg,#fdc52a,#f59e0b);
  color:#0a2914;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
  font-size:20px;
  box-shadow:0 0 0 2px rgba(253,197,42,.18);
}

.admin-brand-logo.big {
  width:64px;
  height:64px;
  font-size:32px;
  border-radius:14px;
}

.admin-brand-text,
.admin-nav {
  display:flex;
  flex-direction:column;
}

.admin-brand-text {
  line-height:1.2;
}

.admin-brand-text strong {
  font-size:15px;
  letter-spacing:.2px;
}

.admin-brand-text small {
  font-size:11px;
  color:var(--muted,#8aa39a);
  text-transform:uppercase;
  letter-spacing:1px;
}

.admin-nav {
  padding:12px 8px;
  gap:2px;
  flex:1;
  overflow-y:auto;
}

.admin-nav a {
  padding:10px 12px;
  border-radius:8px;
  font-size:14px;
  font-weight:500;
  transition:.15s;
}

.admin-nav a .ico {
  font-size:16px;
  width:22px;
  text-align:center;
}

.admin-nav a:hover {
  background:#1a2620;
}

.admin-nav a.is-active {
  background:rgba(253,197,42,.12);
  color:var(--primary,#fdc52a);
  font-weight:700;
}

.admin-nav-sep {
  height:1px;
  background:var(--border,#22332b);
  margin:8px 6px;
}

.admin-sidebar-foot {
  padding:14px;
  border-top:1px solid var(--border,#22332b);
  display:flex;
  flex-direction:column;
  gap:10px;
}

.admin-user {
  display:flex;
  align-items:center;
  gap:10px;
}

.admin-user-avatar {
  width:36px;
  height:36px;
  border-radius:50%;
  background:var(--primary,#fdc52a);
  color:#0a2914;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  font-size:14px;
  flex-shrink:0;
}

.admin-user-info {
  display:flex;
  flex-direction:column;
  line-height:1.25;
  min-width:0;
  flex:1;
}

.admin-user-info small,
.admin-user-info strong {
  font-size:13px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.admin-user-info small {
  font-size:11px;
  color:var(--muted);
}

.admin-logout,
.admin-perf-grid>div {
  background:#1a2620;
  border-radius:8px;
}

.admin-logout {
  color:var(--text);
  border:1px solid var(--border,#22332b);
  padding:8px;
  font-size:12px;
  cursor:pointer;
  width:100%;
}

.admin-logout:hover {
  background:#ef4444;
  color:#fff;
  border-color:#ef4444;
}

.admin-main {
  flex:1;
  padding:24px 28px;
  max-width:1400px;
  width:100%;
  box-sizing:border-box;
}

.admin-page-head {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  margin-bottom:22px;
  flex-wrap:wrap;
}
/* Flex cocuklarinin (baslik + meta bloku) kuculebilmesi icin: aksi halde
   uzun bosluksuz metin min-content'i genisletip tum layout'u tasirir. */
.admin-page-head > div { min-width:0; max-width:100%; }
.admin-page-head .operator-badge { overflow-wrap:anywhere; word-break:break-word; }


.admin-page-head h1 {
  margin:0 0 4px;
  font-size:24px;
  font-weight:800;
  overflow-wrap:anywhere;
  word-break:break-word;
  min-width:0;
  max-width:100%;
}

.admin-page-head h1 small {
  font-size:14px;
  font-weight:600;
}

.admin-page-head p {
  margin:0;
  font-size:13px;
}

.admin-page-head-actions {
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}

.admin-flash {
  padding:12px 16px;
  border-radius:10px;
  margin-bottom:16px;
  font-size:14px;
  font-weight:500;
  border:1px solid;
}

.admin-flash-success {
  background:rgba(34,197,94,.1);
  border-color:rgba(34,197,94,.4);
  color:#86efac;
}

.admin-flash-error {
  background:rgba(239,68,68,.1);
  border-color:rgba(239,68,68,.4);
  color:#fca5a5;
}

.admin-card {
  background:#15201c;
  border:1px solid var(--border,#22332b);
  border-radius:12px;
  padding:18px 20px;
  margin-bottom:18px;
}

.admin-card-head {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:14px;
  gap:8px;
  flex-wrap:wrap;
}

.admin-card-head h2,
.admin-card-head h3 {
  margin:0;
  font-size:16px;
  font-weight:700;
}

.admin-row {
  display:grid;
  grid-template-columns:2fr 1fr;
  gap:18px;
  margin-bottom:18px;
}

.admin-row .complaint-docs,
.admin-row .doc-attach__info,
.admin-row>* {
  min-width:0;
}

.admin-row .doc-attach__name {
  min-width:0;
  max-width:100%;
}

.admin-col-2 {
  grid-column:span 1;
}

@media (max-width:980px) {
  .admin-row {
    grid-template-columns:1fr;
  }
  .admin-sidebar {
    width:60px;
  }
  .admin-brand-text,
  .admin-logout,
  .admin-nav a span:not(.ico),
  .admin-user-info {
    display:none;
  }
  .admin-nav a {
    justify-content:center;
  }
}

.admin-kpi-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:14px;
  margin-bottom:18px;
}

.admin-kpi,
.admin-kpi-icon {
  border-radius:12px;
  align-items:center;
}

.admin-kpi {
  background:#15201c;
  border:1px solid var(--border,#22332b);
  padding:14px 16px;
  display:flex;
  gap:14px;
}

.admin-kpi-icon {
  width:48px;
  height:48px;
  display:inline-flex;
  justify-content:center;
  font-size:22px;
  flex-shrink:0;
}

.admin-kpi-info {
  display:flex;
  flex-direction:column;
  line-height:1.2;
  min-width:0;
}

.admin-kpi-info strong {
  font-size:26px;
  font-weight:800;
  color:var(--text);
}

.admin-kpi-info small,
.admin-pending-body strong {
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.admin-kpi-info small {
  font-size:12px;
  color:var(--muted);
}

.admin-pending-list {
  list-style:none;
  padding:0;
  margin:0;
}

.admin-pending-list li,
.admin-table td,
.admin-table th {
  border-bottom:1px solid var(--border,#22332b);
}

.admin-pending-item {
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px 4px;
  color:var(--text);
  text-decoration:none;
}

.admin-pending-item:hover,
.admin-table tbody tr:hover {
  background:#1a2620;
}

.admin-pending-cat {
  font-size:22px;
  width:30px;
  text-align:center;
  flex-shrink:0;
}

.admin-pending-body {
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.admin-pending-body strong {
  font-size:14px;
  display:block;
}

.admin-pending-age,
.admin-table thead th {
  background:#1a2620;
  color:var(--muted);
  font-weight:700;
}

.admin-pending-age {
  font-size:12px;
  padding:4px 8px;
  border-radius:6px;
  flex-shrink:0;
}

.admin-pending-age.is-warn {
  background:rgba(245,158,11,.15);
  color:#fbbf24;
}

.admin-pending-age.is-late {
  background:rgba(239,68,68,.15);
  color:#fca5a5;
}

.admin-cat-list {
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.admin-cat-row {
  display:flex;
  justify-content:space-between;
  font-size:13px;
  margin-bottom:4px;
}

.admin-cat-bar {
  height:6px;
  background:#1a2620;
  border-radius:3px;
  overflow:hidden;
}

.admin-cat-bar-fill {
  height:100%;
  background:linear-gradient(90deg,var(--primary,#fdc52a),#22c55e);
}

.admin-perf-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
  gap:14px;
}

.admin-perf-grid>div {
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:10px;
}

.admin-perf-grid strong.big {
  font-size:22px;
  font-weight:800;
}

.admin-empty {
  text-align:center;
  color:var(--muted);
  padding:24px 0;
  font-size:14px;
}

.admin-filters {
  background:#15201c;
  border:1px solid var(--border,#22332b);
  border-radius:12px;
  padding:12px 14px;
}

.admin-filters input,
.admin-filters select {
  border:1px solid var(--border,#22332b);
  color:var(--text);
}

.admin-filters input {
  flex:1;
}

.admin-filters select {
  cursor:pointer;
}

.admin-table-wrap {
  padding:0;
  overflow-x:auto;
  overflow-y:hidden;
}

.admin-table {
  border-collapse:collapse;
  font-size:13px;
}

.admin-table td,
.admin-table th {
  text-align:left;
}

.admin-table thead th {
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.6px;
}

.admin-pagination a,
.admin-row-title {
  color:var(--text);
  text-decoration:none;
  font-weight:600;
  font-size:14px;
}

.admin-row-title:hover {
  color:var(--primary,#fdc52a);
}

.admin-row-meta {
  font-size:11px;
  color:var(--muted);
  margin-top:3px;
}

.badge-pending,
.badge-replied {
  padding:3px 8px;
  border-radius:5px;
  font-size:11px;
  font-weight:700;
}

.badge-replied {
  background:rgba(34,197,94,.15);
  color:#86efac;
}

.badge-pending {
  background:rgba(245,158,11,.15);
  color:#fbbf24;
}

.btn-sm {
  border-radius:6px;
}

.admin-pagination {
  padding:14px;
  border-top:1px solid var(--border,#22332b);
}

.admin-pagination a {
  background:#1a2620;
  padding:6px 10px;
  border:1px solid #2a3a32;
  border-radius:6px;
  color:#e6f0ea;
  font-size:13px;
}

.admin-pagination a:hover,
.admin-radio:hover {
  background:#22332b;
}

.admin-complaint-body {
  font-size:15px;
  line-height:1.65;
  white-space:pre-wrap;
  color:var(--text);
  word-wrap:break-word;
  overflow-wrap:anywhere;
  max-width:100%;
}

.admin-complaint-image {
  max-width:100%;
  border-radius:10px;
  margin-top:14px;
  border:1px solid var(--border,#22332b);
}

.admin-sep {
  border:0;
  border-top:1px solid var(--border,#22332b);
  margin:18px 0;
}

.admin-comments {
  list-style:none;
  padding:0;
  margin:14px 0;
  display:flex;
  flex-direction:column;
  gap:12px;
}

.admin-comments li {
  padding:12px 14px;
  border-radius:10px;
  background:#1a2620;
  border-left:3px solid var(--border,#22332b);
}

.admin-comments li.is-brand {
  border-left-color:var(--primary,#fdc52a);
  background:rgba(253,197,42,.07);
}

.admin-comment-head {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:6px;
  font-size:13px;
}

.admin-comment-body {
  font-size:14px;
  line-height:1.55;
  color:var(--text);
  white-space:pre-wrap;
}

.brand-pill {
  background:var(--primary,#fdc52a);
  color:#0a2914;
  font-size:10px;
  padding:2px 6px;
  border-radius:4px;
  font-weight:800;
  margin-left:6px;
  letter-spacing:.3px;
}

.admin-rating {
  padding:12px;
  background:#1a2620;
  border-radius:10px;
  font-size:14px;
}

.admin-rating blockquote {
  margin:8px 0 0;
  padding:8px 12px;
  border-left:3px solid var(--primary,#fdc52a);
  color:var(--muted);
  font-style:italic;
  font-size:13px;
}

.admin-status-form {
  display:flex;
  flex-direction:column;
  gap:8px;
}

.admin-radio {
  display:flex;
  align-items:center;
  gap:8px;
  padding:9px 11px;
  background:#1a2620;
  border-radius:8px;
  cursor:pointer;
  font-size:13px;
  line-height:1.2;
  white-space:nowrap;
}

.admin-radio svg {
  flex-shrink:0;
  display:inline-block;
  vertical-align:middle;
}

.admin-radio input {
  margin:0;
}

.admin-status-form label.admin-radio {
  display:flex;
  text-transform:none;
  letter-spacing:normal;
  color:var(--text);
  font-weight:400;
  margin:0;
}

.admin-status-form .admin-radio input[type=radio] {
  width:16px;
  height:16px;
  flex:0 0 auto;
  padding:0;
  background:0 0;
  border:0;
  accent-color:var(--primary,#fdc52a);
}

.admin-canned-label {
  display:block;
  font-size:12px;
  color:var(--muted);
  margin-bottom:6px;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.5px;
}

#reply-content,
.admin-canned-select {
  width:100%;
  background:#0f1a16;
  border-radius:8px;
}

.admin-canned-select {
  border:1px solid var(--primary,#fdc52a);
  color:var(--primary,#fdc52a);
  padding:10px 12px;
  margin-bottom:14px;
  font-weight:600;
  cursor:pointer;
}

#reply-content {
  border:1px solid var(--border,#22332b);
  color:var(--text);
  padding:12px;
  font-family:inherit;
  font-size:14px;
  resize:vertical;
  line-height:1.6;
  box-sizing:border-box;
}

#reply-content:focus,
.admin-card form input:focus,
.admin-card form select:focus,
.admin-card form textarea:focus,
.admin-login-card form input:focus {
  border-color:var(--primary,#fdc52a);
  outline:0;
}

.status-pill {
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:4px 10px;
  border-radius:6px;
  font-size:11px;
  font-weight:700;
  background:#1a2620;
}

.status-pill.status-open {
  background:rgba(239,68,68,.15);
  color:#fca5a5;
}

.status-pill.status-progress {
  background:rgba(245,158,11,.15);
  color:#fbbf24;
}

.status-pill.status-resolved {
  background:rgba(34,197,94,.15);
  color:#86efac;
}

.status-pill.big {
  font-size:13px;
  padding:6px 14px;
}

.admin-collapse {
  display:none;
}

.admin-collapse.is-open {
  display:block;
}

.admin-canned-preview {
  font-size:12px;
  color:var(--muted);
  max-width:520px;
  line-height:1.5;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
@media (max-width:1200px) {
  .admin-canned-preview { max-width:360px; }
}
@media (max-width:900px) {
  .admin-canned-preview { max-width:240px; }
}

.admin-collapse .btn,
.admin-collapse .btn-primary {
  width:auto!important;
  max-width:100%;
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:10px 22px!important;
  font-weight:700;
  white-space:nowrap;
  box-sizing:border-box;
}

.admin-actions {
  display:flex;
  gap:8px;
  align-items:center;
  white-space:nowrap;
}

/* Filtre cubugu aksiyon butonlari: ayni gorsel dilde, hizali, tutarli boyut */
.admin-filters-actions {
  display:flex;
  align-items:stretch;
  gap:8px;
  flex-wrap:wrap;
  margin-left:auto;
}

/* Uc buton da (button + a) ayni yukseklik/hiza/boyutta olsun.
   Button ile <a> arasindaki varsayilan line-height/box farkini sifirla. */
.admin-filters-actions .btn {
  min-width:0;
  height:38px;
  padding:0 16px;
  margin:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  line-height:1;
  box-sizing:border-box;
  white-space:nowrap;
  vertical-align:middle;
}


/* Yesil (pozitif) aksiyon butonu — orn. Excel disa aktar */
.btn-success {
  background:linear-gradient(180deg,#22c55e 0%,#16a34a 100%);
  color:#052e16;
  border:1px solid #16a34a;
  box-shadow:0 2px 0 rgba(0,0,0,.2);
}

.btn-success:hover {
  background:linear-gradient(180deg,#34d77b 0%,#1aad4d 100%);
  color:#052e16;
  box-shadow:0 4px 14px rgba(34,197,94,.35);
  transform:translateY(-1px);
}

/* Admin koyu temada notr/ikincil (ghost) buton: cerceveli, sade */
.admin-filters .btn-ghost,
.admin-filters-actions .btn-ghost {
  background:#0f1a16;
  color:var(--muted, #8ba99a);
  border:1px solid var(--border, #22332b);
}

.admin-filters .btn-ghost:hover,
.admin-filters-actions .btn-ghost:hover {
  background:#1a2620;
  color:var(--text, #e8efe9);
  border-color:var(--border-strong, #2a7a47);
}




.admin-login-body {
  background:linear-gradient(135deg,#0a1411 0,#16201d 60%,#0f1a16 100%);
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  color:var(--text,#e8efe9);
}

.admin-login-card {
  background:#15201c;
  border:1px solid var(--border,#22332b);
  border-radius:16px;
  padding:34px 36px;
  width:100%;
  max-width:380px;
  box-shadow:0 20px 60px rgba(0,0,0,.4);
}

.admin-login-brand {
  text-align:center;
  margin-bottom:24px;
}

.admin-login-brand h1 {
  margin:14px 0 4px;
  font-size:22px;
  font-weight:800;
}

.admin-login-brand p {
  margin:0;
  color:var(--muted);
  font-size:13px;
}

.admin-login-brand .admin-brand-logo {
  margin:0 auto;
}

.admin-card form label,
.admin-login-card form label {
  display:block;
  font-size:12px;
  color:var(--muted);
  margin:12px 0 6px;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.5px;
}

.admin-card form input,
.admin-card form select,
.admin-card form textarea,
.admin-login-card form input {
  width:100%;
  background:#0f1a16;
  border:1px solid var(--border,#22332b);
  color:var(--text);
  padding:11px 12px;
  border-radius:8px;
  font-size:14px;
  box-sizing:border-box;
}

.admin-login-foot {
  text-align:center;
  margin-top:18px;
  font-size:11px;
}

.admin-card form input,
.admin-card form select,
.admin-card form textarea {
  padding:10px 12px;
  font-family:inherit;
}

.admin-card form textarea {
  resize:vertical;
  line-height:1.6;
}

.admin-card form .btn {
  margin-top:14px;
}

.admin-quick-bar {
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  background:rgba(253,197,42,.08);
  border:1px dashed rgba(253,197,42,.4);
  border-radius:10px;
  padding:10px 14px;
  margin:14px 0;
  font-size:13px;
}

.admin-quick-bar .btn,
.btn-admin {
  padding:6px 12px;
  font-size:13px;
}

.btn-admin {
  background:#0f1a16;
  color:var(--primary,#fdc52a)!important;
  border:1px solid var(--primary,#fdc52a);
  border-radius:8px;
  font-weight:700;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:5px;
}

.btn-admin:hover {
  background:var(--primary,#fdc52a);
  color:#0a2914!important;
}

.admin-filters {
  display:flex;
  gap:8px;
  align-items:center;
  margin:14px 0;
  flex-wrap:wrap;
}

.admin-filters input,
.admin-filters select {
  background:#0f1a16;
  color:#e6f0ea;
  border:1px solid #2a3a32;
  border-radius:8px;
  padding:8px 10px;
  font-size:13px;
  min-width:180px;
}

.admin-filters input:focus,
.admin-filters select:focus {
  outline:0;
  border-color:var(--primary,#fdc52a);
}

.admin-panel {
  display:none;
  background:#0f1a16;
  border:1px solid #2a3a32;
  border-radius:10px;
  padding:14px;
  margin:10px 0 18px;
}

.admin-panel.is-open {
  display:block;
}

.admin-form-inline {
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
}

.admin-form-inline input {
  background:#1a2620;
  color:#e6f0ea;
  border:1px solid #2a3a32;
  border-radius:8px;
  padding:8px 10px;
  font-size:14px;
}

.pill {
  display:inline-block;
  padding:2px 8px;
  border-radius:12px;
  font-size:11px;
  font-weight:700;
  letter-spacing:.3px;
}

.pill-admin {
  background:rgba(253,197,42,.15);
  color:#fdc52a;
  border:1px solid #5a4a18;
}

.pill-banned {
  background:rgba(220,53,69,.18);
  color:#ff8b8b;
  border:1px solid #6a2a30;
}

.pill-ok {
  background:rgba(40,180,99,.15);
  border:1px solid #1c4a30;
}

.pill-warn {
  background:rgba(253,197,42,.12);
  color:#fdc52a;
  border:1px solid #5a4a18;
}

.pill-danger {
  background:rgba(220,53,69,.18);
  color:#ff8b8b;
  border:1px solid #6a2a30;
}

.btn-mini {
  background:#1a2620;
  color:#e6f0ea;
  border:1px solid #2a3a32;
  padding:5px 10px;
  border-radius:6px;
  font-size:12px;
  font-weight:600;
  cursor:pointer;
  text-decoration:none;
  display:inline-block;
}

.btn-mini:hover {
  background:#243029;
  border-color:#3a4a42;
}

.btn-mini-ok {
  background:#1c4a30;
  border-color:#2d6a45;
  color:#c8f0d8;
}

.btn-mini-ok:hover {
  background:#246039;
  border-color:#3a8559;
}

.btn-mini-danger {
  background:#5a1820;
  border-color:#7a2530;
  color:#ffc8c8;
}

.btn-mini-danger:hover {
  background:#7a2230;
  border-color:#9a3040;
}

.btn-mini-ghost {
  background:0 0;
  border:1px dashed #3a4a42;
}

.btn-mini[disabled] {
  opacity:.4;
  cursor:not-allowed;
}

.admin-pagination {
  display:flex;
  gap:6px;
  justify-content:center;
  margin:18px 0;
}

.admin-pagination a.is-active {
  background:var(--primary,#fdc52a);
  color:#0a2914;
  border-color:var(--primary,#fdc52a);
  font-weight:700;
}

/* Devre disi ok (ilk/son sayfada) */
.admin-pagination .is-disabled {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#131f1a;
  padding:6px 10px;
  border:1px solid #2a3a32;
  border-radius:6px;
  color:#4d5f56;
  font-size:13px;
  cursor:not-allowed;
  user-select:none;
}

/* "…" bosluk isareti — tiklanamaz, sade */
.admin-pagination .pagination-gap {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:6px 4px;
  color:var(--muted,#8aa39a);
  font-size:13px;
  user-select:none;
}


.admin-chart7 {
  display:flex;
  align-items:flex-end;
  gap:14px;
  height:180px;
  padding:12px 4px 0;
  position:relative;
}

.admin-chart7-col {
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;
  height:100%;
  position:relative;
}

.admin-chart7-val {
  font-size:12px;
  color:#9ca3af;
  margin-bottom:6px;
  font-weight:600;
  letter-spacing:.3px;
  min-height:16px;
}

.admin-chart7-bar {
  width:100%;
  max-width:48px;
  background:linear-gradient(to top,#3b82f6,#60a5fa);
  border-radius:6px 6px 0 0;
  transition:height .5s ease,background .2s;
  min-height:6px;
  position:relative;
}

.admin-chart7-bar:hover {
  background:linear-gradient(to top,#2563eb,#3b82f6);
  transform:translateY(-2px);
  box-shadow:0 4px 12px rgba(59,130,246,.4);
}

.admin-chart7-bar.is-today {
  background:linear-gradient(to top,#fdc52a,#fde047);
}

.admin-chart7-bar.is-today:hover {
  background:linear-gradient(to top,#eab308,#fde047);
  box-shadow:0 4px 12px rgba(253,197,42,.4);
}

.admin-chart7-label {
  font-size:11px;
  color:#9ca3af;
  margin-top:8px;
  text-transform:uppercase;
  letter-spacing:.5px;
  font-weight:600;
}

.settings-tabs {
  display:flex;
  gap:0;
  margin:16px 0 20px;
  border-bottom:1px solid var(--admin-border, #e5e7eb);
  flex-wrap:wrap;
}

.settings-tab {
  padding:10px 18px;
  color:var(--muted, #6b7280);
  text-decoration:none;
  font-weight:500;
  font-size:14px;
  border-bottom:2px solid transparent;
  margin-bottom:-1px;
  transition:all .15s ease;
}

.settings-tab:hover {
  color:var(--text, #111827);
  background:rgba(0,0,0,.02);
}

.settings-tab.active {
  color:var(--admin-accent, #2563eb);
  border-bottom-color:var(--admin-accent, #2563eb);
}

[data-theme=admin] .settings-tab:hover {
  background:rgba(255,255,255,.04);
  color:#fff;
}

.alert {
  padding:12px 16px;
  border-radius:8px;
  font-size:14px;
  border:1px solid transparent;
}

.alert-success {
  background:#ecfdf5;
  color:#065f46;
  border-color:#a7f3d0;
}

.alert-warning {
  background:#fffbeb;
  color:#92400e;
  border-color:#fde68a;
}

.alert-info {
  background:#eff6ff;
  color:#1e40af;
  border-color:#bfdbfe;
}

[data-theme=admin] .alert-success {
  background:rgba(16,185,129,.12);
  color:#6ee7b7;
  border-color:rgba(16,185,129,.3);
}

[data-theme=admin] .alert-warning {
  background:rgba(245,158,11,.12);
  color:#fcd34d;
  border-color:rgba(245,158,11,.3);
}

[data-theme=admin] .alert-info {
  background:rgba(59,130,246,.12);
  color:#93c5fd;
  border-color:rgba(59,130,246,.3);
}

.pill-ok {
  display:inline-block;
  padding:2px 8px;
  border-radius:999px;
  background:#10b981;
  color:#fff;
  font-size:11px;
  font-weight:600;
  vertical-align:middle;
}

.btn-ghost {
  background:0 0;
  color:var(--muted, #6b7280);
  border:1px solid var(--admin-border, #e5e7eb);
}

.btn-ghost:hover {
  background:rgba(0,0,0,.03);
  color:var(--text, #111827);
}

.btn-sm {
  padding:6px 12px;
  font-size:13px;
}

@media (max-width:600px) {
  .settings-tab {
    padding:8px 12px;
    font-size:13px;
  }
}

.dropzone {
  border:2px dashed #cbd5e1;
  border-radius:12px;
  padding:24px;
  text-align:center;
  cursor:pointer;
  transition:all .15s ease;
  background:#fafafa;
}

.dropzone.is-drag,
.dropzone:focus,
.dropzone:hover {
  border-color:#2563eb;
  background:#eff6ff;
  outline:0;
}

.dropzone-empty .dropzone-icon {
  font-size:40px;
  margin-bottom:8px;
}

.dropzone-empty p {
  margin:4px 0;
}

.files-preview {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(120px,1fr));
  gap:12px;
  margin-top:8px;
}

.file-item,
.file-meta {
  display:flex;
  flex-direction:column;
}

.file-item {
  position:relative;
  border:1px solid #e5e7eb;
  border-radius:8px;
  overflow:hidden;
  background:#fff;
  aspect-ratio:1/1.1;
}

.file-item .file-video-ph,
.file-item img {
  width:100%;
  flex:1;
  object-fit:cover;
  background:#111827;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-weight:700;
}

.file-video-ph .file-vico {
  font-size:28px;
  margin-right:6px;
}

.file-video-ph .file-vlbl {
  font-size:11px;
  letter-spacing:1px;
}

.file-meta {
  padding:4px 8px;
  font-size:11px;
  background:#f9fafb;
}

.file-meta span {
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.file-meta small {
  color:#6b7280;
  font-size:10px;
}

.file-remove {
  position:absolute;
  top:4px;
  right:4px;
  width:22px;
  height:22px;
  border-radius:50%;
  border:0;
  background:rgba(0,0,0,.6);
  color:#fff;
  cursor:pointer;
  font-size:16px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
}

.file-remove:hover,
.gallery-delete button:hover {
  background:#dc2626;
}

.complaint-gallery {
  display:grid;
}

.gallery-item {
  background:#111827;
  transition:transform .15s ease;
}

.gallery-item:hover {
  transform:scale(1.02);
}

.gallery-item video {
  display:block;
}

.gallery-item--video {
  cursor:pointer;
}

.gallery-delete button,
.gallery-play {
  border-radius:50%;
  background:rgba(0,0,0,.7);
  color:#fff;
}

.gallery-play {
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  width:48px;
  height:48px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:22px;
}

.gallery-delete {
  position:absolute;
  top:6px;
  right:6px;
  margin:0;
}

.gallery-delete button {
  border:0;
  line-height:1;
  cursor:pointer;
}

.lightbox,
.lightbox-stage {
  align-items:center;
  justify-content:center;
}

.lightbox {
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.92);
  display:none;
  z-index:9999;
}

.lightbox.is-open {
  display:flex;
}

.lightbox-stage {
  max-width:92vw;
  max-height:88vh;
  display:flex;
}

.lightbox-stage img,
.lightbox-stage video {
  max-width:92vw;
  max-height:88vh;
  border-radius:8px;
  box-shadow:0 8px 40px rgba(0,0,0,.6);
}

.lightbox-close,
.lightbox-next,
.lightbox-prev {
  position:absolute;
  background:rgba(255,255,255,.1);
  color:#fff;
  border:0;
  cursor:pointer;
  border-radius:50%;
  transition:background .15s;
}

.lightbox-close:hover,
.lightbox-next:hover,
.lightbox-prev:hover {
  background:rgba(255,255,255,.25);
}

.lightbox-close {
  top:20px;
  right:20px;
  width:44px;
  height:44px;
  font-size:28px;
}

.lightbox-next,
.lightbox-prev {
  top:50%;
  transform:translateY(-50%);
  width:52px;
  height:52px;
  font-size:36px;
  line-height:1;
}

.lightbox-prev {
  left:20px;
}

.lightbox-next {
  right:20px;
}

.lightbox-counter {
  position:absolute;
  bottom:20px;
  left:50%;
  transform:translateX(-50%);
  color:rgba(255,255,255,.8);
  font-size:14px;
  font-variant-numeric:tabular-nums;
}

@media (max-width:640px) {
  .complaint-gallery {
    grid-template-columns:repeat(auto-fill,minmax(110px,1fr));
    gap:6px;
  }
  .lightbox-next,
  .lightbox-prev {
    width:40px;
    height:40px;
    font-size:28px;
  }
  .lightbox-prev {
    left:8px;
  }
  .lightbox-next {
    right:8px;
  }
  .lightbox-close {
    width:36px;
    height:36px;
    font-size:22px;
    top:12px;
    right:12px;
  }
}

.icn {
  display:inline-block;
  vertical-align:-3px;
  flex-shrink:0;
  stroke:currentColor;
  fill:none;
}

.nav-links .btn,
.nav-links a,
.user-menu .logout,
.user-menu a {
  display:inline-flex;
  align-items:center;
  gap:6px;
}

.admin-nav a {
  display:flex;
  align-items:center;
  gap:10px;
}

.admin-nav .icn {
  flex-shrink:0;
  opacity:.85;
}

.admin-nav a.is-active .icn {
  opacity:1;
}

.admin-login-card .btn {
  display:inline-flex;
  gap:8px;
}

.admin-login-card .btn,
.admin-login-foot,
.icon-btn {
  align-items:center;
  justify-content:center;
}

.admin-login-foot {
  display:flex;
  gap:8px;
}

.icon-btn {
  position:relative;
  display:inline-flex;
  width:38px;
  height:38px;
  border-radius:50%;
  color:var(--text, #cfd6e4);
  transition:background .15s,color .15s;
}

.icon-btn:hover {
  background:rgba(255,255,255,.06);
  color:#fff;
}

.icon-badge {
  position:absolute;
  top:2px;
  right:2px;
  min-width:18px;
  height:18px;
  padding:0 5px;
  border-radius:9px;
  background:#ef4444;
  color:#fff;
  font-size:11px;
  font-weight:700;
  line-height:18px;
  text-align:center;
}

.btn-admin .icn,
.btn-primary .icn {
  vertical-align:-2px;
}

.rating-box-cta {
  margin-top:28px;
  border-left:4px solid var(--primary, #fdc52a);
  position:relative;
}

.rating-box-cta::before {
  content:"";
  position:absolute;
  top:-14px;
  left:18px;
  width:28px;
  height:28px;
  border-radius:50%;
  background:var(--primary, #fdc52a);
  opacity:.15;
}

.rating-box-cta h3 {
  align-items:center;
  gap:8px;
}

.rating-box-cta h3 .icn {
  vertical-align:-3px;
}

.rating-box-cta .btn-primary {
  align-self:flex-start;
  padding:10px 18px;
}

.rating-box-cta .btn-primary .icn {
  vertical-align:-3px;
  margin-right:4px;
}

@media (max-width:640px) {
  .rating-box-cta .btn-primary {
    align-self:stretch;
    text-align:center;
  }
}

.rating-stars .star .icn,
.rating-stars-static .star .icn {
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  transition:fill .12s ease,color .12s ease;
}

.rating-stars .star.is-active .icn,
.rating-stars .star.is-hover .icn,
.rating-stars .star:hover .icn,
.rating-stars-static .star.is-active .icn {
  fill:currentColor;
}

.rating-stars .star:hover {
  color:var(--primary, #fdc52a);
}

.rating-stars-static .star {
  color:#3d4a44;
  opacity:.55;
}

.rating-stars-static .star.is-active {
  color:var(--primary, #fdc52a);
  opacity:1;
}

body,
html {
  background-color:var(--bg, #0a2914)!important;
}

.cv-me-too.voted {
  background:rgba(253,197,42,.22);
  transition:background .25s ease;
}

.cv-mini-rating {
  margin-top:14px;
  padding:14px 16px;
  background:linear-gradient(135deg,var(--card-dark) 0%,var(--bg-2) 100%);
  border:1px solid var(--border);
  border-left:4px solid var(--primary);
  border-radius:12px;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.cv-mini-rating__stars {
  display:inline-flex;
  align-items:center;
  gap:3px;
  font-size:16px;
}

.cv-mini-rating__stars .star {
  color:#3d4a44;
  opacity:.55;
}

.cv-mini-rating__stars .star.is-active {
  color:var(--primary);
  opacity:1;
}

.cv-mini-rating__stars .star .icn {
  fill:currentColor;
  stroke:currentColor;
}

.cv-mini-rating__stars strong {
  margin-left:8px;
  color:var(--text);
  font-size:14px;
  font-weight:800;
}

.cv-mini-rating__msg {
  position:relative;
  margin:0;
  padding:12px 16px 12px 44px;
  background:rgba(253,197,42,.06);
  border:1px solid rgba(253,197,42,.22);
  border-radius:10px;
  color:var(--text);
  font-size:15px;
  font-weight:600;
  font-style:normal;
  line-height:1.5;
}

.cv-mini-rating__msg::before {
  content:"“";
  position:absolute;
  left:12px;
  top:0;
  font-family:Georgia,"Times New Roman",serif;
  font-size:44px;
  line-height:1;
  color:var(--primary);
  opacity:.8;
}

.cv-mini-rating__time {
  color:var(--muted);
  font-size:12px;
}

.cv-resolved-note {
  margin-top:14px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:8px 12px;
  background:rgba(74,222,128,.08);
  border:1px solid rgba(74,222,128,.28);
  border-radius:10px;
  color:#86efac!important;
}

@media (max-width:640px) {
  .cv-mini-rating {
    padding:12px;
  }
  .cv-mini-rating__msg {
    font-size:14px;
    padding:10px 14px 10px 40px;
  }
  .cv-mini-rating__msg::before {
    font-size:38px;
  }
}

*,
::after,
::before {
  box-sizing:border-box;
}

iframe,
img,
svg,
video {
  max-width:100%;
  height:auto;
}

.container,
.content,
.layout,
.sidebar {
  max-width:100%;
}

.content,
.layout {
  overflow-x:clip;
}

@media (max-width:900px) {
  .container {
    padding-left:14px;
    padding-right:14px;
  }
  .layout {
    display:block;
  }
  .content,
  .sidebar {
    width:100%;
    max-width:100%;
  }
  .sidebar {
    margin-top:22px;
  }
  .nav-inner {
    gap:10px;
  }
  .nav-links {
    flex-wrap:wrap;
    gap:8px;
  }
  .logo-slogan {
    display:none;
  }
}

@media (max-width:640px) {
  .container {
    padding-left:12px;
    padding-right:12px;
  }
  /* .page kartinin sabit 36px padding'i dar ekranda ic gridi sikistirip
     settings-card'larin "kaymis" gorunmesine yol aciyordu. Kucult. */
  .page {
    padding:20px 16px;
    border-radius:12px;
  }
  .page h1 {
    font-size:22px;
    overflow-wrap:anywhere;
    word-break:break-word;
  }
  .settings-grid {
    grid-template-columns:1fr;
    gap:1rem;
    margin-top:1.25rem;
  }
  .settings-card {
    padding:1.25rem 1rem;
  }
  .hero {
    padding:28px 0 18px;
  }

  .hero-content h1 {
    font-size:22px;
    line-height:1.25;
  }
  .hero-content p {
    font-size:14px;
  }
  .hero-search {
    flex-direction:row!important;
    align-items:center!important;
    gap:0!important;
    height:50px;
  }
  .hero-search input {
    width:100%;
    padding:0 96px 0 46px!important;
    font-size:14px;
  }
  .hero-search-icon {
    left:14px;
  }
  .hero-search button {
    width:auto!important;
    padding:0 18px!important;
    font-size:13px!important;
    right:5px!important;
  }
  .trust-metrics {
    grid-template-columns:1fr!important;
    gap:10px;
  }
  .trust-card {
    padding:12px;
  }
  .trust-text strong {
    font-size:18px;
  }
  .sort-tabs,
  .status-filters {
    flex-wrap:wrap;
    gap:6px;
  }
  .filter-pill,
  .sort-tabs a {
    font-size:13px;
    padding:6px 10px;
  }
  .section-header {
    flex-direction:column;
    align-items:flex-start;
    gap:10px;
  }
  .cv-card {
    padding:14px;
    margin-bottom:12px;
    word-wrap:break-word;
    overflow-wrap:anywhere;
  }
  .cv-head {
    flex-wrap:wrap;
    gap:8px;
  }
  .cv-author {
    min-width:0;
  }
  .cv-author-name,
  .cv-time {
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .cv-title {
    font-size:16px;
    line-height:1.35;
  }
  .cv-excerpt {
    font-size:14px;
  }
  .cv-foot {
    flex-wrap:wrap;
    gap:10px;
    row-gap:8px;
  }
  .cv-me-too {
    padding:6px 10px;
    font-size:13px;
  }
  .brand-reply-box {
    flex-direction:column;
    gap:10px;
    padding:12px;
  }
  .brand-reply-logo {
    align-self:flex-start;
  }
  .brand-reply-body,
  .comment-form textarea,
  .rating-form textarea {
    width:100%;
    min-width:0;
  }
  .brand-reply-body p {
    font-size:13px;
    word-break:break-word;
  }
  .complaint-detail h1 {
    font-size:22px;
    line-height:1.3;
  }
  .detail-author,
  .detail-meta,
  .vote-bar {
    flex-wrap:wrap;
    gap:8px;
  }
  .vote-bar {
    gap:10px;
  }
  .vote-btn {
    padding:8px 12px;
    font-size:14px;
  }
  .vote-score-big {
    font-size:22px;
  }
  .rating-stars .star {
    font-size:30px!important;
  }
  table {
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }
  .admin-body,
  table {
    display:block;
  }
  .admin-sidebar {
    position:static;
    width:100%;
    height:auto;
  }
  .admin-main {
    padding:16px 12px;
  }
}

@media (max-width:400px) {
  .container {
    padding-left:10px;
    padding-right:10px;
  }
  .logo-mark {
    font-size:22px;
  }
  .logo-tail {
    font-size:12px;
    padding:3px 8px;
  }
  .btn {
    font-size:13px;
    padding:8px 12px;
  }
  .cv-card {
    padding:12px;
  }
}

.media-broken-ph {
  width:100%;
  aspect-ratio:4/3;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg,#f3f4f6 0,#e5e7eb 100%);
  color:#6b7280;
  font-size:14px;
  border-radius:8px;
  border:1px dashed #cbd5e1;
}

.gallery-item--legacy {
  background:linear-gradient(135deg,#fff7ed 0,#fef3c7 100%);
}

.gallery-video-fallback {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:20px 12px;
  text-align:center;
  min-height:180px;
}

.gallery-video-fallback .gv-icon {
  color:#d97706;
  display:inline-flex;
}

.gallery-video-fallback .gv-msg {
  font-size:13px;
  color:#374151;
  line-height:1.4;
}

.gallery-video-fallback .gv-download {
  display:inline-block;
  padding:6px 14px;
  background:#2563eb;
  color:#fff;
  border-radius:6px;
  font-size:13px;
  font-weight:600;
  text-decoration:none;
  transition:background .15s;
}

.gallery-video-fallback .gv-download:hover {
  background:#1d4ed8;
}

.gallery-video-errmsg {
  display:none;
  position:absolute;
  bottom:8px;
  left:8px;
  right:8px;
  background:rgba(220,38,38,.95);
  color:#fff;
  padding:6px 10px;
  border-radius:4px;
  font-size:12px;
  text-align:center;
}

.gallery-video-errmsg a {
  color:#fef3c7;
  text-decoration:underline;
  font-weight:600;
}

.gallery-item.gallery-video-error .gallery-video-errmsg {
  display:block;
}

.gallery-item.gallery-video-error .gallery-play,
.gallery-item.gallery-video-error video {
  opacity:.3;
}

@media (max-width:640px) {
  .gallery-video-fallback {
    min-height:140px;
    padding:14px 8px;
  }
  .gallery-video-fallback .gv-msg {
    font-size:12px;
  }
}

.pagination {
  margin:28px 0 8px;
  padding-top:20px;
  border-top:1px solid var(--border);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:14px;
}

.pagination-info {
  font-size:13px;
  color:rgba(245,250,246,.65);
}

.pagination-info strong {
  color:var(--primary);
  font-weight:700;
}

.pagination-list {
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:6px;
  list-style:none;
  padding:0;
  margin:0;
}

.pagination-list li,
.rating-box-cta h3 {
  display:inline-flex;
}

.pagination-list a,
.pagination-list span {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-width:40px;
  height:40px;
  padding:0 14px;
  font-size:14px;
  font-weight:600;
  color:var(--text);
  background:var(--card);
  border:1px solid var(--border);
  border-radius:10px;
  text-decoration:none;
  transition:all .18s ease;
  user-select:none;
}

.pagination-list a:hover {
  background:var(--card-2);
  border-color:var(--primary);
  color:var(--primary);
  transform:translateY(-1px);
  box-shadow:0 4px 12px rgba(253,197,42,.12);
}

.pagination-list .is-current {
  background:var(--primary);
  border-color:var(--primary);
  color:#07210f;
  font-weight:800;
  cursor:default;
  box-shadow:0 4px 14px rgba(253,197,42,.35);
}

.pagination-list .is-disabled {
  opacity:.35;
  cursor:not-allowed;
  background:var(--card-dark);
  color:rgba(245,250,246,.5);
  border-color:var(--border);
}

.pagination-list .pagination-gap {
  display:inline-flex;
  align-items:center;
  padding:0 4px;
  color:rgba(245,250,246,.4);
  user-select:none;
  font-size:14px;
  min-width:auto;
  height:40px;
  border:0;
  background:0 0;
}

/* Onceki / Sonraki gezinme butonlari (numaralardan ayri konteyner).
   :has()/order hilesi YOK -> tum tarayicilarda (Samsung Internet dahil) calisir. */
.pagination-nav {
  display:flex;
  justify-content:center;
  gap:10px;
  width:100%;
  max-width:420px;
}
.pagination-nav a,
.pagination-nav span {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  flex:1 1 0;
  min-height:40px;
  padding:0 16px;
  font-size:14px;
  font-weight:600;
  color:var(--text);
  background:var(--card);
  border:1px solid var(--border);
  border-radius:10px;
  text-decoration:none;
  transition:all .18s ease;
  user-select:none;
  white-space:nowrap;
}
.pagination-nav a:hover {
  background:var(--card-2);
  border-color:var(--primary);
  color:var(--primary);
}
.pagination-nav .is-disabled {
  opacity:.4;
  cursor:not-allowed;
  background:var(--card-dark);
  color:rgba(245,250,246,.5);
}

@media (max-width:540px) {
  /* Mobil (dar cihazlar dahil: Z Fold, S8+ vb.):
     Numaralar tek satirda kalir, tasarsa yatay kaydirilir (wrap YOK -> asla dagilmaz).
     Onceki/Sonraki altta iki esit buton. */
  .pagination { gap:12px; }
  .pagination-info { text-align:center; font-size:12px; line-height:1.5; }

  /* Numaralar az (max: 1 … orta3 … son) -> tek satirda ortali sigar,
     YATAY KAYDIRMA YOK. Cok dar ekranda gerekirse ortalanmis wrap. */
  .pagination-list {
    flex-wrap:wrap;
    overflow:visible;
    max-width:100%;
    gap:6px;
    padding:0;
    justify-content:center;
  }
  .pagination-list a,
  .pagination-list span {
    min-width:38px;
    height:38px;
    padding:0 6px;
    font-size:13px;
    flex:0 0 auto;
  }
  .pagination-list .pagination-gap { min-width:14px; padding:0; height:38px; }

  .pagination-nav { max-width:100%; }
  .pagination-nav a,
  .pagination-nav span {
    min-height:42px;
    font-size:13px;
    padding:0 10px;
  }
}

.complaint-gallery {
  grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
  gap:10px;
  margin:18px 0;
}

.gallery-item {
  aspect-ratio:auto;
  min-height:180px;
  max-height:260px;
  background:var(--card-dark);
  border:1px solid var(--border);
  border-radius:10px;
  position:relative;
  overflow:hidden;
  cursor:zoom-in;
  -webkit-tap-highlight-color:rgba(253,197,42,.2);
}

.gallery-item img,
.gallery-item video {
  width:100%;
  height:100%;
  object-fit:contain;
}

.gallery-item img {
  background:var(--card-dark);
  display:block;
}

.gallery-item video {
  background:#000;
}

.gallery-play,
.gallery-video-errmsg {
  pointer-events:none;
}

.gallery-play {
  background:rgba(0,0,0,.65);
  border:2px solid rgba(253,197,42,.85);
  color:var(--primary);
}

.gallery-delete,
.gallery-delete button {
  pointer-events:auto;
  z-index:3;
}

.gallery-delete button {
  width:32px;
  height:32px;
  font-size:20px;
}

@media (hover:none) {
  .gallery-item:hover {
    transform:none;
  }
  .gallery-item:active {
    opacity:.85;
    transition:opacity .1s;
  }
}

@media (max-width:640px) {
  .complaint-gallery {
    grid-template-columns:repeat(2,1fr);
    gap:8px;
  }
  .gallery-item {
    min-height:140px;
    max-height:200px;
  }
}

.complaint-detail .detail-body {
  background:var(--bg-2);
  border:1px solid var(--border);
  border-radius:12px;
  padding:20px 22px;
  margin:18px 0 8px;
}

.complaint-detail .detail-body p {
  margin:0;
  color:#e5f0e9;
  font-size:16px;
  line-height:1.75;
  white-space:pre-wrap;
  word-wrap:break-word;
  overflow-wrap:anywhere;
}

.complaint-detail .detail-body .complaint-gallery {
  margin-top:18px;
  margin-bottom:0;
}

@media (max-width:640px) {
  .complaint-detail .detail-body {
    padding:16px 14px;
    margin:14px 0 4px;
    border-radius:10px;
  }
  .complaint-detail .detail-body p {
    font-size:15px;
    line-height:1.65;
  }
  .lightbox-stage img,
  .lightbox-stage video {
    max-width:100vw;
    max-height:80vh;
  }
}

.turnstile-widget {
  margin:14px 0 6px;
  min-height:65px;
  display:flex;
  justify-content:center;
}

.turnstile-widget iframe {
  border-radius:8px;
}

@media (max-width:480px) {
  .turnstile-widget {
    min-height:70px;
  }
}

.phone-input-group {
  display:flex;
  align-items:stretch;
  border:1px solid var(--border, #2f3b33);
  border-radius:10px;
  overflow:hidden;
  background:var(--input-bg, #16211a);
  transition:border-color .15s ease,box-shadow .15s ease;
}

.phone-input-group:focus-within {
  border-color:var(--accent, #f0b429);
  box-shadow:0 0 0 3px rgba(240,180,41,.15);
}

.phone-input-group .phone-prefix {
  display:inline-flex;
  align-items:center;
  padding:0 12px;
  font-weight:700;
  color:var(--text, #e9f0ea);
  background:rgba(255,255,255,.04);
  border-right:1px solid var(--border, #2f3b33);
  user-select:none;
  white-space:nowrap;
}

.phone-input-group #phone-local {
  flex:1 1 auto;
  min-width:0;
  border:0;
  outline:0;
  background:0 0;
  color:var(--text, #e9f0ea);
  padding:12px 14px;
  font-size:1rem;
  letter-spacing:.5px;
}

.phone-input-group #phone-local::placeholder {
  color:rgba(233,240,234,.4);
}

.nav-toggle {
  display:none;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  width:44px;
  height:44px;
  padding:0;
  margin-left:auto;
  background:0 0;
  border:1px solid var(--border);
  border-radius:10px;
  cursor:pointer;
  transition:background .15s ease,border-color .15s ease;
}

.nav-toggle:hover {
  border-color:var(--primary);
}

.nav-toggle-bar {
  display:block;
  width:22px;
  height:2px;
  margin:0 auto;
  background:var(--primary);
  border-radius:2px;
  transition:transform .25s ease,opacity .2s ease;
}

.nav-toggle.is-open .nav-toggle-bar:nth-child(1) {
  transform:translateY(7px) rotate(45deg);
}

.nav-toggle.is-open .nav-toggle-bar:nth-child(2) {
  opacity:0;
}

.nav-toggle.is-open .nav-toggle-bar:nth-child(3) {
  transform:translateY(-7px) rotate(-45deg);
}

@media (max-width:768px) {
  .nav-inner {
    flex-wrap:nowrap!important;
    align-items:center;
    gap:12px!important;
    padding:12px 14px!important;
    min-height:60px!important;
  }
  .nav-toggle {
    display:flex;
  }
  .nav-links {
    position:absolute;
    top:100%;
    left:0;
    right:0;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:4px!important;
    padding:10px 14px 16px!important;
    background:linear-gradient(180deg,#0e3d20 0,#07210f 100%);
    border-bottom:2px solid rgba(253,197,42,.35);
    box-shadow:0 12px 28px rgba(0,0,0,.5);
    max-height:0;
    overflow:hidden;
    opacity:0;
    visibility:hidden;
    transform:translateY(-6px);
    transition:max-height .3s ease,opacity .25s ease,transform .25s ease,visibility 0s linear .25s;
    z-index:200;
  }
  .navbar {
    position:relative;
  }
  .nav-links.is-open {
    max-height:80vh;
    overflow-y:auto;
    opacity:1;
    visibility:visible;
    transform:translateY(0);
    transition:max-height .3s ease,opacity .25s ease,transform .25s ease,visibility 0s;
  }
  .nav-links .btn,
  .nav-links .user-menu,
  .nav-links>a {
    width:100%;
    justify-content:flex-start!important;
    padding:12px!important;
    font-size:15px!important;
    border-radius:10px;
  }
  .nav-links>a:not(.btn):hover {
    background:rgba(255,255,255,.05);
  }
  .nav-links .btn-primary {
    justify-content:center!important;
    margin:4px 0;
  }
  .nav-links .btn-primary::after {
    display:none;
  }
  .nav-links .user-menu {
    flex-direction:column;
    align-items:stretch;
    gap:4px;
    border-top:1px solid var(--border);
    margin-top:6px;
    padding-top:8px!important;
  }
  .nav-links>a::after {
    display:none!important;
  }
}

.nav-quick {
  display:none;
}

.nav-quick-link {
  color:var(--text);
  text-decoration:none;
  font-weight:700;
  font-size:14px;
  white-space:nowrap;
}

@media (max-width:768px) {
  .nav-quick {
    min-width:0;
  }
  .nav-quick .btn-primary {
    padding:9px 14px!important;
    font-size:12px!important;
    white-space:nowrap!important;
    margin:0!important;
  }
  .nav-quick-link {
    font-size:12px;
    white-space:nowrap;
  }
  .nav-dup {
    display:none!important;
  }
  .navbar {
    position:relative;
  }
  .nav-inner {
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px!important;
    padding:10px 14px!important;
    min-height:60px!important;
  }
  .logo {
    flex-shrink:0;
  }
  .logo-slogan {
    display:none!important;
  }
  .nav-quick {
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    margin-left:auto!important;
    order:2;
  }
  .nav-links .nav-dup.btn-primary,
  .nav-links>a::after,
  .nav-quick-link {
    display:none!important;
  }
  .nav-toggle {
    display:flex!important;
    margin-left:0!important;
    flex-shrink:0!important;
    order:3;
    position:relative;
    z-index:210;
  }
  .nav-links {
    position:absolute!important;
    top:100%!important;
    left:0!important;
    right:0!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:4px!important;
    padding:10px 14px 16px!important;
    background:linear-gradient(180deg,#0e3d20 0,#07210f 100%)!important;
    border-bottom:2px solid rgba(253,197,42,.35)!important;
    box-shadow:0 12px 28px rgba(0,0,0,.5)!important;
    max-height:0!important;
    overflow:hidden!important;
    opacity:0!important;
    visibility:hidden!important;
    transform:translateY(-6px)!important;
    transition:max-height .3s ease,opacity .25s ease,transform .25s ease,visibility 0s linear .25s!important;
    z-index:200!important;
  }
  .nav-links.is-open {
    max-height:85vh!important;
    overflow-y:auto!important;
    opacity:1!important;
    visibility:visible!important;
    transform:translateY(0)!important;
    transition:max-height .3s ease,opacity .25s ease,transform .25s ease,visibility 0s!important;
  }
  .nav-links .btn,
  .nav-links .user-menu,
  .nav-links>a {
    width:100%!important;
    justify-content:flex-start!important;
    padding:12px!important;
    font-size:15px!important;
    border-radius:10px!important;
  }
}

.admin-topbar {
  display:none!important;
}

.admin-mobile-toggle {
  display:none;
}

@media (max-width:900px) {
  .admin-topbar {
    display:flex!important;
    align-items:center;
    gap:12px;
    padding:12px 16px;
    background:#0f1a16;
    border-bottom:1px solid var(--border, #22332b);
    position:sticky;
    top:0;
    z-index:300;
  }
  .admin-topbar-brand {
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:var(--gold, #fdc52a);
    text-decoration:none;
    font-weight:800;
  }
  .admin-mobile-toggle {
    display:inline-flex;
    flex-direction:column;
    justify-content:center;
    gap:4px;
    width:40px;
    height:40px;
    padding:8px;
    background:rgba(253,197,42,.12);
    border:1px solid rgba(253,197,42,.4);
    border-radius:10px;
    cursor:pointer;
  }
  .admin-mobile-toggle span {
    display:block;
    height:2px;
    width:100%;
    background:var(--gold, #fdc52a);
    border-radius:2px;
  }
  .admin-sidebar {
    position:fixed!important;
    top:0;
    left:0;
    width:260px!important;
    height:100vh!important;
    transform:translateX(-100%);
    transition:transform .28s ease;
    z-index:400;
    box-shadow:4px 0 24px rgba(0,0,0,.5);
  }
  .admin-sidebar.is-open {
    transform:translateX(0);
  }
  .admin-main {
    padding:16px 14px!important;
  }
}

@media (max-width:768px) {
  .nav-links .icon-btn {
    width:100%!important;
    justify-content:flex-start!important;
    gap:10px;
    padding:12px!important;
    border-radius:10px!important;
  }
  .nav-links .icon-btn .badge-count,
  .nav-links .icon-btn .icon-badge {
    position:static!important;
    top:auto!important;
    right:auto!important;
    margin-left:auto!important;
    min-width:20px;
    height:20px;
    padding:0 6px;
    border:0!important;
    box-sizing:border-box!important;
    border-radius:10px;
    font-size:11px;
    line-height:20px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
  }
  .nav-links .icon-btn svg {
    flex:0 0 auto;
  }
  .nav-links .user-menu {
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    width:100%!important;
    gap:4px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
  }
  .nav-links .user-menu .logout,
  .nav-links .user-menu .user-name {
    width:100%!important;
    justify-content:flex-start!important;
    gap:10px;
    padding:12px!important;
    font-size:15px!important;
    border-radius:10px!important;
  }
  .nav-links .user-menu .logout[title=Ayarlar]::after {
    content:"Ayarlar";
    font-weight:600;
  }
  .nav-links .btn-admin {
    width:100%!important;
    justify-content:flex-start!important;
  }
}

.icon-btn-label {
  display:none;
}

@media (max-width:768px) {
  .nav-links a.icon-btn {
    width:100%!important;
    height:auto!important;
    border-radius:10px!important;
    justify-content:flex-start!important;
    gap:10px;
    padding:12px!important;
    font-size:15px!important;
    font-weight:600;
  }
  .icon-btn-label {
    display:inline;
  }
  .nav-links a.icon-btn .icon-badge {
    position:static;
    margin-left:auto;
  }
}

.admin-card-danger {
  border:1px solid rgba(239,68,68,.35);
  background:rgba(239,68,68,.04);
}

.btn-danger {
  background:#ef4444;
  color:#fff!important;
  border:1px solid #dc2626;
  font-weight:700;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  transition:background .15s,box-shadow .15s;
}

.btn-danger:hover {
  background:#dc2626;
  box-shadow:0 4px 14px rgba(239,68,68,.3);
}

.btn-block {
  display:flex;
  width:100%;
  justify-content:center;
}

.admin-table {
  table-layout:auto;
  width:100%;
}

.admin-table td,
.admin-table th {
  vertical-align:middle;
  padding:14px 16px;
  white-space:nowrap;
}

.admin-table td.col-title,
.admin-table td.col-wrap,
.admin-table th.col-title,
.admin-table th.col-wrap {
  white-space:normal;
  word-wrap:break-word;
  overflow-wrap:anywhere;
}

/* Site kullanici adi: bosluksuz cok uzun metinler sutunu sisirip komsu
   hucrelerle ust uste binmesin. Sutunu sinirla + tasan kismi ... ile kes. */
.admin-table .op-username {
  display:inline-block;
  max-width:220px;
  vertical-align:middle;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
@media (max-width:900px) {
  .admin-table .op-username { max-width:140px; }
}

.admin-table .pill {
  display:inline-flex;
  align-items:center;
  gap:6px;
  white-space:nowrap;
  line-height:1.3;
  max-width:100%;
}

.admin-table .pill .icn {
  flex-shrink:0;
}

.admin-table td code {
  display:inline-block;
  max-width:100%;
  white-space:normal;
  word-break:break-all;
  line-height:1.5;
  font-size:12px;
  color:var(--muted);
}

@media (max-width:900px) {
  .admin-table {
    table-layout:auto;
    min-width:640px;
  }
  .admin-table td:nth-child(n),
  .admin-table th:nth-child(n) {
    width:auto;
  }
}

main.main {
  min-height:calc(100vh - 76px - 300px);
}

.complaint-card {
  position:relative;
}

.complaint-card .card-link::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
}

.complaint-card .card-footer a,
.complaint-card .cat-tag,
.complaint-card .vote-col a,
.complaint-card button,
.complaint-card form {
  position:relative;
  z-index:2;
}

.rating-edit-wrap {
  margin-top:12px;
}

.btn-rating-edit {
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:8px 16px;
  background:0 0;
  color:var(--primary);
  border:1.5px solid var(--primary);
  border-radius:8px;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
  transition:background .15s,color .15s,box-shadow .15s;
  font-family:inherit;
}

.btn-rating-edit:hover {
  background:var(--primary);
  color:#0a2914;
  box-shadow:0 2px 10px rgba(253,197,42,.3);
}

.btn-rating-edit .icn {
  vertical-align:-3px;
}

.rating-edit-form[hidden] {
  display:none!important;
}

.rating-edit-form {
  display:flex;
  flex-direction:column;
  gap:4px;
  margin-top:14px;
  padding:16px;
  background:var(--bg-2);
  border:1px solid var(--border);
  border-radius:12px;
  animation:fadeIn .2s ease;
}

.rating-edit-actions {
  display:flex;
  gap:10px;
  margin-top:12px;
}

.rating-edit-actions .btn-sm {
  padding:8px 18px;
  font-size:13px;
}

.rating-edit-form .btn-ghost {
  background:0 0;
  color:var(--muted);
  border:1px solid var(--border-strong);
}

.rating-edit-form .btn-ghost:hover {
  background:var(--card);
  color:var(--text);
  border-color:var(--primary);
}

.admin-table td.col-title {
  max-width:340px;
}

.admin-row-title {
  text-overflow:ellipsis;
  line-height:1.35;
}

.admin-row-title {
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  word-break:break-word;
  overflow-wrap:anywhere;
}

/* Meta satiri (goz/yorum/like): ikon+sayilar tek satirda hizali dursun,
   dar sutunda alt satira kayip bozulmasin. */
.admin-row-meta {
  display:flex;
  align-items:center;
  flex-wrap:nowrap;
  gap:4px;
  white-space:nowrap;
  overflow:hidden;
}
.admin-row-meta .icn {
  flex-shrink:0;
  vertical-align:middle;
}


@media (max-width:900px) {
  .admin-table td.col-title {
    max-width:200px;
  }
}

.layout:has(.complaint-detail) {
  grid-template-columns:minmax(0,1fr);
  max-width:900px;
  margin-left:auto;
  margin-right:auto;
}

.layout:has(.complaint-detail)>.sidebar {
  display:none;
}

@media (max-width:360px) {
  .nav-inner {
    gap:6px!important;
    padding:8px 10px!important;
    min-height:56px!important;
  }
  .logo {
    min-width:0;
    flex-shrink:1;
    overflow:hidden;
  }
  .logo-mark {
    font-size:19px!important;
    letter-spacing:.5px;
  }
  .logo-tail {
    font-size:11px!important;
    padding:3px 6px 2px!important;
    letter-spacing:.6px;
    border-width:1.5px;
  }
  .nav-quick,
  .nav-toggle {
    flex-shrink:0;
  }
  .nav-toggle {
    width:40px;
    height:38px;
    padding:0!important;
    margin-left:0!important;
  }
}

.complaint-docs {
  display:flex;
  flex-direction:column;
  gap:10px;
  margin:16px 0 4px;
}

.doc-attach {
  display:flex;
  align-items:center;
  gap:13px;
  padding:11px 14px;
  background:var(--card-dark);
  border:1px solid var(--border);
  border-left:3px solid var(--primary);
  border-radius:12px;
  text-decoration:none;
  color:var(--text);
  transition:background .15s ease,border-color .15s ease,transform .12s ease;
}

.doc-attach:hover {
  background:var(--bg-2);
  border-color:var(--border-strong);
  border-left-color:var(--primary);
  transform:translateY(-1px);
}

.doc-attach__thumb {
  flex-shrink:0;
  width:44px;
  height:44px;
  border-radius:10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(253,197,42,.12);
  border:1px solid rgba(253,197,42,.3);
  color:var(--primary);
}

.doc-attach--video .doc-attach__thumb {
  background:rgba(96,165,250,.12);
  border-color:rgba(96,165,250,.35);
  color:#93c5fd;
}

.doc-attach--image .doc-attach__thumb {
  background:rgba(74,222,128,.12);
  border-color:rgba(74,222,128,.35);
  color:#86efac;
}

.doc-attach__info {
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
  flex:1;
  line-height:1.35;
}

.doc-attach__name {
  display:flex;
  align-items:center;
  gap:6px;
  font-weight:700;
  font-size:14px;
  color:var(--text);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.doc-attach__clip {
  flex-shrink:0;
  color:var(--muted);
}

.doc-attach__meta {
  font-size:12px;
  color:var(--muted);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

@media (max-width:640px) {
  .doc-attach {
    padding:10px 12px;
    gap:11px;
  }
  .doc-attach__thumb {
    width:40px;
    height:40px;
  }
  .doc-attach__name {
    font-size:13px;
  }
}

.btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
}

.btn .icn {
  width:1em;
  height:1em;
  flex-shrink:0;
  vertical-align:middle;
}

.admin-table td.admin-log-detail,
td.admin-log-detail {
  white-space:normal!important;
  overflow-wrap:anywhere;
  word-break:break-word;
  max-width:480px;
  line-height:1.5;
}

.admin-table td.admin-log-detail .admin-muted {
  display:inline;
}

.admin-canned-edit-row>td {
  padding:0!important;
  background:#0f1a16;
  border-bottom:none;
}
/* Duzenleme formu kapaliyken hicbir yer kaplamasin (bos satir/cizgi olusmasin) */
.admin-canned-edit-row:not(:has(.admin-collapse.is-open)) > td {
  border:0!important;
  height:0;
  line-height:0;
  font-size:0;
}
/* Form acilinca alt cizgi geri gelsin */
.admin-canned-edit-row:has(.admin-collapse.is-open) > td {
  border-bottom:1px solid var(--border, #22332b);
}


.admin-canned-edit-row .admin-collapse {
  margin:0;
  padding:14px 18px 18px;
}

.admin-canned-edit-row form {
  display:block;
  max-width:720px;
  margin:0 auto;
}

.admin-canned-edit-row form label {
  display:block;
  margin:12px 0 6px;
  font-size:12px;
  font-weight:600;
  color:var(--muted, #8ba99a);
  text-transform:uppercase;
  letter-spacing:.04em;
}

.admin-canned-edit-row form input[type=text],
.admin-canned-edit-row form select,
.admin-canned-edit-row form textarea {
  display:block;
  width:100%;
  box-sizing:border-box;
  white-space:normal;
}

.admin-canned-edit-row form textarea {
  resize:vertical;
  min-height:90px;
}

.admin-canned-edit-row form .btn {
  margin-top:16px;
}

.cv-card {
  min-width:0;
  overflow:hidden;
}

.cv-excerpt,
.cv-title,
.cv-title-link {
  overflow-wrap:anywhere;
  word-break:break-word;
  max-width:100%;
}

.cv-excerpt,
.cv-title {
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.cv-excerpt {
  -webkit-line-clamp:3;
}

@media (min-width:1025px) {
  .nav-links .icon-btn {
    width:42px;
    height:42px;
  }
  .nav-links .icon-btn svg {
    width:22px;
    height:22px;
  }
  .nav-links .icon-btn .icon-badge {
    top:-2px;
    right:-2px;
    min-width:16px;
    height:16px;
    padding:0 4px;
    font-size:10px;
    line-height:16px;
    border:2px solid var(--bg, #0c1712);
    box-sizing:border-box;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .user-menu {
    gap:12px;
  }
  .user-menu .logout {
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:7px 12px;
    border:1px solid var(--border, #22332b);
    border-radius:9px;
    font-size:13px;
    font-weight:600;
    color:var(--muted, #8ba99a);
    background:var(--bg-2, #0f1a16);
    transition:border-color .15s,color .15s,background .15s;
  }
  .user-menu .logout:hover {
    color:var(--primary, #f2c94c);
    border-color:var(--primary, #f2c94c);
    background:rgba(242,201,76,.08);
  }
  .user-menu .logout[title=Ayarlar] {
    padding:7px 9px;
  }
}

.nav-links .btn-primary,
.nav-links a.btn-primary,
.nav-links a.btn-primary:hover,
.nav-links>a.btn-primary,
.nav-links>a.btn-primary:hover {
  color:#0d3520!important;
}

/* PC header'daki "Siteye Git" (.btn-accent.nav-dup) — KAYIT OL / SIKAYET YAZ
   (.nav-links .btn-primary) ile BIREBIR ayni olcu, font ve hiza.
   Ikon + metin ayni yukseklikte hizali dursun, yazi kesilmesin. */
.nav-links .btn-accent {
  padding:9px 18px !important;
  font-size:13px !important;
  font-weight:700 !important;
  letter-spacing:.4px !important;
  line-height:1 !important;
  border-radius:8px !important;
  gap:6px !important;
}
.nav-links .btn-accent .icn {
  width:16px !important;
  height:16px !important;
}



/* ============================================================================
   MODERASYON — onay bekleyen sikayetler (admin/moderation.ejs)
   ============================================================================ */

/* Sidebar menu rozeti (bekleyen sayisi) */
.admin-nav-badge {
  margin-left: auto;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  color: #fff;
  background: #e53935;
  border-radius: 999px;
}

/* Baslik yaninda "N bekleyen" cipi */
.admin-chip {
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  font-size: 13px;
  font-weight: 600;
  color: var(--text, #1a1a1a);
  background: rgba(229, 57, 53, .1);
  border: 1px solid rgba(229, 57, 53, .3);
  border-radius: 999px;
}

/* Moderasyon karti listesi */
.admin-mod-list {
  display: grid;
  gap: 16px;
  margin-top: 16px;
}

.admin-mod-card {
  background: var(--card, #fff);
  border: 1px solid var(--border, #e5e7eb);
  border-left: 4px solid #e53935;
  border-radius: 12px;
  padding: 18px 20px;
}

.admin-mod-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.admin-mod-cat {
  font-size: 13px;
  font-weight: 600;
  color: var(--muted, #6b7280);
}

.admin-mod-date {
  font-size: 12px;
  color: var(--muted, #9ca3af);
  white-space: nowrap;
}

.admin-mod-title {
  margin: 0 0 8px;
  font-size: 17px;
  font-weight: 700;
  color: var(--text, #111);
  word-break: break-word;
}

.admin-mod-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  margin-bottom: 12px;
  font-size: 13px;
  color: var(--muted, #6b7280);
}

.admin-mod-content {
  margin: 0 0 16px;
  padding: 12px 14px;
  font-size: 14px;
  line-height: 1.6;
  /* Admin panelin koyu temasi: acik zemin YERINE koyu, yazi acik gri —
     boylece beyaz-uzeri-beyaz okunmazlik sorunu bitti. */
  color: #e8eef0;
  background: rgba(0, 0, 0, 0.28);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  white-space: pre-wrap;
  word-break: break-word;
}


.admin-mod-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
/* Form varsayilan margin'i butonu kaydiriyordu — sifirla, form icindeki
   butonu da diger ikisiyle ayni satirda tut. */
.admin-mod-actions > .btn,
.admin-mod-actions > form,
.admin-mod-actions > button {
  margin: 0;
}
.admin-mod-actions > form {
  padding: 0;
  display: inline-flex;
  align-items: center;
}
/* KRITIK: global "form button { margin-top:18px }" kurali form icindeki
   yesil butonu asagi kaydiriyordu. Sifirla. */
.admin-mod-actions form button,
.admin-mod-actions form .btn {
  margin-top: 0 !important;
}
/* Uc buton da ayni KUCUK olcu ve ayni yukseklikte olsun. Genel .btn kurali
   (padding:10px 22px) .btn-sm'i eziyordu; burada net sabitliyoruz.
   Hepsi ayni satirda dikey ORTALI dursun. */
.admin-mod-actions .btn {
  padding: 8px 16px;
  font-size: 13px;
  height: 38px;
  line-height: 1;
  box-sizing: border-box;
  vertical-align: middle;
  align-self: center;
}





/* Textarea'nin modal-pass-input ile tutarli gorunmesi */
.admin-modal textarea.modal-pass-input {
  min-height: 84px;
  resize: vertical;
  font-family: inherit;
  line-height: 1.5;
}

@media (max-width: 640px) {
  .admin-mod-actions { flex-direction: column; align-items: stretch; }
  .admin-mod-actions .btn,
  .admin-mod-actions form { width: 100%; }
  .admin-mod-actions form .btn { width: 100%; }
}

/* ============================================================================
   MODERASYON DURUM UYARISI — sikayet sahibine/admin'e gorunur
   (reddedildi / onay bekliyor). Yayindaki sikayetlerde gosterilmez.
   ============================================================================ */
.mod-notice {
  margin: 14px 0 4px;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid transparent;
  font-size: 14px;
  line-height: 1.5;
}
.mod-notice__head {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
}
.mod-notice__head svg { flex: 0 0 auto; }
.mod-notice__reason {
  margin: 8px 0 0;
  padding: 8px 12px;
  background: rgba(0, 0, 0, 0.18);
  border-radius: 8px;
  word-break: break-word;
}
.mod-notice__reason span { opacity: 0.75; margin-right: 4px; }
.mod-notice__hint {
  margin: 8px 0 0;
  opacity: 0.85;
  font-size: 13px;
}
.mod-notice .btn { margin-top: 10px; }

/* Reddedildi — kirmizi ton */
.mod-notice--rejected {
  background: rgba(220, 53, 69, 0.10);
  border-color: rgba(220, 53, 69, 0.35);
  color: #ffb3ba;
}
.mod-notice--rejected .mod-notice__head { color: #ff6b7a; }

/* Onay bekliyor — sari/amber ton */
.mod-notice--pending {
  background: rgba(245, 196, 71, 0.10);
  border-color: rgba(245, 196, 71, 0.35);
  color: #f5d98a;
}
.mod-notice--pending .mod-notice__head { color: #f5c447; }

/* Outline buton (yeni sikayet olustur linki icin) */
.mod-notice .btn-outline {
  background: transparent;
  border: 1px solid currentColor;
  color: inherit;
}
.mod-notice .btn-outline:hover { background: rgba(255, 255, 255, 0.08); }
.btn-sm { padding: 6px 14px; font-size: 13px; }

/* Bildirim: link'i olmayan kart (or. reddedilmis-silinmis sikayet) tiklanamaz */
.notif-link--static {
  cursor: default;
  text-decoration: none;
}
.notif-link--static:hover {
  background: transparent;
}
/* Reddetme sebebi gibi cok satirli bildirim metinleri satir sonlarini korusun */
.notif-text {
  white-space: pre-line;
}

/* ============================================================
   HEADER "Siteye Git" (btn-accent) — DIKKAT CEKEN neon CTA
   Parlak yesil-neon gradient + pulse animasyonu.
   Sari "Sikayet Yaz"dan net ayrisir; harici guncel giris linki.
   ============================================================ */
.btn-accent {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  /* KAYIT OL (.btn-primary) ile AYNI renk/font: altin gradient + koyu metin + uppercase.
     Boyut: header'daki diger butonlarla (KAYIT OL / SIKAYET YAZ nav) ayni hizada —
     .nav-links .btn-primary olcusu: 9px 18px / 13px. */
  background: linear-gradient(180deg, var(--primary) 0%, var(--primary-2) 100%);
  color: #0d3520 !important;
  border: 0;
  border-radius: 8px;
  padding: 9px 18px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .4px;
  text-transform: uppercase;

  white-space: nowrap;
  overflow: hidden;
  box-shadow: var(--gold-glow), 0 6px 20px rgba(0, 0, 0, .4);
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.btn-accent:hover {
  background: linear-gradient(180deg, var(--primary-hi) 0%, var(--primary) 100%);
  color: #0d3520 !important;
  transform: translateY(-2px);
  box-shadow: var(--gold-glow), 0 8px 24px rgba(0, 0, 0, .45);
}
.btn-accent .icn { flex-shrink: 0; }

/* Gumus shimmer: soguk beyaz-gumus isik butonun uzerinden gecer */
.btn-accent::before {
  content: "";
  position: absolute;
  top: 0;
  left: -60%;
  width: 42%;
  height: 100%;
  background: linear-gradient(120deg,
    transparent 0%,
    rgba(255, 255, 255, .35) 40%,
    rgba(226, 232, 240, .85) 50%,
    rgba(255, 255, 255, .35) 60%,
    transparent 100%);
  transform: skewX(-20deg);
  animation: btnSilverShine 3.2s ease-in-out infinite;
  pointer-events: none;
}
@keyframes btnSilverShine {
  0%, 55% { left: -60%; }
  100% { left: 130%; }
}
.btn-accent:hover::before { animation-duration: 1.4s; }

/* Pulse artik kullanilmiyor ama var olan sinif zararsiz kalsin */
.btn-pulse { animation: none; }
@media (prefers-reduced-motion: reduce) {
  .btn-accent::before { animation: none; display: none; }
}

/* ============================================================
   HERO mobil-only birincil CTA: "Şikayet Yaz"
   Arama kutusunun altinda tam genislik. Masaustunde gizli.
   ============================================================ */
.hero-cta-mobile {
  display: none;
}
@media (max-width: 768px) {
  .hero-cta-mobile {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    width: 100%;
    max-width: 620px;
    margin: 0 auto 26px;
    padding: 15px 20px;
    background: linear-gradient(180deg, var(--primary) 0%, var(--primary-2) 100%);
    color: #0d3520 !important;
    font-weight: 800;
    font-size: 16px;
    letter-spacing: .4px;
    text-transform: uppercase;
    border-radius: 12px;
    box-shadow: var(--gold-glow), 0 6px 18px rgba(0, 0, 0, .35);
    transition: transform .15s ease, box-shadow .15s ease;
  }
  .hero-cta-mobile:hover,
  .hero-cta-mobile:active {
    color: #0d3520 !important;
    transform: translateY(-1px);
  }
  .hero-cta-mobile .icn { flex-shrink: 0; }

  /* Mobil header: sadece "Siteye Git" + hamburger kalir.
     Logo (mark 24px / tail 14px) ile orantili — butonu daha kucuk tut. */
  .nav-quick {
    display: flex !important;
    align-items: center !important;
    min-width: 0 !important;
    flex-shrink: 0 !important;
  }
  .nav-quick .btn-accent {
    padding: 7px 12px !important;
    font-size: 12px !important;
    letter-spacing: .3px !important;
    border-radius: 7px !important;
    flex-shrink: 0;
  }
  .nav-quick .btn-accent .icn {
    width: 14px !important;
    height: 14px !important;
  }
}

/* ── Cok dar (<=380): "Siteye Git" daha da kompakt ── */
@media (max-width: 380px) {
  .nav-quick .btn-accent {
    padding: 6px 10px !important;
    font-size: 11px !important;
    gap: 5px !important;
  }
}

/* ============================================================================
   GALAXY FOLD & COK DAR EKRAN (<=360px) — TASMA / KAYMA EMNIYETI
   320px gibi sabit minmax track'ler bu genislikte ekrani tasirir ve kartlar
   "kaymis" gibi gorunur. Burada tum sabit-genislikli grid'leri tek sutuna
   indirir, kart/form ic bosluklarini kucultur ve yatay tasmayi kilitleriz.
   ============================================================================ */
@media (max-width: 360px) {
  /* Genel yatay tasma emniyeti */
  html, body { overflow-x: hidden; max-width: 100%; }

  /* Sabit minmax kullanan tum grid'ler tek sutun olsun (track > ekran sorunu) */
  .settings-grid,
  .form-grid,
  .brand-grid,
  .cat-grid,
  .files-preview,
  .trust-metrics,
  .admin-kpi-grid,
  .admin-perf-grid,
  .complaint-gallery {
    grid-template-columns: 1fr !important;
  }

  /* Kart / bolum ic bosluklarini kucult; her biri ekrana sigsin */
  .settings-card,
  .rating-box,
  .wizard-form,
  .page,
  .complaint-detail,
  .comments-section,
  .auth-box,
  .form-box,
  .modal-card {
    padding: 16px 14px !important;
    max-width: 100% !important;
  }

  /* Ic ogeler asla ic-kutu genisligini asmasin */
  .settings-card,
  .settings-card input,
  .settings-card select,
  .settings-card textarea,
  .wizard-form,
  .wizard-form input,
  .wizard-form textarea {
    min-width: 0;
    max-width: 100%;
  }

  /* Sabit genislikli sayfa kapsayicilari daralsin */
  .wizard-page,
  .chat-page {
    max-width: 100%;
    padding-left: 10px;
    padding-right: 10px;
  }

  /* Onizleme/gorsel kapsayicilari tasmasin */
  #image-preview-wrap { max-width: 100%; }

  /* Uzun kelime/URL'ler basliklari tasirmasin */
  .settings-card h2,
  .wizard-step h2,
  .page h1,
  .page h2 {
    overflow-wrap: anywhere;
    word-break: break-word;
  }
}



/* === Moderasyon: kufur tespit rozeti === */
.admin-mod-flag{
  display:inline-flex;align-items:center;gap:6px;
  margin:4px 0 2px;padding:5px 11px;
  background:rgba(220,38,38,.12);
  color:#dc2626;border:1px solid rgba(220,38,38,.35);
  border-radius:8px;font-size:13px;font-weight:700;line-height:1;
}
.admin-mod-flag svg{flex:none}

/* === Sikayet detay: sikayet ID rozeti === */
.complaint-id{
  font-variant-numeric:tabular-nums;font-weight:600;
  color:var(--muted, #8b8b8b);letter-spacing:.3px;
}

/* ===================================================================
   Moderasyon / Onay Bekliyor gorunumleri (append)
   =================================================================== */

/* Profil kartinda "Onay Bekliyor" durum etiketi */
.status-tag.status-warning {
  background: rgba(230, 170, 40, 0.15);
  color: #e6aa28;
  border: 1px solid rgba(230, 170, 40, 0.35);
}

/* Admin moderasyon: baslik artik tiklanabilir link */
.admin-mod-title-link {
  color: inherit;
  text-decoration: none;
  transition: color .15s ease;
}
.admin-mod-title-link:hover {
  color: var(--accent, #e6aa28);
  text-decoration: underline;
}

/* Admin mobil topbar: onay bekleyen bildirim rozeti (her sayfada gorunur) */
.admin-topbar-alert {
  position: relative;
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  color: #e6aa28;
  background: rgba(230, 170, 40, 0.12);
  text-decoration: none;
}
.admin-topbar-alert:hover {
  background: rgba(230, 170, 40, 0.22);
}
.admin-topbar-alert-badge {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 9px;
  background: #e11d48;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 18px;
  text-align: center;
}

/* ============================================================================
   ŞİKAYET İPTAL (sahibi) — detay sayfası
   ============================================================================ */
.complaint-owner-actions {
  display: flex;
  justify-content: flex-end;
  margin: 4px 0 14px;
}
.btn-cancel-complaint {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  font-size: .85rem;
  font-weight: 600;
  color: #b91c1c;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 8px;
  cursor: pointer;
  transition: background .15s, border-color .15s, color .15s;
}
.btn-cancel-complaint:hover {
  background: #fee2e2;
  border-color: #f87171;
  color: #991b1b;
}
.btn-cancel-complaint:active { transform: translateY(1px); }

/* ============================================================================
   ADMIN — çoklu durum filtresi (checkbox chip'ler)
   ============================================================================ */
.status-multi {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 8px;
  padding: 6px 8px 8px;
  margin: 0;
}
.status-multi legend {
  font-size: .72rem;
  font-weight: 600;
  color: var(--muted, #6b7280);
  padding: 0 4px;
  text-transform: uppercase;
  letter-spacing: .03em;
}
.status-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 10px;
  font-size: .82rem;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 999px;
  background: #fff;
  cursor: pointer;
  user-select: none;
  transition: background .15s, border-color .15s, box-shadow .15s;
}
.status-chip input { margin: 0; cursor: pointer; }
.status-chip:hover { border-color: #93c5fd; }
.status-chip:has(input:checked) {
  background: #eff6ff;
  border-color: #3b82f6;
  box-shadow: 0 0 0 1px #3b82f6 inset;
  font-weight: 600;
}
@media (max-width: 640px) {
  .status-multi { width: 100%; }
  .status-chip { flex: 1 1 auto; justify-content: center; }
}

/* ============================================================================
 * ADMIN FİLTRE DROPDOWN'LARI (Durum / Kategori / Puan çoklu, Sıralama tekli)
 * Koyu tema uyumlu; buton + açılır panel + tik'li seçim listesi.
 * ========================================================================== */
.admin-filters { align-items: center; }

.filter-dd { position: relative; }

.filter-dd-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 38px;
  padding: 0 12px;
  background: #0f1a16;
  color: #e6f0ea;
  border: 1px solid var(--border, #22332b);
  border-radius: 8px;
  font-size: .86rem;
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
  transition: border-color .15s, background .15s;
}
.filter-dd-btn:hover { background: #14211b; border-color: #2c4034; }
.filter-dd-btn .icn { color: #9fb3a8; transition: transform .18s; }
.filter-dd.is-open .filter-dd-btn { border-color: #f5c447; background: #14211b; }
.filter-dd.is-open .filter-dd-btn .icn { transform: rotate(180deg); }

/* Seçili adet rozeti */
.filter-dd-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 9px;
  background: #f5c447;
  color: #1a1200;
  font-size: .72rem;
  font-weight: 700;
  line-height: 1;
}

/* Açılır panel */
.filter-dd-panel {
  position: absolute;
  z-index: 40;
  top: calc(100% + 6px);
  left: 0;
  min-width: 220px;
  padding: 6px;
  background: #15201c;
  border: 1px solid var(--border, #22332b);
  border-radius: 10px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .45);
  display: none;
  flex-direction: column;
  gap: 2px;
}
.filter-dd.is-open .filter-dd-panel { display: flex; }
.filter-dd-panel--scroll { max-height: 320px; overflow-y: auto; }

/* Panel içi seçim satırı */
.dd-opt {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 7px;
  color: #dbe8e0;
  font-size: .86rem;
  cursor: pointer;
  user-select: none;
  transition: background .12s;
}
.dd-opt:hover { background: #1c2a23; }
.dd-opt input { width: 16px; height: 16px; margin: 0; cursor: pointer; accent-color: #f5c447; flex: 0 0 auto; }
.dd-opt span { display: inline-flex; align-items: center; gap: 6px; }
.dd-opt:has(input:checked) { background: #1e2d25; color: #fff; }
.dd-opt .icn { color: #9fb3a8; }
.dd-stars { letter-spacing: 1px; color: #f5c447; }
.dd-stars .muted { color: #4c5d53; }

/* Arama kutusu esnek büyüsün */
.admin-filters .filter-search { flex: 1 1 220px; min-width: 180px; }

@media (max-width: 640px) {
  .filter-dd { flex: 1 1 auto; }
  .filter-dd-btn { width: 100%; justify-content: space-between; }
  .filter-dd-panel { left: 0; right: 0; min-width: 0; }
}


/* ============================================================================
 * FIX: global "form input{width:100%}" + "form label{display:block}" kurallari
 * admin filtre dropdown paneli icindeki checkbox/radio'lari bozuyordu
 * (checkbox dev kutu olup etiketi uzaga itiyordu). Panel icinde geri al.
 * ========================================================================== */
.filter-dd-panel label.dd-opt {
  display: flex;
  margin: 0;
  font-weight: 400;
}
.dd-opt input,
.dd-opt input[type="checkbox"],
.dd-opt input[type="radio"] {
  width: 16px;
  height: 16px;
  min-width: 16px;
  margin: 0;
  padding: 0;
  cursor: pointer;
  accent-color: #f5c447;
  flex: 0 0 auto;
  background: none;
  border: 0;
}
.dd-opt span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 1 1 auto;
}

/* ============================================================================
 * "Şikayetiniz çözüldü mü?" formundaki aksiyon satırı:
 * "Çözüldü Olarak Kapat" + "Şikayeti İptal Et" butonları yan yana.
 * ========================================================================== */
.rating-cta-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-top: 4px;
}
.rating-cta-actions .btn,
.rating-cta-actions .btn-cancel-complaint {
  margin: 0;
}
/* İptal butonu koyu temaya uyumlu: kırmızı çerçeveli, çözüldü butonuyla
   aynı yükseklik/hiza. (Global açık-tema stilini bu bağlamda override eder.) */
.rating-cta-actions .btn-cancel-complaint {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 18px;
  font-size: 13px;
  font-weight: 700;
  color: #fca5a5;
  background: rgba(239, 68, 68, .1);
  border: 1px solid rgba(239, 68, 68, .4);
  border-radius: 8px;
  cursor: pointer;
  transition: background .15s, border-color .15s, color .15s;
}
.rating-cta-actions .btn-cancel-complaint:hover {
  background: rgba(239, 68, 68, .2);
  border-color: rgba(239, 68, 68, .7);
  color: #fecaca;
}
@media (max-width: 480px) {
  .rating-cta-actions { flex-direction: column; align-items: stretch; }
  .rating-cta-actions .btn,
  .rating-cta-actions .btn-cancel-complaint { width: 100%; justify-content: center; }
}

/* ===========================================================================
   KARA LISTE (Admin Blacklist) — e-posta bazli sureli sikayet yasagi UI
   Mevcut admin degisken/renk sistemine uyumlu, tek dosyada. Mobile-first.
   =========================================================================== */
.admin-form-row { margin-bottom: 14px; }
.admin-form-row > label { display: block; margin-bottom: 6px; font-size: 14px; }
.admin-form-row input[type="email"],
.admin-form-row input[type="text"],
.admin-form-row input[type="number"],
.admin-form-row select {
  padding: 8px 10px;
  border: 1px solid var(--admin-border, #33384a);
  border-radius: 8px;
  background: var(--admin-input-bg, #1b1f2b);
  color: inherit;
  font-size: 14px;
}
.admin-form-row input[type="email"],
.admin-form-row input[type="text"] { width: 100%; max-width: 420px; }

.bl-presets { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.bl-presets .btn-mini.is-selected {
  outline: 2px solid var(--admin-accent, #f5c447);
  outline-offset: 1px;
}
.bl-manual { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }

.admin-form-actions { margin-top: 16px; }

/* Durum rozetleri (aktif ban vurgulu, pasif solgun) */
.admin-badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  background: rgba(255,255,255,.08);
  color: var(--admin-muted-fg, #9aa0ad);
  white-space: nowrap;
}
.admin-badge-warn {
  background: rgba(245,196,71,.15);
  color: #f5c447;
}

/* ============================================================================
   MODERASYON — Orijinal (ham) + Düzenlenebilir Maskeli (yayın) blokları
   Yeni akış: şikayet create'de AI ile maskelenir; admin moderasyonda hem
   orijinali görür hem yayın metnini düzeltip yayınlar.
   ============================================================================ */
.admin-mod-block-label {
  display: flex; align-items: center; gap: 6px;
  font-size: .78rem; font-weight: 600; letter-spacing: .02em;
  text-transform: uppercase; color: var(--muted, #9aa0a6);
  margin: 14px 0 6px;
}
.admin-mod-original {
  background: rgba(255,255,255,.03);
  border: 1px solid var(--border, rgba(255,255,255,.08));
  border-left: 3px solid var(--muted, #9aa0a6);
  border-radius: 10px;
  padding: 12px 14px;
  margin-bottom: 12px;
}
.admin-mod-original .admin-mod-block-label { margin-top: 0; }
.admin-mod-orig-user { font-size: .85rem; color: var(--muted, #9aa0a6); margin: 0 0 6px; }
.admin-mod-orig-title { margin: 0 0 6px; color: var(--text, #e8eaed); }
.admin-mod-original .admin-mod-content {
  white-space: pre-wrap; word-break: break-word; margin: 0;
  color: var(--text, #e8eaed); font-size: .92rem; line-height: 1.55;
}

/* Düzenlenebilir yayın formu */
.admin-mod-editform {
  background: rgba(245,196,71,.05);
  border: 1px solid rgba(245,196,71,.25);
  border-left: 3px solid #f5c447;
  border-radius: 10px;
  padding: 12px 14px;
}
.admin-mod-editform .admin-mod-block-label { color: #f5c447; margin-top: 0; }
.admin-mod-field-label {
  display: block; font-size: .78rem; font-weight: 600;
  color: var(--muted, #9aa0a6); margin: 10px 0 4px;
}
.admin-mod-input,
.admin-mod-textarea {
  width: 100%; box-sizing: border-box;
  background: var(--bg, #16181c);
  border: 1px solid var(--border, rgba(255,255,255,.12));
  border-radius: 8px;
  color: var(--text, #e8eaed);
  font: inherit; font-size: .92rem;
  padding: 9px 11px;
}
.admin-mod-textarea { resize: vertical; line-height: 1.55; min-height: 120px; }
.admin-mod-input:focus,
.admin-mod-textarea:focus {
  outline: none;
  border-color: #f5c447;
  box-shadow: 0 0 0 2px rgba(245,196,71,.2);
}
.admin-mod-editform .admin-mod-actions {
  display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px;
}

/* Mobil: bloklar tam genişlik, aksiyonlar sarmalanır */
@media (max-width: 640px) {
  .admin-mod-original,
  .admin-mod-editform { padding: 10px 12px; }
  .admin-mod-editform .admin-mod-actions .btn { flex: 1 1 auto; }
}

/* ============================================================================
   MODERASYON DETAY — Orijinal + Maskelenmiş (yayın) blokları + inline düzenle
   complaint_detail.ejs: pending şikayette admin ham ve maskeli metni alt alta
   görür; maskelenmişin altındaki "Düzenle" butonu ile inline düzenleyip kaydeder.
   ============================================================================ */
.mod-detail-block {
  border-radius: 10px;
  padding: 14px 16px;
  margin-bottom: 14px;
}
.mod-detail-label {
  display: flex; align-items: center; gap: 6px;
  font-size: .78rem; font-weight: 600; letter-spacing: .02em;
  text-transform: uppercase; color: var(--muted, #9aa0a6);
  margin-bottom: 8px;
}
.mod-detail-user { font-size: .85rem; color: var(--muted, #9aa0a6); margin: 0 0 6px; }
.mod-detail-title { margin: 0 0 8px; color: var(--text, #e8eaed); }
.mod-detail-block .admin-complaint-body { margin: 0; }

/* Orijinal (ham) — nötr çerçeve */
.mod-detail-original {
  background: rgba(255,255,255,.03);
  border: 1px solid var(--border, rgba(255,255,255,.08));
  border-left: 3px solid var(--muted, #9aa0a6);
}

/* Maskelenmiş (yayın) — vurgulu çerçeve */
.mod-detail-masked {
  background: rgba(245,196,71,.05);
  border: 1px solid rgba(245,196,71,.25);
  border-left: 3px solid #f5c447;
}
.mod-detail-masked .mod-detail-label { color: #f5c447; }
.mod-detail-edit-btn { margin-top: 12px; }

/* Düzenleme formu */
.mod-detail-editform {
  background: rgba(245,196,71,.05);
  border: 1px solid rgba(245,196,71,.35);
  border-left: 3px solid #f5c447;
}
.mod-detail-editform .mod-detail-label { color: #f5c447; }
.mod-detail-field-label {
  display: block; font-size: .78rem; font-weight: 600;
  color: var(--muted, #9aa0a6); margin: 10px 0 4px;
}
.mod-detail-input,
.mod-detail-textarea {
  width: 100%; box-sizing: border-box;
  background: var(--bg, #16181c);
  border: 1px solid var(--border, rgba(255,255,255,.12));
  border-radius: 8px;
  color: var(--text, #e8eaed);
  font: inherit; font-size: .92rem;
  padding: 9px 11px;
}
.mod-detail-textarea { resize: vertical; line-height: 1.55; min-height: 120px; }
.mod-detail-input:focus,
.mod-detail-textarea:focus {
  outline: none; border-color: #f5c447;
  box-shadow: 0 0 0 2px rgba(245,196,71,.2);
}
.mod-detail-editform-actions {
  display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px;
}

@media (max-width: 640px) {
  .mod-detail-block { padding: 12px 13px; }
  .mod-detail-editform-actions .btn { flex: 1 1 auto; }
}