/*
 * Bir Sıfır — Ortak tasarım token'ları
 * Ana sayfa, satıcı paneli, admin paneli ve giriş/kayıt formlarının
 * font, renk, buton ve form dilini tek noktadan yönetir.
 */

:root {
    /* Birincil eylem rengi — siyah/slate. Turuncu marka tonu kaldırıldı. */
    --bs-accent: #0f172a;
    --bs-accent-dark: #1e293b;
    --bs-accent-soft: #f1f5f9;

    /* Ana site arka planı ve yüzeyler */
    --bs-bg: #f0f1f3;
    --bs-bg-soft: #e8eaed;
    --bs-surface: #ffffff;
    --bs-surface-alt: #f8f9fa;

    /* Metin renkleri */
    --bs-text: #0f172a;
    --bs-text-strong: #0f172a;
    --bs-text-soft: #64748b;
    --bs-text-muted: #94a3b8;
    --bs-text-faint: #cbd5e1;

    /* Sınır çizgileri */
    --bs-border: #e5e7eb;
    --bs-border-strong: #cbd5e1;

    /* Sidebar (koyu) tonları — satıcı paneliyle tutarlı canlı vurgu */
    --bs-sidebar-bg: #0b1220;
    --bs-sidebar-surface: rgba(255, 255, 255, 0.06);
    --bs-sidebar-surface-strong: rgba(255, 255, 255, 0.10);
    --bs-sidebar-text: #cbd5e1;
    --bs-sidebar-text-strong: #ffffff;
    --bs-sidebar-text-muted: #94a3b8;
    --bs-sidebar-active: #ffffff;

    /* Gölgeler */
    --bs-shadow-soft: 0 18px 42px rgba(15, 23, 42, 0.06);
    --bs-shadow-card: 0 1px 2px rgba(15, 23, 42, 0.04), 0 4px 14px rgba(15, 23, 42, 0.04);

    /* Yarıçaplar */
    --bs-radius: 12px;
    --bs-radius-sm: 8px;
    --bs-radius-lg: 16px;
}

/* Font ailesi — Manrope (gövde), Sora (display başlıklar). Ana site ile aynı. */
body,
.font-sans,
.bs-font-sans {
    font-family: 'Manrope', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
}
.font-display,
.bs-font-display {
    font-family: 'Sora', 'Outfit', 'Manrope', sans-serif;
    letter-spacing: -0.01em;
}

/* Birincil buton (Tailwind utilities ile uyumlu) */
.bs-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 18px;
    border-radius: var(--bs-radius);
    font-weight: 600;
    font-size: 14px;
    line-height: 1.2;
    border: 1px solid transparent;
    transition: background-color .15s ease, color .15s ease, border-color .15s ease, transform .05s ease;
    cursor: pointer;
    user-select: none;
}
.bs-btn:active { transform: translateY(1px); }

.bs-btn-primary {
    background: var(--bs-text-strong);
    color: #ffffff;
}
.bs-btn-primary:hover {
    background: #1e293b;
}

/* Accent buton turuncu yerine primary ile aynı slate tonunu kullanır */
.bs-btn-accent {
    background: var(--bs-accent);
    color: #ffffff;
}
.bs-btn-accent:hover {
    background: var(--bs-accent-dark);
}

.bs-btn-outline {
    background: transparent;
    color: var(--bs-text-strong);
    border-color: var(--bs-border-strong);
}
.bs-btn-outline:hover {
    background: var(--bs-surface-alt);
    border-color: var(--bs-text-soft);
}

.bs-btn-ghost {
    background: transparent;
    color: var(--bs-text-soft);
}
.bs-btn-ghost:hover {
    background: var(--bs-surface-alt);
    color: var(--bs-text-strong);
}

/* Form alanları — login/register ortak dili */
.bs-input,
.bs-select,
.bs-textarea {
    width: 100%;
    background: var(--bs-surface);
    color: var(--bs-text-strong);
    border: 1px solid var(--bs-border);
    border-radius: var(--bs-radius);
    padding: 12px 14px;
    font-size: 14px;
    line-height: 1.4;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.bs-input:focus,
.bs-select:focus,
.bs-textarea:focus {
    outline: none;
    border-color: var(--bs-text-strong);
    box-shadow: 0 0 0 3px rgba(15, 23, 42, 0.08);
}

.bs-label {
    display: block;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--bs-text-soft);
    margin-bottom: 6px;
    letter-spacing: 0.01em;
}

/* Kart — panel iç bölümleri için */
.bs-card {
    background: var(--bs-surface);
    border: 1px solid var(--bs-border);
    border-radius: var(--bs-radius-lg);
    box-shadow: var(--bs-shadow-card);
}
.bs-card-padded {
    padding: 20px;
}

/* Ortak sidebar nav stilleri (admin + satıcı için tek kaynak) */
.bs-nav-link,
.bs-nav-sublink {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 0;
    background: transparent;
    color: var(--bs-sidebar-text);
    text-align: left;
    border-radius: 10px;
    transition: background-color .15s ease, color .15s ease;
    position: relative;
    text-decoration: none;
}
.bs-nav-link {
    padding: 10px 12px;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: -0.005em;
}
.bs-nav-sublink {
    padding: 8px 12px 8px 30px;
    font-size: 12.5px;
    font-weight: 500;
}
.bs-nav-link > i:first-child {
    width: 18px;
    text-align: center;
    font-size: 14px;
    color: var(--bs-sidebar-text-muted);
    transition: color .15s ease;
    flex-shrink: 0;
}
.bs-nav-link:hover,
.bs-nav-sublink:hover {
    background: var(--bs-sidebar-surface);
    color: var(--bs-sidebar-text-strong);
}
.bs-nav-link:hover > i:first-child,
.bs-nav-link.active > i:first-child {
    color: var(--bs-sidebar-text-strong);
}
.bs-nav-link.active,
.bs-nav-sublink.active {
    background: var(--bs-sidebar-surface-strong);
    color: var(--bs-sidebar-active);
    font-weight: 600;
}