/* =========================
   DARK PREMIUM THEME (FINAL)
========================= */
:root{
  --bg1:#0b1020;
  --bg2:#070a12;

  --glass: rgba(255,255,255,.055);
  --glass2: rgba(255,255,255,.10);

  --b: rgba(255,255,255,.12);
  --b2: rgba(255,255,255,.08);

  --t: rgba(255,255,255,.92);
  --ts: rgba(255,255,255,.68);

  --shadow: 0 18px 40px rgba(0,0,0,.40);
  --glow: 0 0 0 1px rgba(255,255,255,.10), 0 22px 55px rgba(0,0,0,.55);

  --radius: 22px;

  --focus: rgba(120,70,255,.55);
  --focusRing: rgba(120,70,255,.18);

  /* Bootstrap table overrides */
  --bs-table-bg: transparent;
  --bs-table-striped-bg: rgba(255,255,255,.03);
  --bs-table-hover-bg: rgba(255,255,255,.05);
  --bs-table-color: var(--t);
  --bs-body-bg: transparent;
  --bs-body-color: var(--t);
}

html{ color-scheme: dark; scrollbar-gutter: stable; }
html, body { overflow-x: hidden; }

body{
  background:
    radial-gradient(900px 520px at 15% 0%, rgba(120,70,255,0.22), transparent 60%),
    radial-gradient(900px 520px at 85% 10%, rgba(0,190,255,0.18), transparent 55%),
    radial-gradient(800px 520px at 50% 90%, rgba(255,80,180,0.10), transparent 60%),
    linear-gradient(180deg, var(--bg1) 0%, var(--bg2) 100%);
  color: var(--t);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  letter-spacing: .15px;
}

.text-secondary{ color: var(--ts) !important; }
.text-strong{ color: rgba(255,255,255,.92); }

h1,h2,h3,h4,h5,h6{ color: rgba(255,255,255,.95) !important; }

/* =========================
   NAVBAR
========================= */
.navbar-glass{
  background: rgba(10,14,24,0.65) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--b2) !important;
}
.navbar-glass .navbar-brand,
.navbar-glass a{ color: var(--t) !important; }

/* External include layout */
.navbar-glass .nav-top{
  width: 100%;
  display:flex;
  align-items:center;
  gap:.75rem;
}
.navbar-glass .nav-left{
  display:flex;
  align-items:center;
  gap:.5rem;
  min-width:0;
  flex: 0 0 auto;
}
.navbar-glass .nav-mid{
  flex: 1 1 auto;
  min-width: 0;
  display:flex;
  justify-content:center;
}
.navbar-glass .nav-right{
  flex: 0 0 auto;
  margin-left: auto;       /* kritik */
  display:flex;
  align-items:center;
  gap:.5rem;
  white-space: nowrap;
}

/* Logo */
.brand-logo{ width:28px; height:28px; display:inline-block; }

/* Search wrap */
.search-wrap{
  width: min(420px, 60vw);
  max-width: 100%;
}
@media (max-width: 768px){
  .navbar-glass .container{ flex-wrap: wrap; }
  .navbar-glass .btn{ padding:.35rem .65rem; font-size:.9rem; }
  .search-wrap{ width: 100%; max-width: 100%; }
}
.nav-search-mobile{ width:100%; margin-top:.5rem; }

/* Hamburger */
.hamburger{
  display:inline-flex;
  flex-direction:column;
  justify-content:center;
  gap:3px;
}
.hamburger span{
  display:block;
  width:16px;
  height:2px;
  background:currentColor;
  border-radius:2px;
}

/* Telefon ikonu */
.icon-phone{ width:16px; height:16px; display:inline-block; margin-right:6px; }

/* Sağ buton grubu */
.nav-actions{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
}

/* Search input + icon btn (dark uyumlu) */
.search-with-btn{ position: relative; }
.search-with-btn input{ padding-right: 44px; }
.search-btn{
  position:absolute;
  top:50%;
  right:8px;
  transform: translateY(-50%);

  width: 34px;
  height: 34px;

  border: 1px solid rgba(255,255,255,.14);
  border-radius: 10px;
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.85);

  display:flex;
  align-items:center;
  justify-content:center;

  cursor: pointer;
  transition: transform .15s ease, background .15s ease, border-color .15s ease;
}
.search-btn:hover{
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.22);
  transform: translateY(-50%) scale(1.04);
}

/* Offcanvas */
.offcanvas-backdrop.show{ opacity:.85; background:#000; }
.offcanvas{
  background: rgba(10,14,24,.96);
  color:#fff;
  border-left:1px solid rgba(255,255,255,.08);
}
.offcanvas .offcanvas-title{ color:#fff; }
.offcanvas .btn-close{ filter: invert(1); opacity: .9; }

/* =========================
   INPUTS
========================= */
.form-control-modern,
.form-control{
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12) !important;
  background: rgba(255,255,255,.06) !important;
  color: var(--t) !important;
  box-shadow: none !important;
}
.form-control::placeholder{ color: rgba(255,255,255,.55) !important; }
.form-control:focus{
  border-color: var(--focus) !important;
  box-shadow: 0 0 0 .25rem var(--focusRing) !important;
}
.form-label{ color: rgba(255,255,255,.72) !important; }

/* =========================
   BUTTONS
========================= */
.btn-ghost{
  border: 1px solid rgba(255,255,255,.14) !important;
  background: rgba(255,255,255,.05) !important;
  color: var(--t) !important;
  border-radius: 999px !important;
  transition: transform .15s ease, background .15s ease, border-color .15s ease;
}
.btn-ghost:hover{
  background: rgba(255,255,255,.09) !important;
  border-color: rgba(255,255,255,.22) !important;
  transform: translateY(-1px);
}

.btn-outline-dark{
  color: var(--t) !important;
  border-color: rgba(255,255,255,.18) !important;
}
.btn-outline-dark:hover{
  background: rgba(255,255,255,.10) !important;
  border-color: rgba(255,255,255,.26) !important;
}

.btn-dark{
  background: rgba(255,255,255,.14) !important;
  border-color: rgba(255,255,255,.18) !important;
  color: #fff !important;
}
.btn-dark:hover{
  background: rgba(255,255,255,.20) !important;
  border-color: rgba(255,255,255,.26) !important;
}

.btn-whatsapp{
  background:#1DB954 !important;
  border-color:#1DB954 !important;
  color:#fff !important;
}
.btn-whatsapp:hover{
  background:#17a148 !important;
  border-color:#17a148 !important;
}

/* =========================
   HERO
========================= */
.hero{ background: transparent; }
.hero-card{
  background: var(--glass);
  border: 1px solid var(--b);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
.hero-kicker{
  display:inline-block;
  font-size:.80rem;
  padding:.25rem .6rem;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.05);
  color: var(--t);
  margin-bottom: .6rem;
}

/* =========================
   CARDS / PREMIUM
========================= */
.card,
.card-glass{
  background: var(--glass) !important;
  border: 1px solid var(--b) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow) !important;
  color: var(--t) !important;
}
.card-body{ background: transparent !important; }

