:root {
  --paper: #F6F4EE;
  --surface: #FFFFFF;
  --ink: #16231D;
  --ink-2: #47554E;
  --ink-3: #6A766F;
  --line: #DEDBD0;
  --line-2: #ECE9DF;
  --forest: #1F4D3A;
  --forest-2: #2F7A5B;
  --forest-wash: #E4EEE8;
  --clay: #B3492E;
  --clay-wash: #F8E9E3;
  --amber: #8A5A00;
  --amber-wash: #F8EFD8;
  --r: 12px;
  --sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  --serif: ui-serif, Georgia, Cambria, "Times New Roman", serif;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 400 15px/1.5 var(--sans); }
a { color: var(--forest); }
h1, h2, h3 { margin: 0; line-height: 1.2; }
h1 { font: 600 26px/1.2 var(--serif); letter-spacing: -.01em; }
h2 { font-size: 16px; font-weight: 650; }
p { margin: 0; }
:focus-visible { outline: 2px solid var(--forest-2); outline-offset: 2px; }
.muted { color: var(--ink-2); }
.small { font-size: 13px; }
.nowrap { white-space: nowrap; }
.break { overflow-wrap: anywhere; }

/* Panel iskeleti */
.shell { display: grid; grid-template-columns: 228px minmax(0, 1fr); min-height: 100vh; }
.side { background: var(--forest); color: #E9F1EC; padding: 22px 14px; display: flex; flex-direction: column; gap: 22px; position: sticky; top: 0; height: 100vh; overflow-y: auto; }
.logo { font: 600 20px/1 var(--serif); color: #fff; text-decoration: none; padding: 2px 10px; }
.side nav { display: flex; flex-direction: column; gap: 2px; }
.side nav a { color: #D5E3DB; text-decoration: none; padding: 9px 10px; border-radius: 8px; font-weight: 500; }
.side nav a:hover { background: rgba(255,255,255,.08); color: #fff; }
.side nav a[aria-current="page"] { background: rgba(255,255,255,.15); color: #fff; }
.side :focus-visible { outline-color: #fff; }
.side-foot { margin-top: auto; font-size: 13px; padding: 0 10px; color: #C6D8CE; display: flex; flex-direction: column; gap: 8px; }
.side-foot button { background: none; border: 0; padding: 0; font: inherit; color: #fff; text-decoration: underline; cursor: pointer; text-align: left; }
.main { padding: 30px 36px 60px; min-width: 0; max-width: 1180px; }
.head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 22px; }
.head p { margin-top: 4px; color: var(--ink-2); }
.actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }

/* Parçalar */
.card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 20px; min-width: 0; }
.card + .card, .grid + .card { margin-top: 16px; }
.card h2 { margin-bottom: 12px; }
.stack-gap { margin-top: 16px; }
.grid { display: grid; gap: 16px; }
.grid > .card { margin-top: 0; }
.g2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.g3-2 { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 38px; padding: 8px 14px; border-radius: 9px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); font: 550 14px/1.2 var(--sans); text-decoration: none; cursor: pointer; white-space: nowrap; }
.btn:hover { border-color: var(--ink-3); }
.btn.primary { background: var(--forest); border-color: var(--forest); color: #fff; }
.btn.primary:hover { background: #173C2D; }
.btn.danger { color: var(--clay); }
.btn.danger:hover { border-color: var(--clay); }
.btn.link { border: 0; background: none; padding: 4px 0; min-height: 0; color: var(--forest); text-decoration: underline; }
.btn[disabled] { opacity: .5; cursor: not-allowed; }
.inline { display: inline; margin: 0; }
label { display: block; font-weight: 600; font-size: 14px; margin-bottom: 5px; }
input[type=text], input[type=email], input[type=password], input[type=url], input[type=tel], input[type=date], input[type=search], input[type=number], select, textarea { width: 100%; min-height: 40px; padding: 8px 11px; font: 400 15px/1.4 var(--sans); color: var(--ink); background: var(--surface); border: 1px solid var(--line); border-radius: 9px; }
textarea { resize: vertical; min-height: 90px; }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--forest-2); outline-offset: 0; border-color: transparent; }
.field { margin-bottom: 16px; }
.hint { font-size: 13px; color: var(--ink-2); margin-top: 4px; font-weight: 400; }
.error { font-size: 13px; color: var(--clay); margin-top: 4px; }
.flash { padding: 11px 14px; border-radius: 9px; background: var(--forest-wash); color: #15392A; margin-bottom: 16px; }
.flash.warn { background: var(--amber-wash); color: #5D3D00; }
.flash.bad { background: var(--clay-wash); color: #7E2F1B; }
.pill { display: inline-flex; align-items: center; gap: 5px; padding: 2px 9px; border-radius: 99px; font-size: 12.5px; font-weight: 600; background: var(--line-2); color: var(--ink-2); white-space: nowrap; }
.pill.new, .pill.live { background: var(--forest-wash); color: #15392A; }
.pill.in_review { background: var(--amber-wash); color: #5D3D00; }
.pill.locked { background: var(--clay-wash); color: #7E2F1B; }
.score { font-weight: 650; white-space: nowrap; }
.score svg { width: 14px; height: 14px; fill: var(--ink-3); vertical-align: -2px; margin-left: 2px; }
.score.low { color: var(--clay); }
.score.low svg { fill: var(--clay); }
.tbl { width: 100%; border-collapse: collapse; }
.tbl th { text-align: left; font-size: 12.5px; font-weight: 600; color: var(--ink-2); padding: 0 10px 9px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.tbl td { padding: 11px 10px; border-bottom: 1px solid var(--line-2); vertical-align: top; }
.tbl tr:last-child td { border-bottom: 0; }
.tbl .num { text-align: right; font-variant-numeric: tabular-nums; }
.tbl tbody tr.row-link:hover { background: #FBFAF6; cursor: pointer; }
.tbl-wrap { overflow-x: auto; margin: 0 -10px; }
.clip { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
.filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; align-items: center; }
.filters select, .filters input { width: auto; min-width: 140px; }
.filters input[type=search] { flex: 1; min-width: 200px; }
.seg { display: inline-flex; background: var(--line-2); border-radius: 9px; padding: 3px; }
.seg a { padding: 6px 12px; border-radius: 7px; text-decoration: none; color: var(--ink-2); font-weight: 550; font-size: 14px; }
.seg a[aria-current="true"] { background: var(--surface); color: var(--ink); box-shadow: 0 1px 2px rgba(22,35,29,.12); }
.empty { text-align: center; padding: 42px 18px; color: var(--ink-2); }
.empty h2 { color: var(--ink); margin-bottom: 6px; }
.empty .btn { margin-top: 14px; }
.pager { margin-top: 14px; display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.type-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-bottom: 18px; }
.type-opt { position: relative; display: block; border: 1.5px solid var(--line); border-radius: 11px; padding: 12px 14px; cursor: pointer; margin: 0; background: var(--surface); }
.type-opt input { position: absolute; opacity: 0; }
.type-opt b { display: block; font-size: 14px; margin-bottom: 2px; }
.type-opt span { font-size: 13px; color: var(--ink-2); font-weight: 400; }
.type-opt:has(input:checked) { border-color: var(--forest); background: var(--forest-wash); }
.type-opt:has(input:focus-visible) { outline: 2px solid var(--forest-2); outline-offset: 2px; }
.editor { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 18px; align-items: start; }
.preview-col { position: sticky; top: 20px; min-width: 0; }
.phone { border: 8px solid var(--ink); border-radius: 30px; background: #F7F5EF; padding: 22px 18px; min-height: 480px; overflow: hidden; }
.phone .ph-brand { font-size: 13px; font-weight: 600; color: var(--ink-2); margin-bottom: 22px; }
.phone h3 { font: 600 22px/1.2 var(--serif); margin-bottom: 8px; overflow-wrap: anywhere; }
.phone .ph-body { color: var(--ink-2); white-space: pre-line; font-size: 14px; margin-bottom: 16px; overflow-wrap: anywhere; }
.ph-stars { display: flex; gap: 4px; margin-bottom: 14px; }
.ph-stars i { flex: 1; aspect-ratio: 1; background: #fff; border: 1.5px solid var(--line); border-radius: 9px; display: flex; align-items: center; justify-content: center; }
.ph-stars svg { width: 56%; fill: #8A938E; }
.ph-label { font-size: 13px; font-weight: 600; margin-bottom: 4px; }
.ph-input { height: 36px; background: #fff; border: 1.5px solid var(--line); border-radius: 9px; margin-bottom: 11px; }
.ph-input.tall { height: 72px; }
.ph-btn { height: 42px; border-radius: 10px; color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 600; font-size: 14px; padding: 0 8px; text-align: center; }
.qr-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
.qr-box { background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 18px; text-align: center; }
.qr-box .qr svg { width: 100%; max-width: 220px; height: auto; display: block; margin: 0 auto 14px; }
.qr-box .actions { justify-content: center; }
.detail-grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 16px; align-items: start; }
.quote { font-size: 17px; line-height: 1.5; white-space: pre-line; overflow-wrap: anywhere; }
.meta { display: grid; grid-template-columns: auto 1fr; gap: 6px 14px; font-size: 14px; }
.meta dt { color: var(--ink-2); }
.meta dd { margin: 0; overflow-wrap: anywhere; }
.note { padding: 12px 0; border-top: 1px solid var(--line-2); }
.note:first-of-type { border-top: 0; padding-top: 0; }
.note .who { font-size: 13px; color: var(--ink-2); margin-bottom: 3px; }
.note p { white-space: pre-line; overflow-wrap: anywhere; }
.plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 14px; }
.plan { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 18px; }
.plan.current { border: 2px solid var(--forest); }
.plan b { font: 600 19px/1.2 var(--serif); display: block; margin-bottom: 4px; }
.meter { height: 8px; background: var(--line-2); border-radius: 4px; overflow: hidden; margin: 8px 0 4px; }
.meter i { display: block; height: 100%; background: var(--forest-2); border-radius: 4px; }

/* Grafik */
.chart { position: relative; }
.chart svg { display: block; width: 100%; height: auto; overflow: visible; }
.chart .grid-line { stroke: var(--line-2); stroke-width: 1; }
.chart .axis-text { font: 400 11.5px var(--sans); fill: var(--ink-2); }
.chart .series { fill: none; stroke: var(--forest-2); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.chart .dot { fill: var(--forest-2); stroke: var(--surface); stroke-width: 2; }
.chart .bar { fill: var(--forest-2); }
.chart .hit { fill: transparent; }
.chart .hit:hover + .bar, .chart .hit:focus + .bar { fill: var(--forest); }
.chart .cross { stroke: var(--ink-3); stroke-width: 1; opacity: 0; pointer-events: none; }
.chart .marker { fill: var(--forest-2); stroke: var(--surface); stroke-width: 2; opacity: 0; pointer-events: none; }
.tip { position: absolute; top: 0; left: 0; padding: 6px 10px; background: var(--ink); color: #fff; border-radius: 7px; font-size: 12.5px; line-height: 1.35; pointer-events: none; opacity: 0; white-space: nowrap; z-index: 2; transition: opacity .08s; }
.tip b { display: block; font-size: 14px; }
.dist { display: grid; grid-template-columns: 22px minmax(0,1fr) 62px; gap: 8px 10px; align-items: center; font-size: 13.5px; }
.dist .track { height: 14px; background: var(--line-2); border-radius: 0 4px 4px 0; }
.dist .fill { height: 100%; min-width: 2px; background: var(--forest-2); border-radius: 0 4px 4px 0; }
.dist .val { text-align: right; color: var(--ink-2); font-variant-numeric: tabular-nums; }
details.data-table { margin-top: 12px; font-size: 13.5px; }
details.data-table summary { cursor: pointer; color: var(--forest); }
details.data-table .tbl-wrap { max-height: 260px; overflow-y: auto; margin-top: 8px; }

.more { text-align: right; margin-top: 6px; font-size: 13.5px; }
.more summary { cursor: pointer; color: var(--forest); display: inline-block; list-style: none; text-decoration: underline; padding: 2px 0; }
.more summary::-webkit-details-marker { display: none; }
.more .actions { justify-content: flex-end; margin-top: 6px; }

/* Giriş ekranları */
.auth { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 28px 18px; }
.auth-box { width: 100%; max-width: 410px; }
.auth-box .logo { color: var(--forest); display: block; text-align: center; font-size: 24px; margin-bottom: 22px; }
.auth-box h1 { font-size: 23px; margin-bottom: 18px; }
.auth-foot { text-align: center; margin-top: 16px; font-size: 14px; }
.check { display: flex; gap: 8px; align-items: flex-start; font-weight: 400; }
.check input { margin-top: 4px; }

@media (max-width: 980px) {
  .editor, .detail-grid, .g3-2 { grid-template-columns: minmax(0, 1fr); }
  .preview-col { position: static; max-width: 340px; }
}
@media (max-width: 780px) {
  .shell { grid-template-columns: minmax(0, 1fr); }
  .side { position: static; height: auto; padding: 14px; gap: 10px; }
  .side nav { flex-direction: row; overflow-x: auto; scrollbar-width: none; }
  .side nav::-webkit-scrollbar { display: none; }
  .chart.line .axis-text { font-size: 18px; }
  .chart.bars .axis-text { font-size: 30px; }
  .side nav a { white-space: nowrap; }
  .side-foot { flex-direction: row; justify-content: space-between; margin: 0; }
  .main { padding: 20px 16px 48px; }
  .g2, .plans, .type-grid { grid-template-columns: minmax(0, 1fr); }
  /* Dar ekranda tablo satırları kart gibi alt alta dizilir. */
  .tbl.stack thead { display: none; }
  .tbl.stack tr { display: block; padding: 12px 10px; border-bottom: 1px solid var(--line-2); }
  .tbl.stack tr:last-child { border-bottom: 0; }
  .tbl.stack td { display: block; padding: 3px 0; border: 0; }
  .tbl.stack td select { margin-top: 4px; }
  .tbl.stack td.num { text-align: left; }
  .tbl.stack td[data-label] { display: inline-block; margin-right: 18px; }
  .tbl.stack td[data-label]::before { content: attr(data-label) ": "; color: var(--ink-2); }
  .tbl.stack .more { text-align: left; }
  .tbl.stack .more .actions { justify-content: flex-start; }
  .tbl.stack td .actions { justify-content: flex-start !important; margin-top: 6px; }
  .tbl.stack tr.edit-row { padding: 14px 10px; background: #FBFAF6; }
  .tbl.stack tr.edit-row td { background: none; padding: 0; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }
@media print {
  .side, .no-print { display: none !important; }
  .shell { display: block; }
}

/* Form listesi ve önizleme */
.pill svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.pill.paused { background: var(--amber-wash); color: #5D3D00; }
.preview-dialog { width: min(430px, calc(100vw - 24px)); height: min(820px, calc(100dvh - 24px)); padding: 0; border: 0; border-radius: 16px; background: var(--surface); overflow: hidden; color: var(--ink); }
.preview-dialog[open] { display: flex; flex-direction: column; }
.preview-dialog::backdrop { background: rgba(22,35,29,.55); }
.preview-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px 10px 16px; border-bottom: 1px solid var(--line); }
.preview-dialog iframe { flex: 1; width: 100%; min-height: 0; border: 0; background: #F7F5EF; }

/* Ekip */
.g-phone { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 12px; }
.edit-row td { background: #FBFAF6; padding: 16px 14px; }
.edit-grid { gap: 0 16px; margin-bottom: 4px; }

.lang-switch select { width: auto; font-size: 13px; padding: 4px 8px; }
.auth-box .lang-switch { text-align: center; margin-top: 14px; }

/* Form tasarımı: çerçeve rengi ve önizleme */
label.swatch, .swatch { position: relative; display: inline-flex; align-items: center; justify-content: center; margin: 0; cursor: pointer; }
.swatches { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 5px; }
.swatch input { position: absolute; opacity: 0; }
.swatch i { display: block; width: 32px; height: 32px; border-radius: 50%; background: var(--swatch); border: 3px solid #fff; box-shadow: 0 0 0 1px var(--line); }
.swatch input:checked + i { box-shadow: 0 0 0 2.5px var(--ink); }
.swatch input:focus-visible + i, .swatch input:focus-visible + span { outline: 2px solid var(--forest-2); outline-offset: 2px; }
.swatch.none span { padding: 5px 12px; border: 1px solid var(--line); border-radius: 99px; font-size: 13px; font-weight: 500; }
.swatch.none input:checked + span { border-color: var(--ink); box-shadow: 0 0 0 1.5px var(--ink); }
span.label { display: block; font-weight: 600; font-size: 14px; }
.lang-block { border: 1px solid var(--line); border-radius: 10px; padding: 10px 14px; margin-bottom: 16px; }
.lang-block summary { cursor: pointer; font-weight: 600; font-size: 14px; }
.lang-block[open] summary { margin-bottom: 12px; }
.lang-block .field:last-child { margin-bottom: 4px; }
.color-input { display: block; width: 72px; height: 44px; padding: 3px; border: 1px solid var(--line); border-radius: 9px; background: #fff; cursor: pointer; }
.phone .ph-brand { display: flex; justify-content: flex-end; text-align: right; }
.phone .ph-brand img { width: 46px; height: 46px; border-radius: 50%; object-fit: cover; border: 1px solid var(--line); background: #fff; }
.ph-framed { background: #fff; border: 3px solid var(--frame); border-radius: 16px; padding: 14px; }

/* Sabit üst uyarılar: ödeme gecikmesi ve destek için müşteri hesabında olma */
.top-bar { position: sticky; top: 0; z-index: 20; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 16px; padding: 10px 18px; font-size: 14px; font-weight: 600; text-align: center; }
.top-bar.overdue { background: #A6281F; color: #fff; }
.top-bar.overdue a { color: #fff; }
.top-bar.impersonate { background: #F8DFA0; color: #4A3200; }
.top-bar.pay { background: var(--forest); color: #fff; position: static; }
.top-bar.pay .btn { min-height: 34px; padding: 5px 14px; }
input.readonly { background: var(--paper, #F4F2EC); color: var(--ink-2); cursor: default; }
.notice-bad { border-color: var(--clay); background: var(--clay-wash); }
.dl { display: grid; grid-template-columns: minmax(120px, 200px) minmax(0, 1fr); gap: 6px 16px; margin: 0; }
.dl dt { color: var(--ink-2); font-size: 14px; }
.dl dd { margin: 0; overflow-wrap: anywhere; white-space: pre-line; }
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 12px; margin-bottom: 16px; }
.stats div { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 14px 16px; }
.stats b { display: block; font: 600 26px/1.1 var(--serif); }
.stats span { font-size: 13px; color: var(--ink-2); }
.message-body { white-space: pre-line; overflow-wrap: anywhere; line-height: 1.6; }

/* Görev ekranı: görevli QR'ı telefonla okutunca açılır */
.task-page { max-width: 560px; margin: 0 auto; padding: 22px 16px 40px; }
.task-head { margin-bottom: 16px; }
.task-head h1 { font-size: 26px; margin: 6px 0 2px; }
.task-badge { display: inline-flex; gap: 6px; align-items: center; margin: 0; font-size: 12.5px; font-weight: 700; color: #A65A12; background: #FFF4E8; border-radius: 99px; padding: 3px 10px; }
.task-section { font-size: 17px; margin: 18px 0 10px; display: flex; align-items: center; gap: 8px; }
.task-count { font-size: 13px; background: var(--forest); color: #fff; border-radius: 99px; padding: 1px 9px; }
.task-item p { margin: 0 0 8px; }
.task-item + .task-item { margin-top: 12px; }
.task-rating { font-size: 20px; }
.task-note { background: var(--bg, #F6F4EE); border-radius: 8px; padding: 6px 10px; }
.task-form { display: grid; gap: 6px; margin-top: 10px; }
.task-form textarea { width: 100%; }
.task-done { min-height: 48px; font-size: 16px; }
.task-item.done { padding: 12px 16px; }
.task-links { margin-top: 22px; color: var(--ink-2); }

/* Form düzenleyicide yönetim hizmetleri bölümü */
.task-settings { border: 1.5px solid #F2C99A; background: #FFFBF6; border-radius: 12px; padding: 16px 16px 4px; margin: 6px 0 18px; }
.task-settings h2 { margin-bottom: 6px; }
.task-settings .star { color: #D9822B; }
.type-opt.premium { border-color: #F2C99A; }
.type-opt.premium .star { color: #D9822B; }
.type-opt.premium:has(input:checked) { border-color: #D9822B; background: #FFFBF6; }

/* Kiralık ev takibi: arıza fotoğrafları ve ustaya gönderme */
.photo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; margin-top: 12px; }
.photo-grid img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 9px; display: block; background: var(--line-2); }
.repair-card { border: 1.5px solid #F2C99A; background: #FFFBF6; }
.repair-card .star { color: #D9822B; }
.repair-job { padding: 0 0 12px; }
.repair-job + .repair-job { border-top: 1px solid var(--line); padding-top: 12px; }
.repair-job + .flash, .repair-job + .repair-send { margin-top: 4px; border-top: 1px solid var(--line); padding-top: 14px; }
.repair-job p { margin: 0 0 6px; }
.repair-job .who { overflow-wrap: anywhere; }
.repair-send { margin-top: 4px; }
.repair-send .small { margin-bottom: 12px; }

/* Özel form: soru kurucu ve önizleme */
.q-builder { margin: 4px 0 18px; }
.q-builder h2 { display: flex; align-items: baseline; gap: 8px; }
.q-item { border: 1.5px solid var(--line); border-radius: 11px; padding: 12px; margin-bottom: 10px; background: var(--surface); }
.q-item > input[type=text] { width: 100%; }
.q-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 8px; }
.q-head select { width: auto; }
.q-required { display: inline-flex; align-items: center; gap: 6px; margin: 0; font-weight: 500; font-size: 14px; }
.q-tools { margin-left: auto; display: inline-flex; gap: 10px; }
.q-tools .btn.link { text-decoration: none; font-size: 15px; }
.q-tools .btn.link.danger { color: var(--clay); font-size: 13.5px; text-decoration: underline; }
.q-options { margin-top: 8px; display: grid; gap: 6px; justify-items: start; }
.q-option { display: flex; align-items: center; gap: 8px; width: 100%; }
.q-option input { flex: 1; }
.q-mark { width: 14px; height: 14px; flex: none; border: 1.5px solid var(--ink-3); border-radius: 50%; }
.q-mark.multi { border-radius: 3px; }
.q-add-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-top: 6px; padding: 12px 14px; border: 1.5px dashed var(--forest-2); border-radius: 11px; background: var(--forest-wash); }
.q-add-bar > b { color: var(--forest); font-size: 14.5px; }
.q-add-types { display: flex; flex-wrap: wrap; gap: 8px; }
.q-add-types .btn { background: var(--surface); }
.ph-choice { display: flex; align-items: center; gap: 8px; font-size: 13px; background: #fff; border: 1.5px solid var(--line); border-radius: 9px; padding: 7px 10px; margin-bottom: 6px; overflow-wrap: anywhere; }
.ph-choice i { width: 12px; height: 12px; flex: none; border: 1.5px solid var(--ink-3); border-radius: 50%; }
.ph-choice i.multi { border-radius: 3px; }
.answers { margin: 0; }
.answers dt { font-size: 13px; font-weight: 600; color: var(--ink-2); margin: 0 0 3px; }
.answers dd { margin: 0 0 14px; font-size: 16px; white-space: pre-line; overflow-wrap: anywhere; }
.answers dd ul { margin: 0; padding-left: 18px; white-space: normal; }
.share-row { display: flex; gap: 8px; margin-top: 10px; }
.share-row input { flex: 1; min-width: 0; font-family: var(--mono, ui-monospace, monospace); font-size: 13.5px; }
.q-translate { border-top: 1px solid var(--line); padding-top: 10px; margin: 6px 0 14px; }
.q-tr-item { display: grid; gap: 6px; margin-bottom: 14px; }
.q-tr-item > label { font-size: 13.5px; margin: 0; }
.q-summary + .q-summary { border-top: 1px solid var(--line); margin-top: 16px; padding-top: 16px; }
.q-summary h3 { font-size: 15.5px; margin: 0 0 2px; overflow-wrap: anywhere; }
.q-summary > .small { margin-bottom: 10px; }
.q-bars { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.q-bars li { display: grid; grid-template-columns: 1fr auto; gap: 0 12px; align-items: baseline; }
.q-bars .meter { grid-column: 1 / -1; margin: 4px 0 0; }
.q-bar-label { overflow-wrap: anywhere; }
.q-bar-value { font-variant-numeric: tabular-nums; font-weight: 600; }
.q-bar-value small { color: var(--ink-2); font-weight: 400; }
.q-text { display: flex; justify-content: space-between; gap: 12px; padding: 9px 12px; margin-bottom: 6px; border-radius: 9px; background: var(--line-2); color: inherit; text-decoration: none; overflow-wrap: anywhere; }
.q-text:hover { background: var(--forest-wash); }
.q-text small { color: var(--ink-2); white-space: nowrap; }
.phone-input { display: grid; grid-template-columns: 8.5em minmax(0, 1fr); gap: 8px; }
@media (max-width: 360px) { .phone-input { grid-template-columns: minmax(0, 1fr); } }
.perms { display: flex; flex-direction: column; gap: 2px; margin-top: 8px; }
.perms .check { font-size: 13px; }
.prefs { display: flex; flex-direction: column; gap: 12px; margin-bottom: 16px; }
.pref-sub { margin: -4px 0 0 26px; }
.device-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 8px 0; border-top: 1px solid var(--line); }
.device-row:first-of-type { border-top: 0; }
/* Revizyonlar 4: gruplu menü */
.side-brand { display: flex; flex-direction: column; gap: 10px; }
.side-company { display: flex; align-items: center; gap: 9px; padding: 0 10px; font-size: 13.5px; color: #D5E3DB; }
.side-company img { width: 30px; height: 30px; border-radius: 50%; object-fit: cover; background: #fff; flex: none; }
.nav-group { display: flex; flex-direction: column; gap: 1px; margin-bottom: 8px; }
.nav-heading { font-size: 11.5px; letter-spacing: .06em; text-transform: uppercase; color: #9FBCAD; padding: 6px 10px 3px; }
.side nav a.sub { padding: 7px 10px 7px 18px; font-size: 14.5px; }
.side nav .star, .side .star { color: var(--gold, #E9A62B); }
.side-icon { display: flex; align-items: center; gap: 9px; color: #fff; text-decoration: none; font-size: 14px; background: none; border: 0; padding: 7px 10px; border-radius: 8px; cursor: pointer; font: inherit; width: 100%; }
.side-foot .side-icon { text-decoration: none; }
.side-icon:hover, .side-icon[aria-current="page"] { background: rgba(255,255,255,.12); }
.side-icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.side-foot { padding: 0; }
@media (max-width: 860px) {
  .side nav { flex-direction: column; overflow: visible; }
  .side nav .nav-group { flex-direction: row; flex-wrap: wrap; gap: 4px; }
  .side nav .nav-heading { width: 100%; }
  .side-foot { flex-wrap: wrap; }
  .side-icon { width: auto; }
}
/* Huni, durum kutuları, grafik geçişi, tarih süzgeci */
.summary { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 16px; margin-bottom: 16px; align-items: stretch; }
.summary > .card { margin: 0; }
.satisfaction { display: flex; flex-direction: column; align-items: center; text-align: center; }
.satisfaction h2 { margin-bottom: 10px; align-self: stretch; text-align: left; }
.ring { position: relative; width: 132px; height: 132px; }
.ring svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.ring circle { fill: none; stroke-width: 9; }
.ring-track { stroke: var(--line-2, #ECE9E0); }
.ring-fill { stroke: var(--ring, var(--forest)); stroke-linecap: round; transition: stroke-dasharray .4s ease; }
.satisfaction.low { --ring: #B3492E; }
.satisfaction.mid { --ring: #C98A12; }
.satisfaction.high { --ring: #1F4D3A; }
.ring-value { position: absolute; inset: 0; display: flex; align-items: baseline; justify-content: center; padding-top: 46px; gap: 3px; }
.ring-value b { font: 600 32px/1 var(--serif); color: var(--ring, var(--ink)); }
.ring-value small { color: var(--ink-2); font-size: 13px; }
.status-cards h2 { margin-bottom: 10px; }
.status-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.status-card { display: flex; align-items: baseline; gap: 8px; padding: 8px 12px; border-radius: 8px; border: 1px solid var(--line); text-decoration: none; color: var(--ink); background: var(--surface); }
a.status-card:hover { border-color: var(--forest); }
.status-card b { font: 600 20px/1.1 var(--serif); }
.status-card span { font-size: 13.5px; color: var(--ink-2); }
.status-card.new { border-left: 3px solid #B3492E; }
.status-card.in_review { border-left: 3px solid #C98A12; }
.status-card.resolved { border-left: 3px solid #1F4D3A; }
.funnel { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); }
.funnel-step { display: flex; align-items: baseline; gap: 5px; flex-wrap: wrap; }
.funnel-step b { font: 600 17px/1.1 var(--serif); }
.funnel-step span { color: var(--ink-2); font-size: 13.5px; }
.funnel-step small { color: var(--ink-2); font-size: 12px; }
.funnel-step small::before { content: "· "; }
.funnel-arrow { width: 8px; height: 8px; flex: none; border-top: 2px solid var(--forest); border-right: 2px solid var(--forest); transform: rotate(45deg); }
.metric-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.metric-head .seg button { border: 0; background: none; font: inherit; font-size: 13.5px; padding: 6px 10px; border-radius: 7px; cursor: pointer; color: var(--ink-2); }
.metric-head .seg button[aria-selected="true"] { background: var(--forest); color: #fff; }
.period-filter { margin: 0; flex-wrap: wrap; align-items: center; }
.period-filter select { width: auto; }
.period-custom { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.period-custom[hidden] { display: none; }
.period-custom input { width: auto; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
@media (max-width: 640px) {
  .summary { grid-template-columns: minmax(0, 1fr); }
  .status-row { grid-template-columns: minmax(0, 1fr); }
}
.help h2 { margin: 18px 0 8px; } .help h2:first-child { margin-top: 0; } .help ul { margin: 0 0 6px; padding-left: 20px; } .help li { margin-bottom: 7px; line-height: 1.5; }
/* Form düzenleyici bölümleri (madde 9, 10) */
.editor-steps { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.editor-steps > .card + .card { margin-top: 0; }
.step h2 { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.step-no { width: 26px; height: 26px; border-radius: 50%; background: var(--forest); color: #fff; font: 600 14px/26px var(--sans); text-align: center; flex: none; }
.step.task-settings { margin: 0; padding: 18px; }
.type-opt.locked { opacity: .6; cursor: not-allowed; background: var(--paper, #F6F4EE); }
.type-badge { display: inline-block; margin-top: 6px; font-style: normal; font-size: 11.5px; font-weight: 600; color: #8A5A00; background: #F8EFD8; border-radius: 6px; padding: 1px 7px; }
.lang-tabs { display: flex; flex-wrap: wrap; gap: 4px; border-bottom: 1px solid var(--line); margin: 6px 0 16px; }
.lang-tabs button { border: 1px solid transparent; border-bottom: 0; background: none; font: inherit; font-size: 14px; padding: 8px 12px; border-radius: 8px 8px 0 0; cursor: pointer; color: var(--ink-2); margin-bottom: -1px; }
.lang-tabs button[aria-selected="true"] { background: var(--surface); border-color: var(--line); color: var(--ink); font-weight: 600; }
.lang-tabs small { font-size: 11px; color: var(--ink-2); font-weight: 400; }
.lang-on { color: var(--forest); font-weight: 700; }
.lang-panel[hidden] { display: none; }
.phone .ph-brand { justify-content: space-between; align-items: center; gap: 8px; text-align: left; color: var(--ink); }
.phone .ph-stars i:first-child, .phone .ph-stars i:nth-child(2), .phone .ph-stars i:nth-child(3), .phone .ph-stars i:nth-child(4) { background: var(--ph-accent); border-color: var(--ph-accent); }
.phone .ph-stars i:nth-child(-n+4) svg { fill: #fff; }
.admin-shell .side { background: #16231D; }
.pill.premium { background: #FFF1DE; color: #8A4B00; }
.admin-list td { vertical-align: top; }
.notice-warn { border-color: #E8C77A; background: #FFFBF0; }
.steps-list { margin: 10px 0; padding-left: 20px; } .steps-list li { margin-bottom: 6px; }
.invoice-head { display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-bottom: 18px; }
.invoice-from { text-align: right; max-width: 320px; }
.invoice-to { margin-bottom: 16px; }
.invoice tfoot td { border-top: 1px solid var(--line); }
@media print { .admin-shell .main, .shell .main { padding: 0; } .invoice { border: 0; } }
/* Yönetim panelindeki tek satırlık formlar: etiket üstte, alan altta */
.inline-fields { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.inline-fields .f { display: flex; flex-direction: column; gap: 4px; font-size: 13px; font-weight: 600; }
.inline-fields .check { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; min-height: 42px; }
.card + .grid { margin-top: 16px; }
/* Sıralanabilir başlık ve toplu işlem çubuğu (Revizyonlar 5) */
.sort-btn { border: 0; background: none; padding: 0; font: inherit; color: inherit; cursor: pointer; display: inline-flex; align-items: center; gap: 4px; text-align: inherit; }
.sort-btn:hover, .sort-btn.on { color: var(--forest); }
.sort-icon { font-size: 11px; opacity: .55; }
.sort-btn.on .sort-icon { opacity: 1; }
th.num .sort-btn { justify-content: flex-end; }
.tbl .pick { width: 32px; padding-right: 0; }
.tbl .pick input { width: 16px; height: 16px; margin: 0; }
.bulk-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 10px 14px; margin-bottom: 12px; border-radius: 10px; background: var(--forest-wash); }
.bulk-bar b { font-weight: 600; }
.list-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.list-head h2 { margin: 0; }
.list-filter { margin: 0; min-width: 240px; }
.list-filter label { font-size: 13px; color: var(--ink-2); }
table[data-sortable] thead th:not([data-nosort]):not(:empty) { cursor: pointer; user-select: none; }
table[data-sortable] thead th:not([data-nosort]):not(:empty)::after { content: " ↕"; font-size: 11px; opacity: .45; }
table[data-sortable] thead th[aria-sort="ascending"]::after { content: " ↑"; opacity: 1; }
table[data-sortable] thead th[aria-sort="descending"]::after { content: " ↓"; opacity: 1; }
table[data-sortable] thead th:hover { color: var(--forest); }
/* Özel form koşulları (Revizyonlar 5, madde 3) */
.q-logic { margin-top: 10px; padding: 10px 12px; border-radius: 9px; background: var(--paper, #F7F5EF); border: 1px solid var(--line-2); }
.q-logic-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 8px; font-size: 13.5px; }
.q-logic-head select { width: auto; }
.q-rule { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 6px; }
.q-rule select { width: auto; max-width: 100%; flex: 1 1 140px; font-size: 13.5px; }
.q-join { font-size: 11.5px; font-weight: 700; color: var(--forest); letter-spacing: .04em; }
.q-logic-add { margin-top: 8px; font-size: 13.5px; }
.q-logic-badge { display: inline-block; font-size: 11.5px; color: var(--forest); background: var(--forest-wash); border-radius: 6px; padding: 1px 6px; margin-left: 6px; }
.preview-langs { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 10px; }
.chip { border: 1px solid var(--line); background: var(--surface); border-radius: 999px; padding: 4px 10px; font: inherit; font-size: 12.5px; cursor: pointer; color: var(--ink-2); }
.chip[aria-pressed="true"] { background: var(--forest); border-color: var(--forest); color: #fff; }
.preview-note { margin: 0 0 10px; }
