@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css");

/* Global vars */
:root {
  --bs-body-font-family: "Manrope", sans-serif;
  --color1: #185a9d;
  --color2: #43cea2;
  --color3: #311D3F;
  --color4: #393E46;
}

/* Genel */
html, body {
  font-family: var(--bs-body-font-family);
  font-weight: 400;
  font-style: normal;
  color: var(--color4);
  height: 100%;
  margin: 0;
}

/* navbar-start */

.navbar-gradient {
  background: #43cea2;  /* fallback for old browsers */
  background: -webkit-linear-gradient(to right, #185a9d, #43cea2);  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to right, #185a9d, #43cea2); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.navbar-nav .nav-link {
  color: #fff;
  transition: color 0.2s ease;
}

.navbar-nav .nav-link:hover {
  color: #43cea2; /* koyu mor ton */
}

/* Hover + focus + aktif (Bootstrap uyumlu seçiciler) */
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link:focus,
.navbar-nav .nav-link.active,
.navbar-nav .nav-link[aria-current="page"],
.navbar-nav .show > .nav-link {
  color: #43cea2 !important;
}

.navbar .dropdown-menu .dropdown-item.active,
.navbar .dropdown-menu .dropdown-item:active {
  color: #43cea2;
  background: transparent; /* veya istediğin arka plan */
}


.navbar-gradient .navbar-toggler {
  border-color: rgba(255,255,255,.35);
}
.navbar-gradient .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255,255,255,0.9)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.dropdown-menu {
  background: #43cea2;
  border-color: rgba(255,255,255,.15);
}

.dropdown-item {
  color: #fff;
  transition: background-color 0.2s ease;
}

.dropdown-item:hover {
  background-color: var(--color1);
  color: #fff;
}

.logo {
  width: auto;
  max-height: 40px;
}

.navbar-left,
.navbar-center,
.navbar-right {
  flex: 1;
}

.navbar-center { text-align: center; }
.navbar-right { text-align: right; }

/* container'ı referans yapmak için */
.navbar .container-fluid { position: relative; }

/* Sadece left ve right esnesin */
.navbar-left, .navbar-right { flex: 1; }

/* Center yer kaplamasın; mutlak ortala */
.navbar-center {
  flex: 0 0 auto;          /* genişlik kaplamayı bırak */
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;       /* logo ortalı kalsın */
  z-index: 1;               /* olası örtüşmelere karşı */
}

/* Küçük ekranlarda logonun taşmaması için opsiyonel */
@media (max-width: 576px) {
  .navbar-center .logo { max-height: 34px; }
}

.navbar-gradient {
  /* sticky iken altı görünmesin */
  background: linear-gradient(90deg, #132440 0%, #43cea2 100%);
}

.navbar.sticky-top {
  z-index: 1030; /* Bootstrap varsayımı; kendi stilin aşırı yazıyorsa garanti */
}

/* Offcanvas içerik linkleri */
.offcanvas .nav-link {
  color: #132440;
}
.offcanvas .nav-link.active,
.offcanvas .nav-link:hover {
  color: #43cea2;
}

/* Offcanvas başlık arka planı, navbar ile aynı gradient */
.offcanvas-header.navbar-gradient {
  background: linear-gradient(90deg, #132440 0%, #43cea2 100%);
}

/* Mobil offcanvas içi temel link rengi (ana ve alt maddeler) */
#mobileMenu .nav-link,
#mobileMenu .accordion-button,
#mobileMenu .dropdown-item {
  color: var(--nav-fg, #1f2a37) !important;  /* kendi palet tonunla eşleşsin */
}

/* Alt maddeler hover/active durumları */
#mobileMenu .dropdown-item:hover,
#mobileMenu .dropdown-item:focus {
  color: var(--nav-fg, #1f2a37) !important;
  background-color: rgba(0,0,0,.04);
}

/* Accordion başlığı (Organizatör) görünümü */
#mobileMenu .accordion-button {
  background-color: transparent;
  box-shadow: none;
}
#mobileMenu .accordion-button:not(.collapsed) {
  background-color: rgba(0,0,0,.03);
}