.premium-card{
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  will-change: transform;
}
.premium-card:hover{
  transform: translateY(-4px);
  box-shadow: var(--glow) !important;
  border-color: rgba(255,255,255,.18) !important;
}

.badge-soft{
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.14);
  color: #fff;
}
.badge-green{
  background: rgba(25,135,84,.35);
  border: 1px solid rgba(25,135,84,.40);
  color: #fff;
}

/* =========================
   CATEGORY COVER
========================= */
.cat-section{ scroll-margin-top: 90px; }

.cat-cover{
  position:relative;
  height:170px;
  overflow:hidden;
  background:#111;
  border-top-left-radius: var(--radius);
  border-top-right-radius: var(--radius);
}
.cat-cover img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transform: scale(1.05);
  transition: transform .5s ease;
  filter: saturate(1.05) contrast(1.05);
}
.premium-card:hover .cat-cover img{ transform: scale(1.12); }

.cat-cover-overlay{
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.84));
}
.cat-cover-content{
  position:absolute; inset:0;
  padding:16px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
}

/* =========================
   TABLE + PRICE PILL
========================= */
.table{ color: var(--t) !important; background: transparent !important; }
.table > :not(caption) > * > *{
  background: transparent !important;
  color: var(--t) !important;
}
.table thead th{
  color: rgba(255,255,255,.65) !important;
  border-bottom: 1px solid rgba(255,255,255,.12) !important;
}
.table tbody td{ border-top: 1px solid rgba(255,255,255,.08) !important; }
.table tbody tr:hover{ background: rgba(255,255,255,.05) !important; }

.price-pill{
    display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  line-height: 1;
  padding:.35rem .65rem;
  border-radius:999px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  font-weight: 800;
  color:#fff !important;
  box-shadow: 0 10px 20px rgba(0,0,0,.25);
}
.table-modern td.text-end{
  white-space: nowrap;
}
/* Mobilde sütun daralınca da kırılmasın, taşabilsin */
@media (max-width: 576px){
  .table-modern td.text-end{
    white-space: nowrap;    /* sağ sütunda da kırma */
  }

  /* İstersen sağdan sola taşmaya daha yatkın olsun */
  .price-pill{
    max-width: none;        /* kısıt varsa kaldır */
  }
}

.table-scroll{ max-height:340px; overflow:auto; }

/* Scrollbar */
.table-scroll::-webkit-scrollbar{ width: 8px; }
.table-scroll::-webkit-scrollbar-thumb{
  background: rgba(255,255,255,0.18);
  border-radius: 999px;
}
.table-scroll::-webkit-scrollbar-track{
  background: rgba(255,255,255,.06);
}

/* =========================
   SECTIONS
========================= */
.section-title{
  font-size: 1.15rem;
  font-weight: 800;
  color: rgba(255,255,255,.95);
}
.section-text{
  margin-top: .5rem;
  color: var(--ts);
  line-height: 1.85;
}

.mini-card{
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 18px;
  padding: 14px;
  background: rgba(255,255,255,0.04);
}

/* =========================
   LOCATIONS (CLEAN, SINGLE SOURCE)
========================= */
.loc-card{
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  border-radius: 18px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  box-shadow: 0 18px 40px rgba(0,0,0,.28);
  min-height: 210px;
}

.loc-head{
  display:flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
}

.loc-title{
  font-weight: 800;
  color: rgba(255,255,255,.92);
}

.loc-phone{
  font-weight: 700;
  color: rgba(255,255,255,.82);
  white-space: nowrap;
  opacity: .95;
}

.loc-body{
  flex: 1;
  line-height: 1.6;
  color: rgba(255,255,255,.80);
}

.loc-actions{
  display:flex;
  gap: 8px;
  margin-top: auto;
}

/* Eski map alanı kullanıyorsan */
.loc-map{
  position: relative;
  background: rgba(0,0,0,.35);
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.10);
}
.loc-map iframe{ width: 100%; height: 100%; }
.loc-map-overlay{
  pointer-events: none;
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.35));
}
.loc-map-placeholder{
  height: 180px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction: column;
  gap: 10px;
  background:
    radial-gradient(600px 260px at 30% 10%, rgba(120,70,255,.18), transparent 60%),
    radial-gradient(600px 260px at 80% 20%, rgba(0,190,255,.14), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
}
.loc-pin{
  width: 18px; height: 18px;
  border-radius: 999px;
  background: rgba(255,255,255,.85);
  box-shadow: 0 0 0 6px rgba(120,70,255,.18);
}
.loc-map-text{
  color: rgba(255,255,255,.72);
  font-size: .9rem;
}

/* =========================
   ALERTS
========================= */
.alert{
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,0.10);
}
.alert-warning{
  background: rgba(255,193,7,.14) !important;
  color: rgba(255,255,255,.92) !important;
  border-color: rgba(255,193,7,.18) !important;
}
.alert-success{
  background: rgba(25,135,84,0.18) !important;
  color: rgba(255,255,255,.92) !important;
}
.alert-danger{
  background: rgba(220,53,69,0.18) !important;
  color: rgba(255,255,255,.92) !important;
}

/* =========================
   MODAL
========================= */
.modal-content{
  background: rgba(12,16,28,0.92);
  border: 1px solid rgba(255,255,255,0.10);
  color: #fff;
  border-radius: 18px;
}
.modal-header{ border-bottom: 1px solid rgba(255,255,255,0.10); }
.btn-close{ filter: invert(1); opacity: .9; }

