/* =====================================================================
   ARACIM NAKİT — THEME 2026  ("Nakit Teal")
   Tek katmanlı tasarım sistemi. custom.css + step.css'ten SONRA yüklenir,
   bu yüzden değişkenleri ve bileşenleri güvenle override eder.
   Geri almak için: css_link() içindeki theme-2026.css satırını sil.
   ===================================================================== */

/* ---------------------------------------------------------------------
   1) TASARIM TOKENLARI (yeni marka paleti)
   --------------------------------------------------------------------- */
:root {
  --primary-color1: #12b886;   /* ana teal-yeşil */
  --primary-color2: #0f2e3d;   /* koyu lacivert (ink) */
  --primary-rgb: 18, 184, 134; /* home.php sticky bar bunu kullanıyor (eskiden tanımsızdı) */

  --brand: #12b886;
  --brand-600: #0ea578;
  --brand-700: #0b8a64;
  --brand-050: #e7f8f1;

  --ink: #0f2e3d;
  --ink-800: #163b4d;

  --accent: #ffb020;         /* amber — birincil CTA vurgusu */
  --accent-600: #f59e0b;
  --accent-rgb: 255, 176, 32;

  --text: #1f2b37;
  --muted: #6b7b8a;
  --line: #e6ecf1;
  --bg-soft: #f4fbf8;

  --radius-lg: 18px;
  --radius: 14px;
  --radius-sm: 10px;

  --shadow-sm: 0 2px 8px rgba(15, 46, 61, .06);
  --shadow: 0 10px 30px rgba(15, 46, 61, .08);
  --shadow-lg: 0 18px 50px rgba(15, 46, 61, .14);
  --shadow-brand: 0 10px 26px rgba(18, 184, 134, .28);
}

body {
  color: var(--text);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Seçim & odak durumları */
::selection { background: rgba(var(--primary-rgb), .18); }
a { transition: color .2s ease; }
:focus-visible {
  outline: 3px solid rgba(var(--primary-rgb), .35);
  outline-offset: 2px;
  border-radius: 6px;
}

/* ---------------------------------------------------------------------
   2) MAVİ ARTIKLARINI TEMİZLE (eski şablondan kalan renkler)
   --------------------------------------------------------------------- */
.mobile-progress-bar .progress-bar,
.progress .progress-bar {
  background: linear-gradient(90deg, var(--brand), var(--brand-700)) !important;
}
.glass-btn.phone { background: linear-gradient(135deg, var(--ink), var(--ink-800)) !important; }
.main-cta-btn { background: linear-gradient(135deg, var(--brand), var(--brand-700)) !important; box-shadow: var(--shadow-brand) !important; }

/* ---------------------------------------------------------------------
   3) BUTONLAR
   --------------------------------------------------------------------- */
.btn-primary,
.btn-submit,
.btn-evaluate,
.home-cta-main-btn {
  background: linear-gradient(135deg, var(--brand), var(--brand-700)) !important;
  border: none !important;
  color: #fff !important;
  font-weight: 700 !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow-brand);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease !important;
}
.btn-primary:hover,
.btn-submit:hover,
.btn-evaluate:hover,
.home-cta-main-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(18, 184, 134, .36);
  filter: brightness(1.03);
}
.btn-primary:active,
.btn-submit:active,
.btn-evaluate:active { transform: translateY(0); }

/* Amber vurgulu birincil CTA (opsiyonel: .btn-accent) */
.btn-accent {
  background: linear-gradient(135deg, var(--accent), var(--accent-600)) !important;
  color: #14202b !important;
  border: none !important;
  font-weight: 800 !important;
  border-radius: var(--radius) !important;
  box-shadow: 0 10px 26px rgba(var(--accent-rgb), .35);
}
.btn-accent:hover { transform: translateY(-2px); }

/* Header CTA */
.btn-degerleme-nav {
  background: linear-gradient(135deg, var(--brand), var(--brand-700)) !important;
  color: #fff !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  box-shadow: var(--shadow-brand);
}
.btn-degerleme-nav:hover { transform: translateY(-1px); filter: brightness(1.04); }

/* ---------------------------------------------------------------------
   4) HEADER
   --------------------------------------------------------------------- */
