/* ===========================================================
   Entegre Fatura — Ortak Tasarım Sistemi
   Bootstrap 5 üzerine kurumsal override katmanı
   Primary: #0E69BE
   =========================================================== */

:root {
  /* Kurumsal renkler */
  --ef-primary: #0E69BE;
  --ef-primary-rgb: 14, 105, 190;
  --ef-primary-dark: #0a4f90;
  --ef-primary-darker: #083d70;
  --ef-primary-soft: #e7f1fa;
  --ef-primary-soft-2: #f2f8fd;

  --ef-ink: #1b2733;
  --ef-ink-soft: #51606e;
  --ef-muted: #7d8a98;
  --ef-line: #e7ebf0;
  --ef-bg: #ffffff;
  --ef-bg-alt: #f8f9fa;

  /* Bootstrap değişken ezmeleri */
  --bs-primary: #0E69BE;
  --bs-primary-rgb: 14, 105, 190;
  --bs-link-color: #0E69BE;
  --bs-link-color-rgb: 14, 105, 190;
  --bs-link-hover-color: #0a4f90;
  --bs-link-hover-color-rgb: 10, 79, 144;
  --bs-body-color: #1b2733;
  --bs-body-bg: #ffffff;
  --bs-border-color: #e7ebf0;
  --bs-border-radius: .6rem;
  --bs-border-radius-lg: .85rem;
  --bs-border-radius-xl: 1.1rem;
}

* { -webkit-font-smoothing: antialiased; }

body {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: var(--ef-ink);
  background: var(--ef-bg);
  letter-spacing: -0.01em;
}

/* ---------- Tipografi ---------- */
h1, h2, h3, h4, h5, h6, .display-1, .display-2, .display-3, .display-4, .display-5, .display-6 {
  letter-spacing: -0.025em;
  color: var(--ef-ink);
}
.fw-650 { font-weight: 650; }
.text-balance { text-wrap: balance; }
.text-pretty { text-wrap: pretty; }
.lead-ef { font-size: 1.18rem; line-height: 1.65; color: var(--ef-ink-soft); }
.eyebrow {
  font-size: .78rem;
  font-weight: 650;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ef-primary);
}