/* =========================
   FOOTER (PREMIUM DARK)
========================= */
footer,
.site-footer{
  background: rgba(10,14,24,0.55) !important;
  border-top: 1px solid rgba(255,255,255,0.08) !important;
  color: rgba(255,255,255,.78);
}

.footer-container{
  max-width: 1200px;
  margin: auto;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 40px;
  padding: 0 20px;
}

.footer-col h4{
  color: rgba(255,255,255,.92);
  margin-bottom: 15px;
  font-size: 16px;
  letter-spacing: .2px;
}

.footer-col ul{ list-style: none; padding: 0; }
.footer-col ul li{ margin-bottom: 8px; }

.footer-col ul li a{
  color: rgba(255,255,255,.70);
  text-decoration: none;
  transition: .25s ease;
}
.footer-col ul li a:hover{
  color: rgba(255,255,255,.95);
}

/* Footer – küçük blog list */
.footer-blog-list{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.footer-blog-item{
  display:flex;
  gap:10px;
  text-decoration:none;
  align-items:flex-start;
  padding: 8px;
  border-radius: 12px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.06);
  transition: transform .18s ease, background .18s ease, border-color .18s ease;
}
.footer-blog-item:hover{
  transform: translateY(-2px);
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.10);
}
.footer-blog-item img{
  width:54px;
  height:54px;
  object-fit:cover;
  border-radius:10px;
  flex-shrink:0;
}
.footer-blog-text{ display:flex; flex-direction:column; }
.footer-blog-title{
  color: rgba(255,255,255,.88);
  font-size:13px;
  line-height:1.35;
  max-height:2.7em;
  overflow:hidden;
}
.footer-blog-date{
  font-size:11px;
  color: rgba(255,255,255,.55);
  margin-top:2px;
}

/* Footer link butonları */
.footer-links{
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.footer-links li a{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 12px;

  color: rgba(255,255,255,.82);
  text-decoration: none;

  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  transition: transform .18s ease, background .18s ease, border-color .18s ease;
}
.footer-links li a .icon{ font-size: 1rem; opacity: 0.85; }
.footer-links li a .text{ font-weight: 500; letter-spacing: 0.2px; }
.footer-links li a:hover{
  background: rgba(255,255,255,0.06);
  border-color: rgba(120,70,255,.35);
  transform: translateX(4px);
}
.footer-links li a.active{
  background: rgba(120,70,255,.14);
  border-color: rgba(120,70,255,.28);
  color: #fff;
}

/* Footer bottom */
.footer-bottom{
  border-top: 1px solid rgba(255,255,255,.08);
  text-align: center;
  margin-top: 40px;
  padding-top: 15px;
  color: rgba(255,255,255,.55);
}

/* Yukarı Çık Butonu */
#scrollTopBtn{
  position: fixed;
  bottom: 25px;
  right: 25px;

  background: rgba(120,70,255,.90);
  color: #fff;

  border: 1px solid rgba(255,255,255,.18);
  border-radius: 50%;
  width: 45px;
  height: 45px;

  font-size: 20px;
  cursor: pointer;
  display: none;

  box-shadow: 0 16px 36px rgba(0,0,0,.35);
  transition: transform .18s ease, background .18s ease, border-color .18s ease;
}
#scrollTopBtn:hover{
  background: rgba(120,70,255,1);
  border-color: rgba(255,255,255,.24);
  transform: translateY(-2px);
}
/* =========================
   LIGHT THEME OVERRIDES
========================= */
html[data-theme="light"]{
  color-scheme: light;

  --bg1:#f5f7fb;
  --bg2:#e9ecf4;

  --glass: rgba(255,255,255,.75);
  --glass2: rgba(255,255,255,.95);

  --b: rgba(0,0,0,.10);
  --b2: rgba(0,0,0,.06);

  --t: rgba(10,10,15,.92);
  --ts: rgba(10,10,15,.65);

  --shadow: 0 16px 36px rgba(0,0,0,.12);
  --glow: 0 0 0 1px rgba(120,70,255,.18),
          0 20px 40px rgba(0,0,0,.18);

  --focus: rgba(120,70,255,.55);
  --focusRing: rgba(120,70,255,.22);
}

/* Body arkaplanı (light) */
html[data-theme="light"] body{
  background:
    radial-gradient(900px 520px at 15% 0%, rgba(120,70,255,0.12), transparent 60%),
    radial-gradient(900px 520px at 85% 10%, rgba(0,190,255,0.10), transparent 55%),
    linear-gradient(180deg, var(--bg1) 0%, var(--bg2) 100%);
}

/* Navbar light */
html[data-theme="light"] .navbar-glass{
  background: rgba(255,255,255,.75) !important;
  border-bottom: 1px solid var(--b2) !important;
}

/* Card / glass */
html[data-theme="light"] .card,
html[data-theme="light"] .card-glass,
html[data-theme="light"] .hero-card,
html[data-theme="light"] .loc-card{
  background: var(--glass) !important;
}

/* Table hover */
html[data-theme="light"] .table tbody tr:hover{
  background: rgba(0,0,0,.04) !important;
}

/* Footer */
html[data-theme="light"] footer,
html[data-theme="light"] .site-footer{
  background: rgba(255,255,255,.85) !important;
  color: rgba(0,0,0,.75);
}
/* =========================
   LIGHT THEME TEXT FIX (OVERRIDE)
   Yazılar beyaz kalmasın
========================= */
html[data-theme="light"]{
  --t: rgba(10,10,15,.92);
  --ts: rgba(10,10,15,.65);
}

/* Genel metin */
html[data-theme="light"] body,
html[data-theme="light"] .text-strong{
  color: var(--t) !important;
}

html[data-theme="light"] .text-secondary{
  color: var(--ts) !important;
}

/* Headings - base dosyada beyaza zorlanmıştı */
html[data-theme="light"] h1,
html[data-theme="light"] h2,
html[data-theme="light"] h3,
html[data-theme="light"] h4,
html[data-theme="light"] h5,
html[data-theme="light"] h6{
  color: rgba(10,10,15,.92) !important;
}