.main-header {
  background: rgba(255, 255, 255, .88);
  backdrop-filter: saturate(160%) blur(10px);
  -webkit-backdrop-filter: saturate(160%) blur(10px);
  border-bottom: 1px solid var(--line);
  box-shadow: 0 2px 14px rgba(15, 46, 61, .05);
}
.main-menu > li > a {
  font-weight: 600;
  color: var(--ink);
  position: relative;
}
.main-menu > li > a::after {
  content: "";
  position: absolute; left: 0; bottom: -6px;
  width: 0; height: 2px; border-radius: 2px;
  background: var(--brand);
  transition: width .22s ease;
}
.main-menu > li > a:hover { color: var(--brand-700); }
.main-menu > li > a:hover::after { width: 100%; }

/* ---------------------------------------------------------------------
   5) KART BİLEŞENLERİ (feature / appraisal / blog)
   --------------------------------------------------------------------- */
.feature-card,
.appraisal-card,
.blog-card,
.testimonial-card {
  border-radius: var(--radius-lg) !important;
  border: 1px solid var(--line) !important;
  box-shadow: var(--shadow-sm) !important;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease !important;
}
.feature-card:hover,
.appraisal-card:hover,
.blog-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-lg) !important;
  border-color: rgba(var(--primary-rgb), .35) !important;
}

.feature-icon,
.feature-card .feature-icon {
  background: var(--brand-050) !important;
  color: var(--brand-700) !important;
  border-radius: 16px !important;
}

/* Blog "devamını oku" & tarih rozeti */
.read-more { color: var(--brand-700) !important; font-weight: 700; }
.read-more:hover { color: var(--brand) !important; }
.blog-date span,
.appraisal-card .step-number,
.step-number {
  background: linear-gradient(135deg, var(--brand), var(--brand-700)) !important;
  color: #fff !important;
}

/* ---------------------------------------------------------------------
   6) HERO (anasayfa slider formu)
   --------------------------------------------------------------------- */
.hero-slider-overlay {
  background: linear-gradient(180deg, rgba(15, 46, 61, .30), rgba(15, 46, 61, .68)) !important;
}
.hero-title {
  font-weight: 800 !important;
  letter-spacing: -.5px;
  text-shadow: 0 4px 24px rgba(0, 0, 0, .35);
}
.hero-form-box {
  background: rgba(255, 255, 255, .96) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow-lg) !important;
  border: 1px solid rgba(255, 255, 255, .6);
}
.hero-form-inline .form-select { border-radius: var(--radius) !important; }
.btn-evaluate { border-radius: var(--radius) !important; }

/* ---------------------------------------------------------------------
   7) BÖLÜM BAŞLIKLARI
   --------------------------------------------------------------------- */
.features-title,
.digital-appraisal-header h2,
.custom-blog-title,
.home-testimonials-header h2 {
  color: var(--ink) !important;
  font-weight: 800 !important;
  letter-spacing: -.4px;
}
.section-badge,
.blog-icon {
  background: var(--brand-050) !important;
  color: var(--brand-700) !important;
}

