/* ==========================================================================
   MODELS TURKIYE — TASARIM SISTEMI (ortak katman)
   Ilke: ORTAK DIL, SAYFAYA GORE DUZEN.
   - Renk, yazi, kose, cizgi, bosluk, dugme ve etiket her sayfada AYNI: buradan gelir.
   - Sayfanin kendi duzeni (sutunlar, kartlarin yerlesimi) sayfaya ozel kalir.
   Bir rengi/olcuyu degistirmek icin yalnizca bu dosyadaki degiskenleri degistir.
   Belge: DESIGN-SYSTEM.md
   ========================================================================== */

:root {
	/* Renkler */
	--mt-ink: #20201e;            /* ana yazi */
	--mt-muted: #4d4b47;          /* ikincil yazi (krem uzerinde 7:1) */
	--mt-faint: #8a857c;          /* ucuncul yazi, ustu cizili fiyat */
	--mt-paper: #f7f5f2;          /* sayfa zemini (krem) */
	--mt-soft: #f0ede8;           /* hafif vurgulu yuzey */
	--mt-surface: #ffffff;        /* kart zemini */
	--mt-line: #dedad4;           /* ince cizgi */
	--mt-field-line: #c8c1b9;     /* form alani cercevesi */
	--mt-accent: #682c38;         /* marka bordosu: birincil eylem */
	--mt-accent-deep: #51212c;    /* uzerine gelince */
	--mt-accent-tint: #fcf5f3;    /* secili/aktif zemin */
	--mt-accent-line: #d9b8b7;    /* bordo tonlu cizgi */
	--mt-gold: #c9a24a;           /* yalnizca Diamond/luks vurgu: rozet, tik, ust cizgi */
	--mt-gold-soft: #e6d3a1;
	--mt-danger: #b42332;         /* hata, silme */
	--mt-danger-tint: #fdf0f1;

	/* Yazi */
	--mt-serif: Georgia, 'Times New Roman', serif;
	--mt-sans: -apple-system, 'system-ui', 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;

	/* Kose ve olcu */
	--mt-radius: 4px;             /* dugme, alan, etiket */
	--mt-radius-card: 6px;        /* kart, tablo, pencere */
	--mt-tap: 44px;               /* en kucuk dokunma alani */
	--mt-control-h: 52px;         /* form alani ve ana dugme yuksekligi */

	/* Bosluk (4'un katlari) */
	--mt-space-1: 4px;  --mt-space-2: 8px;  --mt-space-3: 12px; --mt-space-4: 16px;
	--mt-space-5: 24px; --mt-space-6: 32px; --mt-space-7: 48px;

	/* Hareket */
	--mt-ease: .15s ease;
}

/* ---- Yazi ---- */
.mt-title {font-family: var(--mt-serif); font-weight: 400; letter-spacing: -.015em; line-height: 1.15; color: var(--mt-ink);}
.mt-title--xl {font-size: clamp(34px, 5vw, 56px);}
.mt-title--lg {font-size: clamp(28px, 4vw, 40px);}
.mt-title--md {font-size: 26px;}
.mt-eyebrow {display: block; font-size: 12px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--mt-muted);}
.mt-text {font-size: 16px; line-height: 1.6; color: var(--mt-muted);}
.mt-text--small {font-size: 14px;}