/* Kart içleri / section başlıkları */
html[data-theme="light"] .card,
html[data-theme="light"] .card *{
  color: var(--t);
}

html[data-theme="light"] .section-title{
  color: rgba(10,10,15,.92) !important;
}
html[data-theme="light"] .section-text{
  color: rgba(10,10,15,.70) !important;
}

/* Navbar linkleri */
html[data-theme="light"] .navbar-glass .navbar-brand,
html[data-theme="light"] .navbar-glass a{
  color: rgba(10,10,15,.92) !important;
}

/* Badge / pill gibi beyaza zorlananlar */
html[data-theme="light"] .badge-soft,
html[data-theme="light"] .badge-green,
html[data-theme="light"] .price-pill{
  color: rgba(10,10,15,.92) !important;
}

/* Locations (sende beyaza zorlanan classlar var) */
html[data-theme="light"] .loc-title,
html[data-theme="light"] .loc-phone,
html[data-theme="light"] .loc-body,
html[data-theme="light"] .loc-address{
  color: rgba(10,10,15,.85) !important;
}

/* Tablo metinleri */
html[data-theme="light"] .table,
html[data-theme="light"] .table *{
  color: rgba(10,10,15,.88) !important;
}
html[data-theme="light"] .table thead th{
  color: rgba(10,10,15,.65) !important;
}

/* Footer yazıları */
html[data-theme="light"] .site-footer,
html[data-theme="light"] .site-footer *{
  color: rgba(10,10,15,.78) !important;
}
html[data-theme="light"] .footer-blog-title{
  color: rgba(10,10,15,.88) !important;
}
html[data-theme="light"] .footer-blog-date{
  color: rgba(10,10,15,.55) !important;
}
/* =========================
   LIGHT MODE – COMPONENT FIX PACK
   (en alta ekle)
========================= */
html[data-theme="light"]{
  /* daha “premium” açık tema yüzeyleri */
  --glass: rgba(255,255,255,.82);
  --glass2: rgba(255,255,255,.96);
  --b: rgba(10,10,15,.10);
  --b2: rgba(10,10,15,.06);

  --t: rgba(10,10,15,.92);
  --ts: rgba(10,10,15,.65);

  --shadow: 0 16px 34px rgba(10,10,15,.12);
  --glow: 0 0 0 1px rgba(120,70,255,.14), 0 18px 44px rgba(10,10,15,.16);
}

/* === Kartlar gerçekten beyaz panel gibi dursun === */
html[data-theme="light"] .card,
html[data-theme="light"] .card-glass,
html[data-theme="light"] .hero-card,
html[data-theme="light"] .loc-card{
  background: var(--glass) !important;
  border-color: var(--b) !important;
  box-shadow: var(--shadow) !important;
}

/* Kart içi genel yazı görünürlüğü */
html[data-theme="light"] .card,
html[data-theme="light"] .card *{
  color: var(--t);
}
html[data-theme="light"] .text-secondary{
  color: var(--ts) !important;
}
html[data-theme="light"] .text-strong{
  color: var(--t) !important;
}

/* === Butonlar (light modda görünür olsun) === */
html[data-theme="light"] .btn-ghost{
  background: rgba(10,10,15,.04) !important;
  border-color: rgba(10,10,15,.10) !important;
  color: rgba(10,10,15,.86) !important;
}
html[data-theme="light"] .btn-ghost:hover{
  background: rgba(10,10,15,.07) !important;
  border-color: rgba(10,10,15,.14) !important;
}

html[data-theme="light"] .btn-outline-dark{
  color: rgba(10,10,15,.86) !important;
  border-color: rgba(10,10,15,.16) !important;
  background: rgba(255,255,255,.55) !important;
}
html[data-theme="light"] .btn-outline-dark:hover{
  background: rgba(120,70,255,.10) !important;
  border-color: rgba(120,70,255,.35) !important;
}

html[data-theme="light"] .btn-dark{
  background: rgba(120,70,255,.92) !important;
  border-color: rgba(120,70,255,.92) !important;
  color: #fff !important;
}
html[data-theme="light"] .btn-dark:hover{
  background: rgba(120,70,255,1) !important;
  border-color: rgba(120,70,255,1) !important;
}

/* WhatsApp butonu light modda da aynı kalsın ama hafif gölge */
html[data-theme="light"] .btn-whatsapp{
  box-shadow: 0 10px 20px rgba(0,0,0,.12);
}

/* === Formlar / iletişim formu görünürlüğü === */
html[data-theme="light"] .form-label{
  color: rgba(10,10,15,.75) !important;
}

html[data-theme="light"] .form-control,
html[data-theme="light"] .form-control-modern{
  background: rgba(255,255,255,.92) !important;
  border-color: rgba(10,10,15,.14) !important;
  color: rgba(10,10,15,.92) !important;
}
html[data-theme="light"] .form-control::placeholder{
  color: rgba(10,10,15,.45) !important;
}
html[data-theme="light"] .form-control:focus{
  border-color: rgba(120,70,255,.55) !important;
  box-shadow: 0 0 0 .25rem rgba(120,70,255,.18) !important;
}

/* === Mini-card (contact sağ bloktaki kutular) === */
html[data-theme="light"] .mini-card{
  background: rgba(255,255,255,.85) !important;
  border-color: rgba(10,10,15,.10) !important;
}
html[data-theme="light"] .mini-card .fw-semibold{
  color: rgba(10,10,15,.90) !important;
}

/* === Badge / price pill (light modda okunur olsun) === */
html[data-theme="light"] .badge-soft{
  background: rgba(10,10,15,.06) !important;
  border-color: rgba(10,10,15,.10) !important;
  color: rgba(10,10,15,.85) !important;
}
html[data-theme="light"] .badge-green{
  background: rgba(25,135,84,.16) !important;
  border-color: rgba(25,135,84,.22) !important;
  color: rgba(10,10,15,.88) !important;
}
html[data-theme="light"] .price-pill{
  background: rgba(120,70,255,.12) !important;
  border-color: rgba(120,70,255,.20) !important;
  color: rgba(10,10,15,.92) !important;
}

