/* ══════════════════════════════════════════════════════════════
   legacy-tools.css — ESKİ (ozisg) araç sayfaları için köprü
   ──────────────────────────────────────────────────────────────
   Taşınan ERP / Atölye / Bayi sayfalarının HTML'i eski master.css değişkenlerini (var(--bg-surface) …) ve
   birkaç sınıfı (.card, .form-control, .form-label …) kullanır. Bu dosya onları Bluep'in açık temasına bağlar;
   böylece sayfa içeriği değiştirilmeden çalışır. Sayfalar zorunlu AÇIK temada çalışır (sabit renkli iç stiller).
   Yeni yazılan sayfalar bu dosyayı KULLANMAZ; sayfalar tek tek modernleştikçe bu köprü küçülür.
   Kullanım: <html data-theme="light"> + bluep.css + legacy-tools.css, <body class="legacy-tool">
   ══════════════════════════════════════════════════════════════ */

body.legacy-tool {
  /* renkler */
  --bg-page: #f3f7fc;
  --bg-surface: #ffffff;
  --bg-surface-2: #f8fafc;
  --bg-surface-3: #eef3f9;
  --bg-card: #ffffff;
  --text-primary: #0b1b33;
  --text-secondary: #3c4d68;
  --text-muted: #566a86;
  --text-light: #8a9ab2;
  --text-inverse: #f8fafc;
  --border-color: #d6e2f1;
  --border-subtle: #e6eef8;
  --border-primary: #b7c9df;
  --accent-primary: #0284c7;
  --accent-primary-subtle: rgba(2, 132, 199, 0.1);
  --accent-secondary: #0ea5e9;
  --accent-success: #059669;
  --accent-warning: #d97706;
  --accent-danger: #dc2626;
  --accent-info: #6366f1;
  --bg-overlay: rgba(10, 22, 40, 0.6);
  /* boşluk / yarıçap / gölge / yazı */
  --space-1: .25rem; --space-2: .5rem; --space-3: .75rem; --space-4: 1rem; --space-5: 1.25rem;
  --space-6: 1.5rem; --space-8: 2rem; --space-10: 2.5rem;
  --border-radius-sm: 6px; --border-radius: 10px; --border-radius-md: 14px; --border-radius-lg: 20px; --border-radius-xl: 28px; --border-radius-full: 9999px;
  --shadow-sm: 0 2px 8px rgba(10, 30, 60, .08); --shadow-md: 0 4px 20px rgba(10, 30, 60, .12); --shadow-lg: 0 8px 40px rgba(10, 30, 60, .16);
  --shadow-card: 0 2px 12px rgba(10, 30, 60, .08);
  --font-sans: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Roboto, Arial, sans-serif;
  --font-mono: "Cascadia Code", "Fira Code", Consolas, monospace;
  --text-xs: .75rem; --text-sm: .875rem; --text-base: 1rem; --text-lg: 1.125rem; --text-xl: 1.25rem; --text-2xl: 1.5rem;

  font-family: var(--font-sans);
  color: var(--text-primary);
  background: var(--bg-page);
}
body.legacy-tool::before { display: none; }              /* blueprint ızgarası yerine düz zemin */
body.legacy-tool h1, body.legacy-tool h2, body.legacy-tool h3, body.legacy-tool h4 { color: var(--text-primary); line-height: 1.25; }
body.legacy-tool input, body.legacy-tool textarea, body.legacy-tool select, body.legacy-tool button { font-family: inherit; }

/* ── Kart ── */
.legacy-tool .card { background: var(--bg-surface); border: 1px solid var(--border-color); border-radius: var(--border-radius-lg); box-shadow: var(--shadow-card); }

