/* Act Rush — İlan sayfası */

.composer {
  display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(380px, .88fr);
  gap: 20px; align-items: start;
  max-width: 1480px; margin: 0 auto;
}
.composer-main { display: grid; gap: 20px; min-width: 0; }
.composer-side { position: sticky; top: calc(var(--header-h) + 20px); min-width: 0; }

/* ---------- Fiyatlar ---------- */
.team-state { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.price-block + .price-block { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); }
.pb-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.pb-head h3 { color: var(--gold-2); font: 700 13px/1.2 var(--font-ui); letter-spacing: .08em; text-transform: uppercase; }
.pb-head h3 .muted { font-weight: 600; letter-spacing: .02em; text-transform: none; }
.pb-total { display: flex; align-items: center; gap: 6px; color: var(--text-2); font-size: 13.5px; }
.pb-total b { color: #fff; font-size: 21px; font-variant-numeric: tabular-nums; }
.price-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.price-grid-people { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 12px; }
.price-field .stepper { display: flex; width: 100%; }
.price-field .stepper input[type="number"] { flex: 1; width: auto; min-width: 0; }
.compare { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin-top: 14px; color: var(--text-2); font-size: 13.5px; }
.compare b { color: #fff; }

/* ---------- Hazır fiyatlar ---------- */
.preset-row { display: grid; grid-template-columns: 56px minmax(0, 1fr); align-items: start; gap: 12px; }
.preset-row + .preset-row { margin-top: 12px; }
.preset-row-title { padding-top: 11px; color: var(--text-3); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.preset-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.preset {
  display: grid; grid-template-columns: auto auto; align-items: baseline; column-gap: 14px; row-gap: 2px;
  padding: 9px 12px; text-align: left;
  border-radius: 10px; border: 1px solid var(--line-2); background: var(--surface-2); color: var(--text);
  transition: border-color .15s, background .15s;
}
.preset:hover:not(:disabled) { border-color: var(--gold); background: rgb(229 195 107 / .08); }
.preset:disabled { opacity: .5; }
.preset.is-static { cursor: default; }
.preset-name { grid-column: 1 / -1; font-size: 13.5px; font-weight: 700; }
.preset-vals { color: var(--text-3); font-size: 12.5px; font-variant-numeric: tabular-nums; }
.preset-total { display: flex; align-items: center; justify-self: end; color: var(--gold-2); font-size: 13px; font-weight: 700; }

/* ---------- İlan bilgileri ---------- */
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.field-wide { grid-column: 1 / -1; }
.form-grid + .check { margin-top: 16px; }

/* ---------- Önizleme ---------- */
.preview-card { display: flex; flex-direction: column; gap: 12px; max-height: calc(100vh - var(--header-h) - 40px); }
.preview-card .card-head { margin-bottom: 0; }
.warnings { display: grid; gap: 6px; padding: 0; list-style: none; }
.warnings:empty { display: none; }
.warnings li {
  display: flex; align-items: center; gap: 8px;
  padding: 7px 10px; border-radius: 9px;
  border: 1px solid rgb(240 184 64 / .3); background: rgb(240 184 64 / .08);
  color: var(--amber); font-size: 13px;
}
/* Elle düzenleme editörü (reklam engelleyiciler "adText"/"ad-text" adlarını gizler — kullanma) */
.ilan-text {
  flex: 1 1 auto; min-height: 320px; resize: vertical;
  background: #090705; color: var(--text); border-color: var(--amber);
  font: 13px/1.6 var(--font-mono);
  font-variant-ligatures: none; font-feature-settings: "calt" 0, "liga" 0;
}
.preview-actions { display: flex; flex-wrap: wrap; gap: 8px; }

/* ---------- Discord önizlemesi (kopyalanan metin Discord'da böyle görünür) ---------- */
.dc-preview {
  flex: 1 1 auto; min-height: 200px; overflow: auto;
  padding: 14px 16px 16px; border-radius: 12px;
  border: 1px solid #1e1f22; background: #313338;
  color: #dbdee1; font: 15px/1.375 "gg sans", "Noto Sans", "Segoe UI", system-ui, sans-serif;
  scrollbar-color: #1a1b1e transparent;
}
.dc-msg { display: grid; grid-template-columns: 40px minmax(0, 1fr); column-gap: 14px; }
.dc-avatar {
  display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%;
  background: #5865f2; color: #fff; font-size: 16px; font-weight: 700;
}
.dc-meta { display: flex; align-items: baseline; gap: 8px; margin-bottom: 2px; }
.dc-name { color: #f2f3f5; font-size: 15px; font-weight: 600; }
.dc-time { color: #949ba4; font-size: 12px; }
.dc-content { min-width: 0; overflow-wrap: anywhere; }
.dc-line { min-height: 1.375em; white-space: pre-wrap; }
.dc-content strong { color: #f2f3f5; font-weight: 700; }
.dc-emoji { display: inline-block; width: 1.375em; height: 1.375em; margin: 0 .05em; vertical-align: -.3em; object-fit: contain; }
.dc-code {
  margin: 4px 0; padding: 8px 10px; border-radius: 4px;
  border: 1px solid #1e1f22; background: #2b2d31; color: #dbdee1;
  font: 13.5px/1.45 Consolas, "Lucida Console", var(--font-mono);
  white-space: pre-wrap; overflow-wrap: anywhere;
}

/* ---------- Kırılımlar ---------- */
@media (max-width: 1280px) {
  .composer { grid-template-columns: minmax(0, 1fr); }
  .composer-side { position: static; order: -1; }
  .preview-card { max-height: none; }
  .ilan-text { min-height: 280px; }
  .dc-preview { overflow: visible; }
}

@media (max-width: 760px) {
  .price-grid, .price-grid-people, .form-grid { grid-template-columns: minmax(0, 1fr); }
  .preset-row { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .preset-row-title { padding-top: 0; }
  .card { padding: 16px; }
}