/* === Tablo satırları light modda netleşsin === */
html[data-theme="light"] .table thead th{
  color: rgba(10,10,15,.62) !important;
  border-bottom: 1px solid rgba(10,10,15,.10) !important;
}
html[data-theme="light"] .table tbody td{
  border-top: 1px solid rgba(10,10,15,.08) !important;
}
html[data-theme="light"] .table tbody tr:hover{
  background: rgba(10,10,15,.03) !important;
}

/* === Navbar light mod linkleri === */
html[data-theme="light"] .navbar-glass{
  background: rgba(255,255,255,.78) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
html[data-theme="light"] .navbar-glass .navbar-brand,
html[data-theme="light"] .navbar-glass a{
  color: rgba(10,10,15,.90) !important;
}

/* Kategori kapak içi beyaz text doğru ama (yalnızca cover’da kalsın) */
html[data-theme="light"] .cat-cover-content .text-white,
html[data-theme="light"] .cat-cover-content .text-white-50{
  color: rgba(255,255,255,.92) !important;
}
/* =========================
   NAVBAR + OFFCANVAS THEME SUPPORT
========================= */

/* Tema ikon butonu ufak parlatma */
#themeToggle, #themeToggleMobile{
  gap: 8px;
}
.theme-ico{
  display:inline-flex;
  width: 1.2em;
  justify-content:center;
}

/* Offcanvas hr (dark/light uyum) */
.offcanvas hr{
  border-color: rgba(255,255,255,.14) !important;
}
html[data-theme="light"] .offcanvas hr{
  border-color: rgba(10,10,15,.12) !important;
}

/* Offcanvas panel: varsayılan DARK */
.offcanvas{
  background: rgba(10,14,24,.96);
  color: rgba(255,255,255,.92);
  border-left: 1px solid rgba(255,255,255,.08);
}
.offcanvas .offcanvas-title{ color: rgba(255,255,255,.95); }
.offcanvas .btn-close{ filter: invert(1); opacity: .9; }

/* Offcanvas LIGHT */
html[data-theme="light"] .offcanvas{
  background: rgba(255,255,255,.92);
  color: rgba(10,10,15,.92);
  border-left: 1px solid rgba(10,10,15,.10);
}
html[data-theme="light"] .offcanvas .offcanvas-title{
  color: rgba(10,10,15,.92);
}
html[data-theme="light"] .offcanvas .btn-close{
  filter: none;
  opacity: .75;
}

/* Offcanvas içindeki ghost butonlar */
.offcanvas .btn-ghost{
  width: 100%;
  justify-content: center;
}

/* Navbar outline-dark butonu (hamburger) dark/light uyum */
html[data-theme="light"] .navbar-glass .btn-outline-dark{
  color: rgba(10,10,15,.86) !important;
  border-color: rgba(10,10,15,.16) !important;
  background: rgba(255,255,255,.55) !important;
}
html[data-theme="light"] .navbar-glass .btn-outline-dark:hover{
  background: rgba(120,70,255,.10) !important;
  border-color: rgba(120,70,255,.35) !important;
}

/* Mobil "Ara" butonu (btn-dark) light modda görünür olsun */
html[data-theme="light"] .navbar-glass .btn-dark{
  background: rgba(120,70,255,.92) !important;
  border-color: rgba(120,70,255,.92) !important;
  color: #fff !important;
}

/* Search icon button (navbar içi) light mod uyumu */
html[data-theme="light"] .search-btn{
  background: rgba(10,10,15,.05) !important;
  border-color: rgba(10,10,15,.10) !important;
  color: rgba(10,10,15,.75) !important;
}
html[data-theme="light"] .search-btn:hover{
  background: rgba(120,70,255,.10) !important;
  border-color: rgba(120,70,255,.30) !important;
  color: rgba(10,10,15,.92) !important;
}

/* Offcanvas linkleri light modda daha net */
html[data-theme="light"] .offcanvas .btn-ghost{
  background: rgba(10,10,15,.04) !important;
  border-color: rgba(10,10,15,.10) !important;
  color: rgba(10,10,15,.86) !important;
}
html[data-theme="light"] .offcanvas .btn-ghost:hover{
  background: rgba(10,10,15,.07) !important;
  border-color: rgba(10,10,15,.14) !important;
}

/* Offcanvas "Telefonla Ara" butonu light modda (btn-dark override) */
html[data-theme="light"] .offcanvas .btn-dark{
  background: rgba(120,70,255,.92) !important;
  border-color: rgba(120,70,255,.92) !important;
  color: #fff !important;
}

/* WhatsApp butonu her iki temada da ok */
.offcanvas .btn-whatsapp{
  width: 100%;
}
/* =========================
   LIGHT MODE – NAVY BUTTONS + LOWER PRICE SHADOW
   (EN ALTA EKLE)
========================= */

/* 1) Light mode "mor" butonları lacivert yap */
html[data-theme="light"] .btn-dark{
  background: rgba(18, 32, 74, .96) !important;   /* lacivert */
  border-color: rgba(18, 32, 74, .96) !important;
  color: #fff !important;
}
html[data-theme="light"] .btn-dark:hover{
  background: rgba(18, 32, 74, 1) !important;
  border-color: rgba(18, 32, 74, 1) !important;
}

/* Eğer outline hover’da mor vurgu istemiyorsan onu da laciverte çek */
html[data-theme="light"] .btn-outline-dark:hover{
  background: rgba(18, 32, 74, .10) !important;
  border-color: rgba(18, 32, 74, .35) !important;
}

/* (Opsiyonel) Footer link active vs. mor ise laciverte çekmek istersen */
html[data-theme="light"] .footer-links li a:hover{
  border-color: rgba(18, 32, 74, .35) !important;
}
html[data-theme="light"] .footer-links li a.active{
  background: rgba(18, 32, 74, .10) !important;
  border-color: rgba(18, 32, 74, .25) !important;
  color: rgba(10,10,15,.92) !important;
}

/* 2) Light mode fiyat pill gölgesini azalt */
html[data-theme="light"] .price-pill{
  box-shadow: 0 6px 12px rgba(10,10,15,.10) !important; /* daha hafif */
  /* İstersen daha da az:
     box-shadow: 0 3px 8px rgba(10,10,15,.08) !important;
  */
}
/* =========================
   LIGHT MODE – FORCE NAVY FOR "ARA" + "TELEFONLA ARA"
   (EN ALTA)
========================= */

