/*
  MTM marka paleti — logodan (shared/brand/source/mtm-logo-original.png) piksel ornekleyerek alindi:
    Bordo  #A53148  (MTM harfleri)        -> --color-brand / --color-accent
    Celik  #7C8386  (kose + slogan)       -> --color-steel; koyu UI yuzeyleri bu grinin grafit tonudur
  Kod icinde renk hardcode edilmez; marka degisirse sadece bu dosya degisir.

  Not: Bootstrap 5.3 .btn-primary, form focus, switch gibi bilesenlerde rengi --bs-primary'den DEGIL
  derlenmis sabit degerlerden (#0d6efd) okur. Bu yuzden asagida o bilesenler ayrica override ediliyor.
*/
:root {
  /* Marka */
  --color-brand: #A53148;
  --color-brand-rgb: 165, 49, 72;
  --color-brand-strong: #8A283C;   /* hover */
  --color-brand-deep: #6F2031;     /* active / koyu metin */
  --color-brand-soft: #E06A82;     /* koyu zemin uzerinde okunabilir bordo (ikon, spinner) */
  --color-steel: #7C8386;
  --color-steel-rgb: 124, 131, 134;

  /* UI rolleri */
  --color-primary: #1F2427;        /* grafit: sidebar, hero, baslik metni */
  --color-primary-rgb: 31, 36, 39;
  --color-accent: var(--color-brand);
  --color-accent-rgb: var(--color-brand-rgb);
  --color-success: #2E7D32;
  --color-success-rgb: 46, 125, 50;
  --color-error: #D23B2E;          /* bilerek turuncuya kacik — marka bordosuyla karismasin */
  --color-error-rgb: 210, 59, 46;
  --color-bg: #F4F5F6;
  --color-surface: #FFFFFF;
  --color-text: #1F2427;
  --color-text-muted: #5E666A;

  --font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  /* Bootstrap 5.3 degisken override'lari */
  --bs-primary: var(--color-brand);
  --bs-primary-rgb: var(--color-brand-rgb);
  --bs-success: var(--color-success);
  --bs-success-rgb: var(--color-success-rgb);
  --bs-danger: var(--color-error);
  --bs-danger-rgb: var(--color-error-rgb);
  --bs-body-bg: var(--color-bg);
  --bs-body-color: var(--color-text);
  --bs-body-font-family: var(--font-family);
  --bs-border-radius: 0.75rem;
  --bs-border-radius-lg: 1rem;
  --bs-border-radius-sm: 0.5rem;
  --bs-link-color: var(--color-brand);
  --bs-link-color-rgb: var(--color-brand-rgb);
  --bs-link-hover-color: var(--color-brand-deep);
  --bs-link-hover-color-rgb: 111, 32, 49;
  --bs-focus-ring-color: rgba(var(--color-brand-rgb), 0.22);
}

body {
  background: var(--color-bg);
  color: var(--color-text);
  -webkit-font-smoothing: antialiased;
}

::selection {
  background: rgba(var(--color-brand-rgb), 0.18);
}

.text-accent { color: var(--color-accent) !important; }
.bg-accent { background-color: var(--color-accent) !important; }
.border-accent { border-color: var(--color-accent) !important; }

/* Birincil aksiyon = marka bordosu. .btn-accent public sayfalarda ayni rolu goruyor. */
.btn-primary,
.btn-accent {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--color-brand);
  --bs-btn-border-color: var(--color-brand);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--color-brand-strong);
  --bs-btn-hover-border-color: var(--color-brand-strong);
  --bs-btn-focus-shadow-rgb: var(--color-brand-rgb);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--color-brand-deep);
  --bs-btn-active-border-color: var(--color-brand-deep);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--color-brand);
  --bs-btn-disabled-border-color: var(--color-brand);
  font-weight: 600;
  box-shadow: 0 1px 2px rgba(var(--color-brand-rgb), 0.25);
  transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.btn-primary:hover,
.btn-accent:hover {
  box-shadow: 0 6px 16px rgba(var(--color-brand-rgb), 0.28);
}

.btn-primary:active,
.btn-accent:active {
  transform: translateY(1px);
}

.btn-outline-primary {
  --bs-btn-color: var(--color-brand);
  --bs-btn-border-color: rgba(var(--color-brand-rgb), 0.45);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--color-brand);
  --bs-btn-hover-border-color: var(--color-brand);
  --bs-btn-focus-shadow-rgb: var(--color-brand-rgb);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--color-brand-strong);
  --bs-btn-active-border-color: var(--color-brand-strong);
  --bs-btn-disabled-color: var(--color-brand);
  --bs-btn-disabled-border-color: rgba(var(--color-brand-rgb), 0.45);
}

.form-control:focus,
.form-select:focus,
.form-check-input:focus {
  border-color: rgba(var(--color-brand-rgb), 0.55);
  box-shadow: 0 0 0 0.25rem rgba(var(--color-brand-rgb), 0.15);
}

.form-check-input:checked {
  background-color: var(--color-brand);
  border-color: var(--color-brand);
}

.form-switch .form-check-input:focus:not(:checked) {
  --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23d68c9b'/%3e%3c/svg%3e");
}

.brand-mark {
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--color-primary);
}

/* Logo gorselleri: shared/brand/*.svg — boyut sadece yukseklikle verilir, oran SVG viewBox'tan gelir. */
.brand-logo {
  display: block;
  width: auto;
  height: var(--brand-logo-h, 32px);
  user-select: none;
  -webkit-user-drag: none;
}

:root {
  --shadow-sm: 0 1px 2px rgba(var(--color-primary-rgb), 0.06), 0 1px 3px rgba(var(--color-primary-rgb), 0.08);
  --shadow-md: 0 4px 10px rgba(var(--color-primary-rgb), 0.07), 0 8px 24px rgba(var(--color-primary-rgb), 0.08);
  --shadow-lg: 0 10px 20px rgba(var(--color-primary-rgb), 0.1), 0 20px 48px rgba(var(--color-primary-rgb), 0.14);
  --gradient-hero: radial-gradient(1100px 560px at 12% -12%, rgba(var(--color-brand-rgb), 0.32), transparent 60%),
                   radial-gradient(800px 480px at 108% 108%, rgba(var(--color-steel-rgb), 0.16), transparent 60%),
                   linear-gradient(165deg, #121517 0%, var(--color-primary) 48%, #2A3034 100%);
}

@keyframes fadeSlideUp {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes popIn {
  0% { opacity: 0; transform: scale(0.6); }
  70% { transform: scale(1.06); }
  100% { opacity: 1; transform: scale(1); }
}

.anim-fade-up {
  animation: fadeSlideUp 0.45s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.anim-pop {
  animation: popIn 0.5s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@media (prefers-reduced-motion: reduce) {
  .anim-fade-up,
  .anim-pop {
    animation: none;
  }
}
