/**
 * KodylaSoft — Brand & Logo
 * Tema: --logo-fg, --logo-accent | Dark/Light otomatik
 */

:root {
  --logo-fg: #111827;
  --logo-accent: #4F46E5;
  --logo-type-font: 'Inter', system-ui, -apple-system, sans-serif;
  --logo-type-weight: 600;
  --logo-soft-fg: #6B7280;
}

.dark {
  --logo-fg: #F9FAFB;
  --logo-accent: #818CF8;
  --logo-soft-fg: #9CA3AF;
}

.logo-accent {
  fill: var(--logo-accent);
}

.logo-mark {
  fill: var(--logo-fg);
}

/* Stroke-based mark (Flow K) */
.logo-mark[stroke] {
  fill: none;
  stroke: var(--logo-fg);
}

.logo-type {
  fill: var(--logo-fg);
  font-family: var(--logo-type-font);
  font-weight: var(--logo-type-weight);
}

/* "Soft" kısmı subtle */
.logo-type-soft {
  color: var(--logo-soft-fg);
  font-weight: 500;
}

/* Header logo link */
.brand-logo {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: inherit;
  text-decoration: none;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.brand-logo:hover {
  opacity: 0.92;
  transform: translateY(-1px);
}

.brand-logo:focus-visible {
  outline: 2px solid var(--logo-accent);
  outline-offset: 2px;
}

.brand-logo svg {
  display: block;
  flex-shrink: 0;
}

.brand-logo-icon {
  width: 2rem;
  height: 2rem;
}

.brand-logo-lockup {
  height: 1.75rem;
  width: auto;
}

@media (min-width: 768px) {
  .brand-logo-lockup {
    height: 1.5rem;
  }
}

@media (min-width: 1024px) {
  .brand-logo-lockup {
    height: 1.75rem;
  }
}