/* Light mode: tüm btn-dark'lar lacivert */
html[data-theme="light"] .btn-dark{
  background: rgba(18, 32, 74, .96) !important;
  border-color: rgba(18, 32, 74, .96) !important;
  color: #fff !important;
}
html[data-theme="light"] .btn-dark:hover{
  background: rgba(18, 32, 74, 1) !important;
  border-color: rgba(18, 32, 74, 1) !important;
}

/* Ek garanti: navbar mobil "Ara" butonu */
html[data-theme="light"] .navbar-glass .btn-dark{
  background: rgba(18, 32, 74, .96) !important;
  border-color: rgba(18, 32, 74, .96) !important;
  color: #fff !important;
}

/* Ek garanti: offcanvas "Telefonla Ara" butonu */
html[data-theme="light"] .offcanvas .btn-dark{
  background: rgba(18, 32, 74, .96) !important;
  border-color: rgba(18, 32, 74, .96) !important;
  color: #fff !important;
}
/* =========================
   LIGHT MODE – SCROLL TOP BUTTON (NAVY)
========================= */

html[data-theme="light"] #scrollTopBtn{
  background: rgba(18, 32, 74, .96) !important;   /* lacivert */
  border-color: rgba(18, 32, 74, .96) !important;
  color: #fff !important;
  box-shadow: 0 14px 30px rgba(10,10,15,.18) !important;
}

html[data-theme="light"] #scrollTopBtn:hover{
  background: rgba(18, 32, 74, 1) !important;
  border-color: rgba(18, 32, 74, 1) !important;
  transform: translateY(-2px);
}
/* =========================
   FORCE WhatsApp BUTTON TEXT WHITE
   (Navbar + Offcanvas + Dark + Light)
========================= */

/* Genel */
.btn-whatsapp,
.btn-whatsapp *{
  color: #ffffff !important;
}

/* Hover / focus / active */
.btn-whatsapp:hover,
.btn-whatsapp:focus,
.btn-whatsapp:active{
  color: #ffffff !important;
}

/* Light mode override (özellikle offcanvas için) */
html[data-theme="light"] .btn-whatsapp,
html[data-theme="light"] .btn-whatsapp *,
html[data-theme="light"] .offcanvas .btn-whatsapp,
html[data-theme="light"] .offcanvas .btn-whatsapp *{
  color: #ffffff !important;
}
/* =========================
   LIGHT MODE – HERO KICKER BORDER FIX
========================= */

html[data-theme="light"] .hero-kicker{
  background: rgba(18, 32, 74, .08) !important;   /* hafif lacivert arka plan */
  color: rgba(18, 32, 74, .95) !important;        /* yazı lacivert */
  border: 1px solid rgba(18, 32, 74, .35) !important;
  box-shadow: 0 6px 16px rgba(18, 32, 74, .12) !important;
}

/* ✅ FAB responsive + safe-area */
.fab-calc{
  position: fixed;
  right: 18px;
  bottom: calc(18px + env(safe-area-inset-bottom));
  height: 52px;
  padding: 0 18px;
  border: 0;
  border-radius: 999px;
  background: #111827;
  color: #fff;
  font-weight: 700;
  font-size: 14px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  box-shadow: 0 18px 40px rgba(0,0,0,.35);
  z-index: 1050;
  white-space: nowrap;
}

.fab-calc:hover{ transform: translateY(-1px); }
.fab-calc:active{ transform: translateY(0); }

/* Mobil ergonomi */
@media (max-width: 576px){
  .fab-calc{
    height: 56px;
    padding: 0 20px;
    font-size: 15px;
  }
}


/* ✅ Modal içi sekmeler */
.calc-pills{
  gap: 8px;
}
.calc-pills .nav-link{
  border-radius: 999px;
  padding: 8px 12px;
}

/* ✅ Toplam kartı daha okunur */
.calc-total-card{
  border-radius: 18px;
}
.calc-total{
  font-size: 1.35rem;
}

/* Mobil fullscreen modalda footer sabit dursun gibi */
@media (max-width: 576px){
  .modal-fullscreen-sm-down .modal-content{
    border-radius: 0;
  }
  .calc-footer{
    padding-bottom: calc(12px + env(safe-area-inset-bottom));
  }
}

/* ✅ Hesaplama modal genişliği biraz daha */
.calc-modal.modal-lg { max-width: 760px; }
@media (min-width: 992px){
  .calc-modal.modal-lg { max-width: 820px; }
}

/* ✅ Dark mode: select kutusu */
.theme-dark .modal-content,
.theme-dark .premium-card{
  background: #0b1220; /* senin temaya yakın */
  color: #e5e7eb;
}

.theme-dark .form-select.form-control-modern,
.theme-dark .form-control.form-control-modern{
  background-color: rgba(255,255,255,.06);
  color: #e5e7eb;
  border: 1px solid rgba(255,255,255,.14);
}

.theme-dark .form-select.form-control-modern:focus,
.theme-dark .form-control.form-control-modern:focus{
  border-color: rgba(255,255,255,.26);
  box-shadow: 0 0 0 .2rem rgba(255,255,255,.06);
}

/* ✅ Select oku beyaz olsun (Bootstrap arrow svg override) */
.theme-dark .form-select{
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='%23e5e7eb' d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592c.86 0 1.319 1.013.753 1.658l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right .75rem center;
  background-size: 16px 12px;
}

/* ✅ Option list (desktop tarayıcılar için işe yarar; bazıları ignore eder) */
.theme-dark select option{
  background: #0b1220;
  color: #e5e7eb;
}

/* ✅ Disabled/placeholder option */
.theme-dark select option:disabled{
  color: rgba(229,231,235,.55);
}

/* ✅ Mini-card/total alanı dark uyum */
.theme-dark .mini-card{
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.10);
}
/* ====== CALC MODAL: GENEL ====== */
.calc-modal.modal-lg { max-width: 760px; }
@media (min-width: 992px){
  .calc-modal.modal-lg { max-width: 820px; }
}

/* Modal içi tipografi */
#calcModal .modal-title{ font-weight: 800; }
#calcModal .form-label{ font-weight: 600; }