/* Accordion gövdesindeki listeyi menü gibi göster (bootstrap dropdown look’undan çık) */
#mobileMenu .accordion-body {
  padding: .25rem 0;
}
#mobileMenu .accordion-body .dropdown-item {
  padding: .5rem .75rem;
  border-radius: .375rem;
}

/* Varsa gradient/dark tema kalıntıları */
#mobileMenu .dropdown-menu {
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0;
}

/* navbar-end */



/* map-start */

#map {
  height: calc(100vh - 70px);
  width: 100%;
}
.map-layout {
  height: calc(100vh - 70px);
}

#map {
  height: 100%;
  width: 100%;
}

/* map-end */


/* siderbar-start */
.eh-sidebar {
  width: 500px;
  max-width: 90vw;
  background: #fff;
  border-left: 1px solid rgba(0,0,0,.1);
  overflow-y: auto;
}

/* Mobil toggle butonu — sağ üst köşe */
.offcanvas-btn {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 1040; /* harita üstünde */
  border: 1px solid rgba(0,0,0,.15);
  background: #fff;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.offcanvas-btn i {
  font-size: 1.2rem;
}

#sidebarOffcanvas {
  --bs-offcanvas-width: 360px;
}

/* Sidebar kaydırılabilir ise sticky çalışır; genelde eh-sidebar zaten overflow-y:auto */
.eh-sidebar { overflow-y: auto; }

/* Sabit başlık */
.eh-sidebar .list-header {
  position: sticky;
  top: 0;
  z-index: 10;
  background: #fff;            /* içerik kayarken arka plan kapatsın */
  padding-top: .25rem;         /* görsel denge */
  padding-bottom: .25rem;
  /* İstersen hafif alt gölge: */
  /* box-shadow: 0 2px 6px rgba(0,0,0,.06); */
}

/* Başlık ve araç çubuğunu birlikte sabitlemek istersen: */
.eh-sidebar .list-header { position: sticky; top: 0; z-index: 10; background: #fff; }
.eh-sidebar .list-tools  { position: sticky; top: 48px; z-index: 9; background: #fff; padding: .25rem 0; }


/* siderbar-end */


/* events-start */

.event-list {
  display: grid;
  gap: 8px;
}

.event-item {
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 10px;
  padding: 10px 12px;
  background: #fff;
  cursor: pointer;
  transition: transform .08s ease, box-shadow .12s ease, border-color .12s ease;
}

.event-item:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0,0,0,.06);
}

.event-item.active {
  border-color: #43cea2;
  box-shadow: 0 0 0 3px rgba(67,206,162,.15);
}

.event-title {
  font-weight: 600;
  margin: 0 0 4px;
  line-height: 1.25;
}