/* ── Form ── */
.legacy-tool .form-label { font-size: var(--text-sm); font-weight: 600; color: var(--text-secondary); }
.legacy-tool .form-control {
  width: 100%; padding: .7rem 1rem; font-size: var(--text-base); font-weight: 500; color: var(--text-primary);
  background: var(--bg-surface); border: 1.5px solid var(--border-color); border-radius: var(--border-radius);
  outline: none; transition: border-color .15s, box-shadow .15s;
}
.legacy-tool .form-control:hover:not(:focus) { border-color: var(--border-primary); }
.legacy-tool .form-control:focus { border-color: var(--accent-primary); box-shadow: 0 0 0 3px rgba(2, 132, 199, .16); }
.legacy-tool textarea.form-control { min-height: 110px; resize: vertical; }
.legacy-tool select.form-control {
  appearance: none; -webkit-appearance: none; padding-right: 2.5rem;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23475569' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");
  background-repeat: no-repeat; background-position: right 12px center; background-size: 16px;
}
.legacy-tool select.form-control option { background: #fff; color: var(--text-primary); }

/* ── Düğmeler (bluep.css'teki .btn tabanına eklenenler) ── */
.legacy-tool .btn-secondary { color: var(--text-primary); background: var(--bg-surface-2); border-color: var(--border-color); }
.legacy-tool .btn-secondary:hover { background: var(--bg-surface-3); border-color: var(--border-primary); }
.legacy-tool .btn-danger { color: #fff; background: var(--accent-danger); border-color: var(--accent-danger); }
.legacy-tool .btn-danger:hover { filter: brightness(.94); }
.legacy-tool .btn-outline { color: var(--accent-primary); background: transparent; border-color: var(--accent-primary); }

/* ── Yükleniyor halkası ── */
.legacy-tool .spinner { width: 36px; height: 36px; border-radius: 50%; border: 3px solid var(--border-color); border-top-color: var(--accent-primary); animation: spin .8s linear infinite; }

/* ── Yardımcılar ── */
.legacy-tool .container { max-width: 1240px; }
.legacy-tool .toast { color: var(--text-primary); }
.legacy-tool a { color: var(--accent-primary); }
.legacy-tool .badge { color: var(--text-secondary); background: var(--bg-surface-3); border-color: var(--border-color); }

/* Bluep üst çubuğu, eski araç sayfasında açık temada kalır */
.legacy-tool .site-header { position: sticky; }
.legacy-tool .tool-back-link { text-decoration: none; }

/* ══════════ Mobil / tablet uyum katmanı (eski araç sayfaları: ERP, Atölye, Dönüştürücü) ══════════
   Bu sayfalar satır içi style="display:flex/grid…" ile yazıldı; dar ekranda taşmayı önlemek için satır içi düzenleri esnetir. */
.legacy-tool { overflow-x: clip; }
.legacy-tool img, .legacy-tool video, .legacy-tool canvas, .legacy-tool svg { max-width: 100%; }
.legacy-tool table { display: block; max-width: 100%; overflow-x: auto; }
@media (max-width: 860px) {
  .legacy-tool [style*="display:flex"], .legacy-tool [style*="display: flex"] { flex-wrap: wrap; }
  .legacy-tool input, .legacy-tool select, .legacy-tool textarea { max-width: 100%; min-width: 0; }
  .legacy-tool [style*="width:"][style*="px"]:not([style*="max-width"]):not(svg):not(img):not(canvas) { max-width: 100%; }
  .legacy-tool .form-control { min-width: 0; }
  .legacy-tool .container, .legacy-tool main { padding-left: 14px; padding-right: 14px; }
}
@media (max-width: 640px) {
  .legacy-tool [style*="grid-template-columns"]:not(.keep-cols) { grid-template-columns: 1fr !important; }
  .legacy-tool [style*="grid-column: span"], .legacy-tool [style*="grid-column:span"] { grid-column: auto !important; }
  .legacy-tool [style*="overflow-x:auto"], .legacy-tool [style*="overflow-x: auto"] { max-width: 100%; }
  .legacy-tool .card, .legacy-tool [class*="modal"] .card { max-width: 100%; }
}
