/*
  Marketplace'in kendi stili. Panelin ~2000 satırlık seal-* sistemi BİLEREK
  kopyalanmadı: buradaki ekranlar (katalog, ürün, inceleme kuyruğu) panelin
  bileşenlerinin küçük bir alt kümesini kullanıyor ve iki kopya zamanla ayrışırdı.
  Vendored bootstrap/jquery de yok — bu uygulamanın hiçbir sayfası ihtiyaç duymuyor.
*/

:root {
    --mk-bg: #f6f7f9;
    --mk-surface: #ffffff;
    --mk-surface-muted: #f0f2f5;
    --mk-line: #dfe3e8;
    --mk-text: #1c2430;
    --mk-text-soft: #5b6875;
    --mk-primary: #1565c0;
    --mk-success: #2e7d32;
    --mk-warning: #b26a00;
    --mk-danger: #c62828;
    --mk-radius: 10px;
}

* { box-sizing: border-box; }

body {
    margin: 0;
    background: var(--mk-bg);
    color: var(--mk-text);
    font: 14px/1.55 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

a { color: var(--mk-primary); text-decoration: none; }
a:hover { text-decoration: underline; }
code, .mono { font-family: ui-monospace, Consolas, monospace; font-size: .92em; }

/* --- iskelet --- */
.mk-top {
    background: var(--mk-surface);
    border-bottom: 1px solid var(--mk-line);
    padding: 0 20px;
}
.mk-top__inner {
    max-width: 1080px; margin: 0 auto;
    display: flex; align-items: center; gap: 18px; height: 56px;
}
.mk-brand { font-weight: 700; font-size: 16px; color: var(--mk-text); }
.mk-brand span { color: var(--mk-primary); }
.mk-nav { display: flex; gap: 16px; margin-left: auto; align-items: center; font-size: 13.5px; }
.mk-nav__who { color: var(--mk-text-soft); font-size: 12.5px; }

.mk-main { max-width: 1080px; margin: 0 auto; padding: 24px 20px 64px; }
.mk-head { margin-bottom: 20px; }
.mk-head h1 { margin: 0 0 6px; font-size: 22px; }
.mk-head p { margin: 0; color: var(--mk-text-soft); max-width: 70ch; }

.mk-foot {
    max-width: 1080px; margin: 0 auto; padding: 16px 20px 32px;
    color: var(--mk-text-soft); font-size: 12px;
}

/* --- kutular --- */
.mk-card {
    background: var(--mk-surface);
    border: 1px solid var(--mk-line);
    border-radius: var(--mk-radius);
    padding: 16px;
}
.mk-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; }
.mk-stack { display: flex; flex-direction: column; gap: 14px; }
.mk-row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }

.mk-card__title { font-weight: 650; font-size: 15px; margin: 0 0 4px; }
.mk-card__meta { color: var(--mk-text-soft); font-size: 12.5px; }
.mk-card__body { margin: 8px 0; color: var(--mk-text-soft); font-size: 13px; }

/* --- rozet --- */
.mk-badge {
    display: inline-block; padding: 1px 8px; border-radius: 999px;
    font-size: 11.5px; font-weight: 600; border: 1px solid transparent; white-space: nowrap;
}
.mk-badge--neutral { background: var(--mk-surface-muted); color: var(--mk-text-soft); border-color: var(--mk-line); }
.mk-badge--success { background: #e8f5e9; color: var(--mk-success); border-color: #c8e6c9; }
.mk-badge--warning { background: #fff4e5; color: var(--mk-warning); border-color: #ffe0b2; }
.mk-badge--danger  { background: #fdecea; color: var(--mk-danger);  border-color: #f5c6cb; }
.mk-badge--info    { background: #e7f0fb; color: var(--mk-primary);  border-color: #cfe0f7; }

/* --- form --- */
.mk-field { display: block; margin-bottom: 14px; }
.mk-field__label { display: block; font-size: 12.5px; font-weight: 600; margin-bottom: 5px; }
.mk-field__hint { display: block; font-size: 12px; color: var(--mk-text-soft); margin-top: 4px; }
.mk-input, .mk-select, .mk-textarea {
    width: 100%; padding: 8px 10px;
    border: 1px solid var(--mk-line); border-radius: 8px;
    background: var(--mk-surface); color: var(--mk-text); font: inherit;
}
.mk-textarea { min-height: 180px; font-family: ui-monospace, Consolas, monospace; font-size: 12.5px; }
.mk-input:focus, .mk-select:focus, .mk-textarea:focus {
    outline: 2px solid var(--mk-primary); outline-offset: -1px; border-color: var(--mk-primary);
}

.mk-btn {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 8px 14px; border-radius: 8px; border: 1px solid var(--mk-line);
    background: var(--mk-surface); color: var(--mk-text);
    font: inherit; font-weight: 600; font-size: 13px; cursor: pointer;
}
.mk-btn:hover { background: var(--mk-surface-muted); text-decoration: none; }
.mk-btn--primary { background: var(--mk-primary); border-color: var(--mk-primary); color: #fff; }
.mk-btn--primary:hover { filter: brightness(1.08); }
.mk-btn--danger { background: var(--mk-danger); border-color: var(--mk-danger); color: #fff; }
.mk-btn--sm { padding: 5px 10px; font-size: 12.5px; }

/* --- bildirim --- */
.mk-note {
    border: 1px solid var(--mk-line); border-left-width: 3px;
    border-radius: 8px; padding: 11px 13px; font-size: 13px; margin-bottom: 16px;
    background: var(--mk-surface);
}
.mk-note--ok    { border-left-color: var(--mk-success); }
.mk-note--warn  { border-left-color: var(--mk-warning); }
.mk-note--error { border-left-color: var(--mk-danger); }
.mk-note--info  { border-left-color: var(--mk-primary); }

/* --- tablo --- */
.mk-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.mk-table th, .mk-table td {
    text-align: left; padding: 9px 10px; border-bottom: 1px solid var(--mk-line); vertical-align: top;
}
.mk-table th { font-size: 12px; color: var(--mk-text-soft); font-weight: 600; }
.mk-table tr:last-child td { border-bottom: none; }

.mk-empty { color: var(--mk-text-soft); font-size: 13px; padding: 18px 0; }

/* Geniş içerik kendi kutusunda kayar; sayfa gövdesi yatay kaymaz. */
.mk-scroll { overflow-x: auto; }

@media (prefers-color-scheme: dark) {
    :root {
        --mk-bg: #14181d;
        --mk-surface: #1c2229;
        --mk-surface-muted: #242c35;
        --mk-line: #333d47;
        --mk-text: #e6eaee;
        --mk-text-soft: #9aa7b3;
        --mk-primary: #6ea8f0;
        --mk-success: #7bc47f;
        --mk-warning: #e0a458;
        --mk-danger: #ef7f7f;
    }
    .mk-badge--success { background: #1e2a20; border-color: #2e4a33; }
    .mk-badge--warning { background: #2c2418; border-color: #4a3b22; }
    .mk-badge--danger  { background: #2c1c1c; border-color: #4a2a2a; }
    .mk-badge--info    { background: #1a2430; border-color: #2b3d52; }
}