.event-meta {
  font-size: .9rem;
  opacity: .8;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

/* Desktop araç çubuğunu başlık altında yapışkan tut */
.eh-sidebar .list-header { position: sticky; top: 0; z-index: 10; background: #fff; }
.eh-sidebar .list-tools-desktop { position: sticky; top: 48px; z-index: 9; background: #fff; padding: .25rem 0; }

/* Mobil offcanvas'ta araç çubuğu gövdenin tepesine yapışsın */
#sidebarOffcanvas .list-tools-mobile {
  position: sticky;
  top: 0;
  z-index: 10;
  background: #fff;
  padding: .5rem 0 .75rem;
}

/* Dinamik renkli rozet (kategori) */
.badge-dynamic { background-color: var(--badge, #43cea2) !important; color:#fff !important; }

/* events-end */


/* icons-start */

.leaflet-marker-icon.fa-marker {
  background: transparent;
  border: 0;
}

.fa-pin {
  --pin-color: #43cea2;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--pin-color);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;          /* ikon rengi */
  box-shadow: 0 2px 6px rgba(0,0,0,.3);
  transform: translateY(-6px);
  font-size: 14px;      /* FA ikon boyutu */
}

/* Liste ikonları */
.event-item .cat-icon {
  width: 1.5rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: .45rem;
}
.event-item .cat-icon i {
  color: var(--icon-color, #555);
}

/* Etkinlik listesi kategori rozeti */
.event-item .cat-badge {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--badge, #43cea2); /* JS’ten renk gelir */
  color: #fff;                       /* ikon beyaz */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 6px rgba(0,0,0,.15);
  flex: 0 0 28px;
}
.event-title.with-badge {
  display: flex;
  align-items: center;
  gap: .45rem;
}

.badge-dynamic {
  background-color: var(--badge, #43cea2) !important;
  color: #fff !important;
  border: 0;
}

/* icons-end */

/* discover-start */

/* Section başlık çipi */
/* ---- Title Chip ---- */
.title-chip{
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .35rem .75rem;
  border-radius: 999px;
  font-weight: 600;
  line-height: 1;
  background: var(--bg, rgba(0,0,0,.06));
  color: var(--fg, #1f2a37);
  border: 1px solid var(--bd, transparent);
}
.title-chip i{ font-size: 1rem; line-height: 1; }

/* Chip renk paleti (yalnızca .title-chip için geçerli) */
.title-chip.head-trend   { --bg: rgba(231, 76, 60,  .12); --fg:#c0392b; --bd: rgba(231,76,60,.25); }    /* Kırmızı */
.title-chip.head-weekend { --bg: rgba(52, 152, 219, .12); --fg:#2c81ba; --bd: rgba(52,152,219,.25); }   /* Mavi */
.title-chip.head-free    { --bg: rgba(22, 160, 133, .12); --fg:#13836f; --bd: rgba(22,160,133,.25); }   /* Yeşil */
.title-chip.head-family  { --bg: rgba(155, 89, 182, .12); --fg:#7d3cb5; --bd: rgba(155,89,182,.25); }   /* Mor */

/* ---- Section Header (linear gradient şerit) ---- */
.section-head{
  --head-start: #132440;   /* varsayılan tonlar */
  --head-end:   #43cea2;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  padding:.55rem .85rem;
  /* İSTEK: Kenar yuvarlama kaldırılsın */
  border-radius: 0;                /* ← eskiden 12px idi */
  background: linear-gradient(90deg, var(--head-start) 0%, var(--head-end) 100%);
  color:#fff;
}
.section-head .section-title{
  font-size:.95rem;        /* başlık daha küçük */
  font-weight:600;
  letter-spacing:.2px;
  display:flex;
  align-items:center;
  gap:.5rem;
  margin:0;
  color:#fff;
}
.section-head .see-all{
  font-size:.85rem;        /* “Tümünü gör” daha küçük */
  font-weight:500;
  color:#fff;
  text-decoration:none;
  opacity:.95;
}
.section-head .see-all:hover{
  text-decoration:underline;
  opacity:1;
}

/* Section header renk varyantları (gradient için) */
.head-trend  { --head-start:#132440; --head-end:#43cea2; } /* lacivert → turkuaz */
.head-weekend{ --head-start:#9b59b6; --head-end:#3498db; } /* mor → mavi */
.head-free   { --head-start:#16a085; --head-end:#43cea2; } /* yeşil → turkuaz */
.head-family { --head-start:#f39c12; --head-end:#e74c3c; } /* turuncu → mercan */

/* Nav aktif rengi (hover ile uyumlu) */
.navbar-nav .nav-link.active,
.navbar-nav .nav-link.show,
.navbar-nav .nav-link:focus { color:#43cea2; }

/* Kart ve satır yardımcıları (mevcut tasarım) */
.event-card{ min-width:230px; max-width:260px; }
.event-card .card-img-top{ aspect-ratio:16/9; object-fit:cover;}
.btn-xs{ --bs-btn-padding-y:.2rem; --bs-btn-padding-x:.45rem; --bs-btn-font-size:.75rem; }
.scroll-row{ scroll-snap-type:x proximity; }
.scroll-row > *{ scroll-snap-align:start; }
@media (max-width:576px){ .event-card{ min-width:78vw; } }

/* Bölümler arası nefes */
section + section { margin-top: 2rem; }

/* Rozet satırları: taşmadan otomatik alt satıra geçsin */
.badge-row,
.event-badges {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .45rem;   /* satır ve sütun aralığı */
}

.badge-row .badge,
.event-badges .badge {
  white-space: nowrap;  /* rozetin metni tek satırda kalsın */
}

/* calendar-start */


.cal-grid{ display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:.5rem; }
.cal-head{ display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:.5rem; }
.cal-head > div{ text-align:center; color:#6b7280; font-weight:600; font-size:.85rem; }
.cal-cell{
  border:1px solid rgba(0,0,0,.08); border-radius:.5rem; background:#fff;
  min-height:96px; padding:.5rem .5rem .4rem; position:relative; cursor:pointer;
  transition: box-shadow .15s ease, transform .05s ease;
}
.cal-cell:hover{ box-shadow:0 2px 10px rgba(0,0,0,.06); }
.cal-cell.muted{ background:#fafafa; color:#8a8a8a; }
.cal-cell.active{ outline:2px solid #43cea2; outline-offset:2px; }
.daynum{ font-weight:700; font-size:.95rem; }
.cal-badge{ position:absolute; top:.5rem; right:.5rem; }

/* Hücre içi etkinlik listesi */
.cal-events{ margin:.35rem 0 0 0; padding:0; list-style:none; display:flex; flex-direction:column; gap:.25rem; }
.cal-item{
  display:flex; align-items:center; gap:.35rem; min-height:18px;
  font-size:.78rem; line-height:1.1; color:#111827; background:#f8fafc;
  border-left:4px solid #e5e7eb; border-radius:.35rem; padding:.15rem .35rem;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.cal-more{ font-size:.75rem; color:#6b7280; }

/* Mobil iyileştirmeler */
@media (max-width: 768px){
  .cal-cell{ min-height:86px; }
  .cal-item{ font-size:.75rem; }
}
@media (max-width: 576px){
  .cal-grid, .cal-head{ gap:.35rem; }
  .cal-cell{ min-height:80px; padding:.45rem; }
  .daynum{ font-size:.9rem; }
  .cal-item{ font-size:.72rem; }
}

/* calendar-end */


/* favorites-start */

.event-card{ border-radius:1rem; }
.event-card .card-img-top{ aspect-ratio:16/9; object-fit:cover; border-top-left-radius:1rem; border-top-right-radius:1rem; }
.btn-xs{ --bs-btn-padding-y:.2rem; --bs-btn-padding-x:.45rem; --bs-btn-font-size:.75rem; --bs-btn-border-radius:.35rem; }
.badge-wrap{ display:flex; flex-wrap:wrap; gap:.4rem; }
.badge-wrap .badge{ white-space:normal; }
.fab-map{
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 1040;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);
}

/* favorites-end */


/* organize-analytics-start */


.stat-card .icon{width:40px;height:40px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;background:rgba(13,110,253,.08)}
.chart-wrap{position:relative;height:300px}          /* sabit yükseklik kapsayıcıda */
#timeseriesChart, #funnelChart{width:100%;height:100%} /* canvas kapsayıcıyı doldursun */
#visitorsMap{height:340px}
@media (max-width:576px){
  .chart-wrap{height:240px}
  #visitorsMap{height:280px}
}


/* organize-analytics-end */

/* discover-end */

/* =========================================
   NOTIFICATION DROPDOWN (RENKSİZ / BEYAZ)
========================================= */

/* Sadece bildirim dropdown'u */
#notifBell + .dropdown-menu,
.dropdown-menu[aria-labelledby="notifBell"] {
  background: #ffffff !important;
  color: #1f2937; /* koyu gri */
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 12px 30px rgba(0,0,0,.12);
}

/* Başlık alanı */
#notifBell + .dropdown-menu .border-bottom {
  background: #ffffff;
}

/* Alt footer alanı */
#notifBell + .dropdown-menu .border-top {
  background: #ffffff;
}

/* Bildirim item yazıları */
#notifList,
#notifList * {
  color: #1f2937 !important;
}

/* Bildirim item hover */
#notifList .notif-item:hover,
#notifList a:hover {
  background-color: #f3f4f6;
}

/* "Bildirim ayarları" linki */
#notifBell + .dropdown-menu a {
  color: #2563eb !important;
}
#notifBell + .dropdown-menu a:hover {
  text-decoration: underline;
}