/* ---------- Renk yardımcıları ---------- */
.text-primary { color: var(--ef-primary) !important; }
.text-ink { color: var(--ef-ink) !important; }
.text-ink-soft { color: var(--ef-ink-soft) !important; }
.text-muted-ef { color: var(--ef-muted) !important; }
.bg-soft { background-color: var(--ef-primary-soft) !important; }
.bg-soft-2 { background-color: var(--ef-primary-soft-2) !important; }
.bg-alt { background-color: var(--ef-bg-alt) !important; }
.bg-ink { background-color: #0f1722 !important; }

/* ---------- Butonlar ---------- */
.btn { font-weight: 600; border-radius: .55rem; padding: .55rem 1.1rem; transition: all .16s ease; }
.btn-lg { padding: .8rem 1.6rem; font-size: 1.02rem; }
.btn-primary {
  background-color: var(--ef-primary);
  border-color: var(--ef-primary);
  box-shadow: 0 1px 2px rgba(var(--ef-primary-rgb), .25);
}
.btn-primary:hover, .btn-primary:focus {
  background-color: var(--ef-primary-dark);
  border-color: var(--ef-primary-dark);
}
.btn-primary:active { background-color: var(--ef-primary-darker) !important; border-color: var(--ef-primary-darker) !important; }
.btn-outline-primary { color: var(--ef-primary); border-color: var(--ef-primary); }
.btn-outline-primary:hover { background-color: var(--ef-primary); border-color: var(--ef-primary); }
.btn-soft {
  background-color: var(--ef-primary-soft);
  color: var(--ef-primary-dark);
  border: 1px solid transparent;
}
.btn-soft:hover { background-color: #d6e8f7; color: var(--ef-primary-darker); }
.btn-light-ef { background:#fff; border:1px solid var(--ef-line); color: var(--ef-ink); }
.btn-light-ef:hover { background: var(--ef-bg-alt); }

/* ---------- Logo işareti ---------- */
.ef-logo { display: inline-flex; align-items: center; gap: .6rem; font-weight: 700; color: var(--ef-ink); text-decoration: none; letter-spacing: -.02em; }
.ef-logo:hover { color: var(--ef-ink); }
.ef-mark {
  width: 34px; height: 34px;
  border-radius: 9px;
  display: grid; place-items: center;
  background: linear-gradient(145deg, #1a78cf, #0a4f90);
  color: #fff; font-size: 1.05rem;
  box-shadow: 0 4px 10px rgba(var(--ef-primary-rgb), .35);
}
.ef-logo .ef-name { font-size: 1.08rem; }
.ef-logo .ef-name small { display:block; font-size:.62rem; font-weight:600; letter-spacing:.14em; color: var(--ef-muted); text-transform: uppercase; margin-top:-2px; }

/* ---------- Navbar (frontend) ---------- */
.ef-navbar {
  background: rgba(255,255,255,.85);
  backdrop-filter: saturate(180%) blur(12px);
  border-bottom: 1px solid var(--ef-line);
}
.ef-navbar .nav-link {
  color: var(--ef-ink-soft);
  font-weight: 550;
  padding: .4rem .9rem !important;
  border-radius: .45rem;
}
.ef-navbar .nav-link:hover { color: var(--ef-primary); background: var(--ef-primary-soft-2); }
.ef-navbar .nav-link.active { color: var(--ef-primary); font-weight: 650; }

/* ---------- Kartlar ---------- */
.card { border-color: var(--ef-line); border-radius: var(--bs-border-radius-lg); }
.card-soft {
  border: 1px solid var(--ef-line);
  border-radius: var(--bs-border-radius-xl);
  background: #fff;
  box-shadow: 0 1px 2px rgba(16,32,48,.04);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.card-soft:hover { box-shadow: 0 18px 40px -22px rgba(16,32,48,.30); border-color: #d7dee6; }
.card-lift:hover { transform: translateY(-4px); }

.shadow-ef { box-shadow: 0 24px 60px -30px rgba(16,32,48,.40) !important; }
.shadow-ef-sm { box-shadow: 0 6px 20px -10px rgba(16,32,48,.22) !important; }

/* ---------- İkon kutusu ---------- */
.ef-ico {
  width: 52px; height: 52px;
  border-radius: 14px;
  display: grid; place-items: center;
  font-size: 1.45rem;
  background: var(--ef-primary-soft);
  color: var(--ef-primary);
}
.ef-ico-sm { width: 42px; height: 42px; border-radius: 11px; font-size: 1.15rem; }
.ef-ico-ink { background:#eef2f6; color: var(--ef-ink); }
.ef-ico-success { background:#e3f5ec; color:#1a8a55; }
.ef-ico-warn { background:#fdf1e1; color:#bd7d18; }

/* ---------- Bölüm aralıkları (ferah) ---------- */
.section { padding-top: 6rem; padding-bottom: 6rem; }
.section-sm { padding-top: 4rem; padding-bottom: 4rem; }
@media (max-width: 768px){ .section { padding-top:4rem; padding-bottom:4rem; } }

/* ---------- Rozetler ---------- */
.badge-soft { background: var(--ef-primary-soft); color: var(--ef-primary-dark); font-weight:600; }
.badge-dot { display:inline-flex; align-items:center; gap:.4rem; }
.badge-dot::before { content:""; width:7px;height:7px;border-radius:50%; background: currentColor; }

.pill {
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.4rem .85rem; border-radius:100px;
  background:#fff; border:1px solid var(--ef-line);
  font-size:.85rem; font-weight:600; color: var(--ef-ink-soft);
}
.pill i { color: var(--ef-primary); }

/* ---------- Hero ---------- */
.hero-bg {
  background:
    radial-gradient(1200px 480px at 78% -8%, rgba(var(--ef-primary-rgb),.10), transparent 60%),
    radial-gradient(900px 420px at 0% 0%, rgba(var(--ef-primary-rgb),.06), transparent 55%),
    var(--ef-bg);
}
.hero-grid-bg {
  background-color: var(--ef-bg-alt);
  background-image:
    linear-gradient(rgba(14,105,190,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(14,105,190,.05) 1px, transparent 1px);
  background-size: 34px 34px;
}

/* ---------- Simüle uygulama ekranı (mockup) ---------- */
.mock-window {
  border-radius: 16px;
  border: 1px solid var(--ef-line);
  background: #fff;
  overflow: hidden;
  box-shadow: 0 40px 90px -40px rgba(16,32,48,.45);
}
.mock-bar {
  display:flex; align-items:center; gap:.45rem;
  padding:.7rem .9rem; border-bottom:1px solid var(--ef-line);
  background: #fbfcfd;
}
.mock-dot { width:11px;height:11px;border-radius:50%; }
.mock-url {
  margin-left:.6rem; flex:1; height:24px; border-radius:7px;
  background:#eef2f6; display:flex; align-items:center; padding:0 .6rem;
  font-size:.72rem; color: var(--ef-muted);
}
.mock-row { display:flex; align-items:center; gap:.7rem; padding:.6rem .2rem; border-bottom:1px dashed var(--ef-line); }
.mock-skeleton { height:9px; border-radius:6px; background:#eef2f6; }

/* mini bar grafik (saf div) */
.spark { display:flex; align-items:flex-end; gap:6px; height:64px; }
.spark > span { flex:1; border-radius:5px 5px 2px 2px; background: var(--ef-primary-soft); }
.spark > span.on { background: var(--ef-primary); }

/* ---------- Adım numarası ---------- */
.step-num {
  width:40px;height:40px;border-radius:12px;
  display:grid;place-items:center;
  background: var(--ef-primary); color:#fff; font-weight:700;
  box-shadow:0 6px 16px -6px rgba(var(--ef-primary-rgb),.6);
}
.step-line { position:absolute; }

/* ---------- Liste işareti ---------- */
.list-check { list-style:none; padding-left:0; margin:0; }
.list-check li { display:flex; gap:.7rem; align-items:flex-start; padding:.45rem 0; color: var(--ef-ink-soft); }
.list-check li i { color: var(--ef-primary); margin-top:.2rem; }

/* ---------- Footer ---------- */
.ef-footer { background:#0f1722; color:#aeb9c5; }
.ef-footer a { color:#c4cdd8; text-decoration:none; }
.ef-footer a:hover { color:#fff; }
.ef-footer h6 { color:#fff; font-size:.8rem; letter-spacing:.1em; text-transform:uppercase; }

/* ---------- Accordion ---------- */
.accordion-button { font-weight:600; color: var(--ef-ink); }
.accordion-button:not(.collapsed) { color: var(--ef-primary); background: var(--ef-primary-soft-2); box-shadow:none; }
.accordion-button:focus { box-shadow:none; border-color: var(--ef-line); }
.accordion-item { border-color: var(--ef-line); border-radius: var(--bs-border-radius-lg)!important; margin-bottom:.75rem; overflow:hidden; }

/* ---------- Form ---------- */
.form-control, .form-select { border-color: var(--ef-line); padding:.6rem .8rem; border-radius:.55rem; }
/* Bootstrap açılır ok ikonu için sağ boşluğu koru (yoksa ok yazının üstüne biner) */
.form-select { padding-right: 2.25rem; background-position: right .75rem center; }
.form-control:focus, .form-select:focus { border-color: var(--ef-primary); box-shadow: 0 0 0 .2rem rgba(var(--ef-primary-rgb),.15); }
.form-label { font-weight:600; font-size:.9rem; color: var(--ef-ink); }

/* ---------- Fiyatlandırma ---------- */
.price-card { border:1px solid var(--ef-line); border-radius: var(--bs-border-radius-xl); background:#fff; }
.price-card.featured { border:2px solid var(--ef-primary); box-shadow:0 30px 70px -36px rgba(var(--ef-primary-rgb),.55); position:relative; }
.price-card .price-amount { font-size:2.8rem; font-weight:750; letter-spacing:-.03em; }
.ribbon {
  position:absolute; top:-13px; left:50%; transform:translateX(-50%);
  background: var(--ef-primary); color:#fff; font-size:.72rem; font-weight:650;
  padding:.35rem .9rem; border-radius:100px; letter-spacing:.04em;
  box-shadow:0 8px 18px -8px rgba(var(--ef-primary-rgb),.7);
}

/* ---------- Logos / güven şeridi ---------- */
.trust-logo { color: var(--ef-muted); font-weight:700; font-size:1.1rem; opacity:.7; letter-spacing:-.02em; }

/* utilities */
.rounded-2xl { border-radius: 1.1rem !important; }
.border-soft { border-color: var(--ef-line) !important; }
.divider-y { border-top:1px solid var(--ef-line); }
.cursor-pointer { cursor:pointer; }