/* ==========================================================================
   AVRUPA BAYİ UI v3 — ortak tasarım sistemi (anasayfa + panel + auth)
   Layout ve home.blade.php en sonda yükler; mevcut stilleri ezer.
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

:root {
  --ink: #091326;
  --ink-2: #162647;
  --muted: #5b6b86;
  --line: #dce4f0;
  --bg: #f3f6fb;
  --surface: #fff;
  --brand: #2563eb;
  --brand-600: #1d4ed8;
  --brand-700: #1e40af;
  --brand-2: #0ea5e9;
  --accent: #f59e0b;
  --ok: #0d9488;
  --warn: #f59e0b;
  --bad: #ef4444;
  --grad: linear-gradient(135deg, #1e40af 0%, #2563eb 50%, #0ea5e9 120%);
  --grad-dark: radial-gradient(1200px 500px at 85% -10%, rgba(37,99,235,.55), transparent 60%),
               radial-gradient(900px 500px at -5% 110%, rgba(14,165,233,.28), transparent 60%),
               linear-gradient(160deg, #091326 0%, #0f2147 100%);
  --radius: 16px;
  --radius-sm: 10px;
  --shadow-sm: 0 1px 2px rgba(9,19,38,.05), 0 2px 8px rgba(9,19,38,.04);
  --shadow: 0 10px 30px -10px rgba(15,33,71,.18);
  --shadow-lg: 0 24px 60px -20px rgba(15,33,71,.35);
  --ring: 0 0 0 4px rgba(37,99,235,.18);
}

/* ---------- Temel ---------- */
html { scroll-behavior: smooth; }
body {
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif !important;
  background: var(--bg) !important;
  color: var(--ink) !important;
  -webkit-font-smoothing: antialiased;
  letter-spacing: -.005em;
}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6 { letter-spacing: -.025em; font-weight: 800; }
::selection { background: rgba(109,94,252,.25); }
a { color: var(--brand-600); }
.text-muted { color: var(--muted) !important; }