/* İstatistik bölümü */
.home-stats-section { background: var(--ink) !important; }
.home-stat-number, .home-stat-suffix { color: #fff !important; }
.home-stat-icon { color: var(--brand) !important; }
.home-stat-label { color: rgba(255, 255, 255, .8) !important; }

/* Testimonial yıldızları */
.testimonial-stars i { color: var(--accent) !important; }
.testimonial-avatar { color: var(--brand) !important; }

/* ---------------------------------------------------------------------
   8) CTA BANNER (anasayfa alt)
   --------------------------------------------------------------------- */
.home-cta-banner {
  background: linear-gradient(135deg, var(--ink), #0b3a4a) !important;
}
.home-cta-text h2 span { color: var(--accent) !important; }
.home-cta-benefits li i { color: var(--brand) !important; }
.home-cta-main-btn {
  background: linear-gradient(135deg, var(--accent), var(--accent-600)) !important;
  color: #14202b !important;
  font-weight: 800 !important;
}
.home-cta-phone-btn {
  background: rgba(255, 255, 255, .12) !important;
  border: 1px solid rgba(255, 255, 255, .28) !important;
  color: #fff !important;
  border-radius: var(--radius) !important;
}

/* ---------------------------------------------------------------------
   9) FOOTER
   --------------------------------------------------------------------- */
.footer { background: var(--ink) !important; }
.footer-title { color: #fff !important; }
.footer-links a,
.footer-contact-info a,
.footer-contact-info p { color: rgba(255, 255, 255, .78) !important; }
.footer-links a:hover { color: var(--brand) !important; }
.footer-links a i { color: var(--brand) !important; }
.footer-contact-icon {
  background: rgba(18, 184, 134, .15) !important;
  color: var(--brand) !important;
}
.footer-social .social-link {
  background: rgba(255, 255, 255, .1) !important;
  color: #fff !important;
  transition: background .2s ease, transform .2s ease;
}
.footer-social .social-link:hover { background: var(--brand) !important; transform: translateY(-2px); }
.footer-bottom { background: rgba(0, 0, 0, .2) !important; }
.footer-copyright, .footer-copyright a { color: rgba(255, 255, 255, .6) !important; }

/* ---------------------------------------------------------------------
   10) DEĞERLEME ADIMLARI — seçim döşemeleri (kolay tıklama)
   --------------------------------------------------------------------- */
.form-list-select li {
  border: 1.5px solid var(--line) !important;
  border-radius: var(--radius) !important;
  background: #fff !important;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease !important;
  cursor: pointer;
}
.form-list-select li:hover {
  border-color: var(--brand) !important;
  background: var(--brand-050) !important;
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(18, 184, 134, .16) !important;
}
.form-list-select li.active,
.form-list-select li.selected {
  border-color: var(--brand) !important;
  background: var(--brand-050) !important;
  box-shadow: 0 8px 20px rgba(18, 184, 134, .2) !important;
}

/* Marka logo grid — seçili & hover teal olsun (step-1 inline stilini düzeltir) */
.brand-logo-item:hover,
.brand-logo-item.selected {
  border-color: var(--brand) !important;
  background: var(--brand-050) !important;
  box-shadow: 0 8px 20px rgba(18, 184, 134, .18) !important;
}

/* Üst adım göstergesi (1-2-3-4) */
.simple-steps .step.active .circle {
  background: linear-gradient(135deg, var(--brand), var(--brand-700)) !important;
  color: #fff !important;
  box-shadow: var(--shadow-brand);
}
.simple-steps .step .circle {
  border: 2px solid var(--line);
  color: var(--muted);
}

/* Özet kutusu (step-2..5 sağ sütun) */
.degerleme-summary-box {
  border-radius: var(--radius-lg) !important;
  border: 1px solid var(--line) !important;
  box-shadow: var(--shadow) !important;
}
.degerleme-summary-box .summary-list li b { color: var(--brand-700) !important; }

/* Form inputları */
.modern-form .form-control,
.form-control.custom-select,
.kmsInput {
  border-radius: var(--radius) !important;
  border: 1.5px solid var(--line) !important;
  transition: border-color .18s ease, box-shadow .18s ease !important;
}
.modern-form .form-control:focus,
.form-control:focus {
  border-color: var(--brand) !important;
  box-shadow: 0 0 0 4px rgba(var(--primary-rgb), .12) !important;
}
.input-icon i { color: var(--brand-700) !important; }
.radio-label input:checked + .radio-text {
  color: var(--brand-700) !important;
  font-weight: 700;
}

/* Accordion (SSS) */
.accordion-button:not(.collapsed) {
  color: var(--brand-700) !important;
  background: var(--brand-050) !important;
}
.accordion-button:focus { box-shadow: 0 0 0 4px rgba(var(--primary-rgb), .12) !important; }

/* Alert */
.alert-danger {
  border-radius: var(--radius) !important;
  border: 1px solid #fecaca !important;
}

/* ---------------------------------------------------------------------
   11) LANDING PAGE MODU (body.lp-mode) — reklam trafiği için sade sayfa
   --------------------------------------------------------------------- */
body.lp-mode .main-header .nav-area,
body.lp-mode .mobile-menu-btn,
body.lp-mode .footer-top,
body.lp-mode .mobile-nav-wrapper { display: none !important; }
body.lp-mode .main-header .btn-degerleme-nav { display: none !important; }
body.lp-mode .header-wrapper { justify-content: center; }
body.lp-mode .footer { background: var(--ink) !important; }
body.lp-mode .footer-bottom { border-top: none; }