/* Pills */
#calcModal .calc-pills{ gap: 8px; }
#calcModal .calc-pills .nav-link{
  border-radius: 999px;
  padding: 8px 12px;
  font-weight: 700;
}

/* Total kart */
#calcModal .calc-total-card{
  border-radius: 18px;
}
#calcModal .calc-total{
  font-size: 1.35rem;
  font-weight: 800;
}

/* ====== LIGHT MODE (body theme-dark DEĞİLSE) ====== */
body:not(.theme-dark) #calcModal .modal-content{
  background: #ffffff;
  color: #0f172a;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 0 30px 70px rgba(15,23,42,.12);
}

body:not(.theme-dark) #calcModal .text-secondary{
  color: rgba(15,23,42,.65) !important;
}

body:not(.theme-dark) #calcModal .form-select.form-control-modern,
body:not(.theme-dark) #calcModal .form-control.form-control-modern{
  background: #ffffff;
  color: #0f172a;
  border: 1px solid rgba(15,23,42,.14);
}

body:not(.theme-dark) #calcModal .form-select.form-control-modern:focus,
body:not(.theme-dark) #calcModal .form-control.form-control-modern:focus{
  border-color: rgba(15,23,42,.28);
  box-shadow: 0 0 0 .2rem rgba(15,23,42,.08);
}

body:not(.theme-dark) #calcModal .mini-card{
  background: rgba(15,23,42,.04);
  border: 1px solid rgba(15,23,42,.10);
}

body:not(.theme-dark) #calcModal .calc-pills .nav-link{
  background: rgba(15,23,42,.06);
  color: #0f172a;
  border: 1px solid rgba(15,23,42,.10);
}
body:not(.theme-dark) #calcModal .calc-pills .nav-link.active{
  background: #0f172a;
  color: #ffffff;
  border-color: #0f172a;
}

/* ✅ Modal görünümü: tema bazlı net override */
body:not(.theme-dark) #calcModal .calc-modal-content{
  background: #ffffff !important;
  color: #0f172a !important;
  border: 1px solid rgba(15,23,42,.10) !important;
  box-shadow: 0 30px 70px rgba(15,23,42,.12) !important;
}

body.theme-dark #calcModal .calc-modal-content{
  background: #0b1220 !important;
  color: #e5e7eb !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  box-shadow: 0 30px 70px rgba(0,0,0,.45) !important;
}

/* Light mod yazılar */
body:not(.theme-dark) #calcModal .text-secondary{
  color: rgba(15,23,42,.65) !important;
}

/* Light mod input/select */
body:not(.theme-dark) #calcModal .form-select.form-control-modern,
body:not(.theme-dark) #calcModal .form-control.form-control-modern{
  background: #ffffff !important;
  color: #0f172a !important;
  border: 1px solid rgba(15,23,42,.14) !important;
}

/* Dark mod input/select */
body.theme-dark #calcModal .form-select.form-control-modern,
body.theme-dark #calcModal .form-control.form-control-modern{
  background: rgba(255,255,255,.06) !important;
  color: #e5e7eb !important;
  border: 1px solid rgba(255,255,255,.14) !important;
}

/* =========================
   CALC MODAL – THEME OVERRIDE (EN ALTA)
========================= */

/* Light modda modal kesin beyaz olsun */
html[data-theme="light"] #calcModal .modal-content{
  background: #ffffff !important;
  color: rgba(10,10,15,.92) !important;
  border: 1px solid rgba(10,10,15,.10) !important;
  box-shadow: 0 30px 70px rgba(10,10,15,.12) !important;
}

html[data-theme="light"] #calcModal .modal-header{
  border-bottom: 1px solid rgba(10,10,15,.10) !important;
}

html[data-theme="light"] #calcModal .btn-close{
  filter: none !important;
  opacity: .7 !important;
}

/* Light mod: input/select yazıları görünür olsun */
html[data-theme="light"] #calcModal .form-label{
  color: rgba(10,10,15,.75) !important;
}

html[data-theme="light"] #calcModal .form-control,
html[data-theme="light"] #calcModal .form-control-modern,
html[data-theme="light"] #calcModal .form-select.form-control-modern{
  background: rgba(255,255,255,.92) !important;
  border-color: rgba(10,10,15,.14) !important;
  color: rgba(10,10,15,.92) !important;
}

html[data-theme="light"] #calcModal .text-secondary{
  color: rgba(10,10,15,.60) !important;
}

html[data-theme="light"] #calcModal .mini-card{
  background: rgba(10,10,15,.04) !important;
  border-color: rgba(10,10,15,.10) !important;
}

/* Pills (Gram/Kg) light */
html[data-theme="light"] #calcModal .calc-pills .nav-link{
  background: rgba(10,10,15,.06) !important;
  border: 1px solid rgba(10,10,15,.10) !important;
  color: rgba(10,10,15,.86) !important;
}
html[data-theme="light"] #calcModal .calc-pills .nav-link.active{
  background: rgba(18,32,74,.96) !important;   /* senin lacivert */
  border-color: rgba(18,32,74,.96) !important;
  color: #fff !important;
}
/* ✅ FAB renk ayarı (dark modda daha açık, karışmasın) */

/* Dark (default) */
.fab-calc{
  background: rgba(255,255,255,.14) !important;   /* hafif beyaz */
  border: 1px solid rgba(255,255,255,.18) !important;
  color: rgba(255,255,255,.95) !important;
  box-shadow: 0 18px 40px rgba(0,0,0,.38) !important;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(10px);
}

.fab-calc:hover{
  background: rgba(255,255,255,.18) !important;
  border-color: rgba(255,255,255,.28) !important;
}

/* Light modda lacivert kalsın (istersen) */
html[data-theme="light"] .fab-calc{
  background: rgba(18, 32, 74, .96) !important;
  border-color: rgba(18, 32, 74, .96) !important;
  color: #fff !important;
}

html[data-theme="light"] .fab-calc:hover{
  background: rgba(18, 32, 74, 1) !important;
  border-color: rgba(18, 32, 74, 1) !important;
}
.chg-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  border: 1px solid rgba(148,163,184,.35);
  background: rgba(15,23,42,.35);
  white-space: nowrap;
}