/* ---------- Butonlar ---------- */
.btn { border-radius: 12px; font-weight: 600; transition: transform .15s, box-shadow .2s, background .2s, border-color .2s; }
.btn:active { transform: translateY(1px) scale(.99); }
.btn-primary, .btn-brand, body .btn-brand {
  background: var(--grad) !important; border: 0 !important; color: #fff !important;
  box-shadow: 0 8px 20px -8px rgba(109,94,252,.7);
}
.btn-primary:hover, .btn-brand:hover, body .btn-brand:hover { filter: brightness(1.06); box-shadow: 0 12px 26px -8px rgba(109,94,252,.8); transform: translateY(-1px); }
.btn-outline-primary { color: var(--brand-600); border-color: #cfc9ff; }
.btn-outline-primary:hover { background: var(--brand); border-color: var(--brand); }
.btn-outline-secondary { border-color: var(--line); color: var(--ink-2); background: #fff; }
.btn-outline-secondary:hover { background: #f1f2fb; color: var(--ink); border-color: #d6daea; }
.btn-success { background: linear-gradient(135deg,#10b981,#059669); border: 0; box-shadow: 0 8px 18px -8px rgba(16,185,129,.7); }
body .btn-ghost { background: #fff; border: 1px solid var(--line); color: var(--ink-2); border-radius: 12px; }
body .btn-ghost:hover { background: #f1f2fb; }

/* ---------- Form ---------- */
.form-control, .form-select {
  border-radius: 12px; border: 1px solid #dcdfec; background-color: #fff; padding: .6rem .9rem;
  transition: border-color .15s, box-shadow .15s;
}
.form-control:focus, .form-select:focus { border-color: var(--brand); box-shadow: var(--ring); }
.form-label { font-weight: 600; font-size: .82rem; color: var(--ink-2); }
.form-check-input:checked { background-color: var(--brand); border-color: var(--brand); }

/* ---------- Kart / tablo / rozet ---------- */
.card { border: 1px solid var(--line) !important; border-radius: var(--radius) !important; box-shadow: var(--shadow-sm) !important; background: var(--surface); }
.card-header { background: transparent !important; border-bottom: 1px solid var(--line) !important; font-weight: 700; padding: .9rem 1.1rem; }
.card-body { padding: 1.1rem; }
.table { --bs-table-bg: transparent; }
.table > thead > tr > th, .table thead th {
  background: #f7f8fd; color: var(--muted); font-size: .7rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .07em; border-bottom: 1px solid var(--line); white-space: nowrap;
}
.table > :not(caption) > * > * { padding: .8rem .9rem; border-bottom-color: #eef0f7; }
.table-hover > tbody > tr:hover > * { --bs-table-accent-bg: #f7f6ff; }
.badge { font-weight: 600; letter-spacing: .01em; border-radius: 8px; padding: .38em .62em; }
.alert { border: 0; border-radius: 14px; box-shadow: var(--shadow-sm); }
.alert-success { background: #e8faf3; color: #065f46; }
.alert-danger { background: #feeceb; color: #991b1b; }
.alert-warning { background: #fff6e0; color: #92400e; }
.alert-info { background: #e7f6fd; color: #075985; }
.page-link { border-radius: 10px !important; margin: 0 2px; border: 1px solid var(--line); color: var(--ink-2); }
.page-item.active .page-link { background: var(--grad); border-color: transparent; color: #fff; }
.modal-content { border: 0; border-radius: 20px; box-shadow: var(--shadow-lg); }
.dropdown-menu { border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow); padding: .4rem; }
.dropdown-item { border-radius: 8px; }

/* ---------- Panel: topbar + sidebar ---------- */
.topbar {
  background: rgba(255,255,255,.82) !important; backdrop-filter: saturate(1.6) blur(14px); -webkit-backdrop-filter: saturate(1.6) blur(14px);
  border-bottom: 1px solid rgba(15,23,42,.06) !important;
}
.topbar-brand { font-weight: 800; letter-spacing: .02em; }
.topbar-brand span { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.sidebar {
  background: var(--grad-dark) !important; border-right: 0 !important; color: #cfd6f5;
  box-shadow: 10px 0 40px -20px rgba(11,16,32,.5);
}
.sidebar a { color: #aeb7dc !important; border-radius: 12px; font-weight: 500; transition: background .15s, color .15s, transform .15s; }
.sidebar a:hover { background: rgba(255,255,255,.08) !important; color: #fff !important; transform: translateX(2px); }
.sidebar a.active {
  background: linear-gradient(135deg, rgba(37,99,235,.95), rgba(14,165,233,.85)) !important; color: #fff !important;
  box-shadow: 0 8px 20px -8px rgba(37,99,235,.85);
}
.sidebar .nav-section { color: #6f7aa8 !important; font-weight: 700; letter-spacing: .12em; }
.sidebar a i { opacity: 1; }
.stat-card { border-top: 0 !important; position: relative; overflow: hidden; }
.stat-card::before { content: ''; position: absolute; inset: 0 0 auto 0; height: 4px; background: var(--grad); }
.stat-card.green::before { background: linear-gradient(90deg,#10b981,#22d3ee); }
.stat-card.orange::before { background: linear-gradient(90deg,#f59e0b,#ff7a59); }
.stat-card.red::before { background: linear-gradient(90deg,#ef4444,#f97316); }
.hero-banner { background: var(--grad-dark) !important; border-radius: 20px !important; padding: 1.5rem 1.6rem !important; box-shadow: var(--shadow-lg); }
.page-head h4 { font-size: 1.5rem; }
.mp-card, .order-card { border-radius: var(--radius); transition: transform .2s, box-shadow .2s; }
.order-card:hover, .mp-card:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.dnav a { font-weight: 600; }
.dnav a.active { background: #eeecff; color: var(--brand-700); border-color: #d9d4ff; }

/* ---------- Vitrin üst bar (misafir) ---------- */
body .sf-header { background: rgba(11,16,32,.72); border-bottom: 1px solid rgba(255,255,255,.08); }
body .sf-header-inner { height: 64px; }
body .sf-logo { color: #fff; font-weight: 800; letter-spacing: .03em; }
body .sf-logo span { background: linear-gradient(135deg,#a79bff,#22d3ee); -webkit-background-clip: text; background-clip: text; color: transparent; }
body .sf-wa { background: rgba(16,185,129,.16); color: #5eead4; }
body .sf-btn { border-radius: 12px; min-height: 40px; }
body .sf-btn-ghost { background: transparent; color: #e5e8ff; border-color: rgba(255,255,255,.2); }
body .sf-btn-ghost:hover { background: rgba(255,255,255,.1); color: #fff; }
body .sf-btn-solid { background: var(--grad); border: 0; box-shadow: 0 8px 20px -8px rgba(109,94,252,.9); }

/* ---------- Alt bilgi ---------- */
body footer { background: var(--ink) !important; color: #9aa4cf !important; border-top: 0 !important; margin-top: 2rem; }
body footer.border-top { background: #fff !important; color: var(--muted) !important; border-top: 1px solid var(--line) !important; }
body footer a { color: #cfd6f5; }
body footer a:hover { color: #fff; }
body footer h6 { color: #fff; letter-spacing: .08em; text-transform: uppercase; font-size: .72rem; }
body footer .logo span { color: #a79bff; }

/* ---------- Giriş / kayıt ---------- */
.auth-card, .login-card { border-radius: 24px !important; box-shadow: var(--shadow-lg) !important; border: 0 !important; }

/* ---------- Mobil alt menü / WhatsApp ---------- */
body .dealer-bottom-nav { background: rgba(255,255,255,.92); backdrop-filter: blur(14px); border-top: 1px solid var(--line); }
body .dealer-bottom-nav a.active { color: var(--brand-600); }
.wa-fab { box-shadow: 0 12px 30px -8px rgba(37,211,102,.7) !important; }

/* ---------- Hareket ---------- */
@keyframes bn-rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.main > * { animation: bn-rise .5s cubic-bezier(.2,.8,.2,1) both; }
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } html { scroll-behavior: auto; } }

@media (max-width: 575.98px) {
  }

/* ---------- Auth sayfaları (login / register) ---------- */
body .auth-page { background: var(--grad-dark) !important; min-height: calc(100dvh - 64px); display: flex; align-items: center; padding: 2.5rem 0 !important; position: relative; overflow: hidden; }
body .auth-page::before { content: ''; position: absolute; inset: 0; opacity: .5; pointer-events: none; background-image: radial-gradient(rgba(255,255,255,.12) 1px, transparent 1px); background-size: 26px 26px; }
body .auth-page > * { position: relative; }
body .auth-card { background: rgba(255,255,255,.97) !important; border-radius: 26px !important; padding: 2rem !important; box-shadow: 0 40px 80px -30px rgba(0,0,0,.6) !important; border: 1px solid rgba(255,255,255,.5) !important; }
body .auth-brand { font-weight: 800; letter-spacing: .03em; color: var(--ink) !important; }
body .auth-brand span { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
body .auth-title { font-weight: 800; letter-spacing: -.03em; color: var(--ink); }
body .auth-sub, body .auth-foot { color: var(--muted) !important; }
body .auth-btn { background: var(--grad) !important; color: #fff !important; border: 0 !important; border-radius: 14px !important; font-weight: 700; padding: .8rem 1rem; box-shadow: 0 14px 28px -12px rgba(109,94,252,.8); transition: transform .15s, filter .2s; }
body .auth-btn:hover { transform: translateY(-2px); filter: brightness(1.07); }