/* ---- Dugmeler: birincil = dolgu bordo; ikincil = bordo cerceve; ucuncul = alti cizili baglanti ---- */
.mt-btn {display: inline-flex; align-items: center; justify-content: center; gap: var(--mt-space-2); min-height: var(--mt-tap); padding: 0 22px; border: 1px solid var(--mt-accent); border-radius: var(--mt-radius); background: var(--mt-accent); color: #fff; font: 600 16px/1.2 var(--mt-sans); text-decoration: none; cursor: pointer; box-shadow: none; transition: background-color var(--mt-ease), border-color var(--mt-ease), color var(--mt-ease);}
.mt-btn:hover, .mt-btn:focus {background: var(--mt-accent-deep); border-color: var(--mt-accent-deep); color: #fff; text-decoration: none;}
.mt-btn--large {min-height: var(--mt-control-h);}
.mt-btn--block {display: flex; width: 100%;}
.mt-btn--secondary {background: var(--mt-surface); color: var(--mt-accent);}
.mt-btn--secondary:hover, .mt-btn--secondary:focus {background: var(--mt-accent-tint); color: var(--mt-accent-deep); border-color: var(--mt-accent);}
.mt-btn--danger {background: var(--mt-surface); border-color: var(--mt-danger); color: var(--mt-danger);}
.mt-btn--danger:hover {background: var(--mt-danger-tint); color: var(--mt-danger); border-color: var(--mt-danger);}
.mt-btn:disabled, .mt-btn[aria-disabled="true"] {opacity: .5; cursor: not-allowed;}
.mt-link {display: inline-flex; align-items: center; min-height: var(--mt-tap); color: var(--mt-accent); font-weight: 600; text-decoration: underline; text-underline-offset: 4px;}
.mt-link:hover {color: var(--mt-accent-deep);}
.mt-btn:focus-visible, .mt-link:focus-visible, .mt-field:focus-visible {outline: 2px solid var(--mt-accent); outline-offset: 3px;}

/* ---- Kart ---- */
.mt-card {background: var(--mt-surface); border: 1px solid var(--mt-line); border-radius: var(--mt-radius-card); box-shadow: none; padding: var(--mt-space-5);}
.mt-card--accent {border-top: 3px solid var(--mt-accent);}
.mt-card--muted {background: var(--mt-paper);}

/* ---- Form alani ---- */
.mt-field {display: block; width: 100%; min-height: var(--mt-control-h); padding: 0 14px; border: 1px solid var(--mt-field-line); border-radius: var(--mt-radius); background: var(--mt-surface); color: var(--mt-ink); font: 400 16px/1.4 var(--mt-sans);}
textarea.mt-field {min-height: 120px; padding: 12px 14px;}
.mt-field:focus {border-color: var(--mt-accent); box-shadow: 0 0 0 3px rgba(104, 44, 56, .12); outline: none;}
.mt-label {display: block; margin-bottom: 6px; color: var(--mt-ink); font-size: 15px; font-weight: 600;}

/* ---- Etiket ve durum: kutu yok. Kategori/konum nokta ile ayrilmis duz yazi; durum kucuk nokta + yazi ---- */
.mt-meta {display: flex; flex-wrap: wrap; align-items: center; color: var(--mt-muted); font-size: 14px; line-height: 1.5;}
.mt-meta > * + *::before {content: "·"; margin: 0 8px; color: #a8a29a;}
.mt-status {display: inline-flex; align-items: center; gap: var(--mt-space-2); font-size: 14px; font-weight: 600; color: var(--mt-ink);}
.mt-status::before {content: ""; flex: 0 0 7px; width: 7px; height: 7px; border-radius: 50%; background: #b7b1a8;}
.mt-status--positive {color: var(--mt-accent);}
.mt-status--positive::before {background: var(--mt-accent);}
.mt-status--inactive {color: var(--mt-muted); font-weight: 500;}
.mt-status--inactive::before {background: #cfc9c0;}
.mt-badge {display: inline-block; padding: 6px 12px; border-radius: var(--mt-radius); background: var(--mt-accent); color: #fff; font-size: 12px; font-weight: 600; letter-spacing: .06em; line-height: 1;}   /* yalnizca indirim/oneri gibi nadir vurgu */

/* ---- Yardimcilar ---- */
.mt-divider {height: 1px; border: 0; background: var(--mt-line); margin: var(--mt-space-5) 0;}
.mt-sr-only {position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;}
@media (prefers-reduced-motion: reduce) {* {scroll-behavior: auto !important;}}