.chg-ic{
  font-size: 12px;
  line-height: 1;
}

.chg-up{
  color: #16a34a;
  border-color: rgba(22,163,74,.35);
  background: rgba(22,163,74,.12);
}

.chg-down{
  color: #ef4444;
  border-color: rgba(239,68,68,.35);
  background: rgba(239,68,68,.12);
}

.chg-same{
  color: #94a3b8;
}
.chg-pill{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  font-weight: 600;
  font-size: 12px;
  white-space: nowrap;
}

.chg-up   { background: rgba(34,197,94,.15);  color: #22c55e; }
.chg-down { background: rgba(239,68,68,.15);  color: #ef4444; }

/* ✅ NULL veya 0 fark için sarı */
.chg-na   { background: rgba(245,158,11,.18); color: #f59e0b; }
/* Wrapper */
.loc-slider-wrap{
  position: relative;
}

/* Slider */
.loc-slider{
  display:flex;
  gap:16px;
  overflow-x:auto;
  padding:6px 48px 14px; /* oklar için yan boşluk */
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  cursor: grab;
}
.loc-slider:active{
  cursor: grabbing;
}

/* Slide */
.loc-slide{
  flex:0 0 auto;
  width:340px;
  scroll-snap-align:start;
}
@media (max-width: 992px){ .loc-slide{ width:320px; } }
@media (max-width: 576px){ .loc-slide{ width:88vw; } }

/* Wrapper */
.loc-slider-wrap{
  position: relative;
}

/* Slider */
.loc-slider{
  display:flex;
  gap:16px;
  overflow-x:auto;
  padding:6px 48px 14px; /* oklar için yan boşluk (desktop/tablet) */
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  cursor: grab;
}
.loc-slider:active{
  cursor: grabbing;
}

/* Slide */
.loc-slide{
  flex:0 0 auto;
  width:340px;
  scroll-snap-align:start;
}

@media (max-width: 992px){
  .loc-slide{ width:320px; }
}

/* Mobilde lokasyonları yatay kaydır (1 kart görünsün) */
@media (max-width: 576px){
  .loc-row{
    flex-wrap: nowrap !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    padding-bottom: 8px;
  }

  .loc-row::-webkit-scrollbar{ height: 8px; }
  .loc-row::-webkit-scrollbar-thumb{ border-radius: 10px; }

  .loc-col{
    flex: 0 0 88vw;         /* ekranda 1 kart gibi görünür */
    max-width: 88vw;
    scroll-snap-align: start;
  }
}


/* İsteğe bağlı: scrollbar gizle (çok hoş duruyor) */
.loc-slider::-webkit-scrollbar{ height:8px; }
.loc-slider::-webkit-scrollbar-thumb{ background:rgba(255,255,255,0.15); border-radius:999px; }
.loc-slider{ scrollbar-color: rgba(255,255,255,0.15) transparent; }
/* Mobil slider wrapper */
.loc-slider-wrap-mobile{
  position: relative;
}
.loc-slider-wrap{ position: relative; }

/* Slider */
.loc-slider{
  display:flex;
  gap:16px;
  overflow-x:auto;
  padding:6px 48px 14px; /* oklar için boşluk */
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  cursor: grab;
}
.loc-slider:active{ cursor: grabbing; }

/* Slide */
.loc-slide{
  flex:0 0 auto;
  width:340px;
  scroll-snap-align:start;
}
@media (max-width: 992px){ .loc-slide{ width:320px; } }
@media (max-width: 576px){ .loc-slide{ width:88vw; } }

/* Oklar (mobil + desktop) */
.loc-nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:30;

  width:40px;
  height:40px;
  border-radius:999px;
  border:none;

  background:rgba(15,23,42,0.80);
  color:#fff;
  font-size:22px;
  line-height:1;

  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;

  box-shadow:0 8px 24px rgba(0,0,0,.25);
  transition:transform .15s ease, background .15s ease;
}
.loc-nav:hover{ transform:translateY(-50%) scale(1.07); background:rgba(15,23,42,0.92); }
.loc-nav:active{ transform:translateY(-50%) scale(.98); }

.loc-prev{ left:8px; }
.loc-next{ right:8px; }

/* Mobilde okları biraz küçült + slider padding’i azalt */
@media (max-width:576px){
  .loc-nav{
    width:34px;
    height:34px;
    font-size:18px;
  }
  .loc-slider{
    padding:6px 40px 14px; /* mobilde oklar daha küçük */
  }
}
/* ================================
   MASAÜSTÜ + AYDINLIK TEMA
   Kaydırma ikonları (lacivert)
================================ */
@media (min-width: 768px){
  body.theme-light .loc-nav{
    background:#0b1c3d;              /* lacivert */
    color:#ffffff;
    box-shadow:0 10px 28px rgba(11,28,61,.35);
  }

  body.theme-light .loc-nav:hover{
    background:#102a5c;             /* hover biraz daha açık lacivert */
  }
}

/* ================================
   MOBİL / DİĞER TEMALAR
   Cam / koyu görünüm korunur
================================ */
body:not(.theme-light) .loc-nav{
  background:rgba(15,23,42,0.80);
  color:#ffffff;
}
/* ✅ Light mode: hesaplama alanındaki select/input siyah görünmesin */
@media (prefers-color-scheme: light) {
  .form-control-modern,
  .form-select.form-control-modern {
    background: #ffffff !important;
    color: #0f172a !important;
    border-color: rgba(15, 23, 42, 0.15) !important;
  }

  .form-select.form-control-modern option {
    background: #ffffff !important;
    color: #0f172a !important;
  }

  .form-control-modern::placeholder {
    color: rgba(15, 23, 42, 0.55) !important;
  }
}

/* Eğer projende body'ye .theme-light gibi bir class ile light mode veriyorsan: */
.theme-light .form-control-modern,
.theme-light .form-select.form-control-modern {
  background: #ffffff !important;
  color: #0f172a !important;
  border-color: rgba(15, 23, 42, 0.15) !important;
}
.theme-light .form-select.form-control-modern option {
  background: #ffffff !important;
  color: #0f172a !important;
}
.theme-light .form-control-modern::placeholder {
  color: rgba(15, 23, 42, 0.55) !important;
}