@charset "UTF-8";

/* ============================================================
   PREMIUM BOTTOM NAVBAR v2
   ============================================================ */

:root {
  --nav-bg: #080e1a;
  --nav-bg-glass: rgba(8, 14, 26, 0.95);
  --nav-border: rgba(12, 80, 153, 0.5);
  --nav-glow: rgba(69, 144, 255, 0.15);
  --nav-text: rgba(255, 255, 255, 0.55);
  --nav-text-active: #ffffff;
  --nav-accent: #4590ff;
  --nav-accent-deep: #0c5099;
  --nav-badge-live: #ef4444;
  --nav-badge-coupon: #f59e0b;
  --nav-center-size: 52px;
  --nav-height: 64px;
  --nav-safe-bottom: env(safe-area-inset-bottom, 0px);
}

/* --- ESKİ MOBİL MENÜYÜ TAMAMEN GİZLE --- */
.mob-sb-mobil-navbar,
.mob-sb-mobil-trigger,
.mob-sb-mobil-container {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

/* --- Navbar Container --- */
.pnav {
  position: fixed;
  left: 0; right: 0;
  bottom: 0;
  z-index: 99999;
  background: var(--nav-bg-glass);
  -webkit-backdrop-filter: blur(20px) saturate(1.8);
  backdrop-filter: blur(20px) saturate(1.8);
  border-top: 1px solid var(--nav-border);
  padding-bottom: var(--nav-safe-bottom);
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  transform: translateY(0);
}

.pnav.pnav--hidden {
  transform: translateY(calc(100% + 10px));
}

.pnav::before {
  content: "";
  position: absolute;
  top: -1px; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, var(--nav-accent) 30%, var(--nav-accent) 70%, transparent 100%);
  opacity: 0.4;
}

/* --- Ic Duzenleme --- */
.pnav__inner {
  display: flex;
  justify-content: space-around;
  align-items: flex-end;
  max-width: 560px;
  margin: 0 auto;
  padding: 8px 12px 6px;
  height: var(--nav-height);
}

/* --- Menu Ogeleri --- */
.pnav__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  color: var(--nav-text);
  text-decoration: none;
  cursor: pointer;
  transition: color 0.2s ease, transform 0.15s ease;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
  position: relative;
  flex: 1;
  min-width: 0;
  padding: 4px 0;
}

.pnav__item:hover { color: rgba(255, 255, 255, 0.8); }
.pnav__item:active { transform: scale(0.92); }

.pnav__item--active { color: var(--nav-accent); }
.pnav__item--active .pnav__label { color: var(--nav-accent); font-weight: 600; }

.pnav__item--active::after {
  content: "";
  position: absolute;
  bottom: -6px;
  left: 50%;
  transform: translateX(-50%);
  width: 20px;
  height: 2.5px;
  background: var(--nav-accent);
  border-radius: 2px;
}

/* --- Ikon --- */
.pnav__icon {
  width: 24px; height: 24px;
  display: flex; align-items: center; justify-content: center;
  position: relative;
}
.pnav__icon svg {
  width: 22px; height: 22px;
  stroke: currentColor; stroke-width: 1.6; fill: none;
}

/* --- Label --- */
.pnav__label {
  font-size: 10px; font-weight: 500;
  letter-spacing: 0.4px; text-transform: uppercase;
  line-height: 1; white-space: nowrap;
}

/* --- Badge --- */
.pnav__badge {
  position: absolute; top: -4px; right: -8px;
  min-width: 16px; height: 16px; padding: 0 4px;
  border-radius: 8px; font-size: 9px; font-weight: 700;
  color: #fff; display: flex; align-items: center; justify-content: center;
  line-height: 1; border: 2px solid var(--nav-bg);
  animation: pnav-badge-pop 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.pnav__badge--live { background: var(--nav-badge-live); }
.pnav__badge--coupon { background: var(--nav-badge-coupon); }
.pnav__badge--empty { display: none; }

@keyframes pnav-badge-pop {
  0% { transform: scale(0); }
  70% { transform: scale(1.2); }
  100% { transform: scale(1); }
}

/* --- Merkez Buton (Ana Sayfa) --- */
.pnav__center {
  flex: 1; display: flex; flex-direction: column;
  align-items: center; gap: 2px; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  user-select: none; text-decoration: none; position: relative;
}

.pnav__center-circle {
  width: var(--nav-center-size); height: var(--nav-center-size);
  background: linear-gradient(145deg, var(--nav-accent), var(--nav-accent-deep));
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  margin-top: -20px;
  border: 3px solid var(--nav-bg);
  box-shadow: 0 0 0 1px var(--nav-border), 0 4px 16px var(--nav-glow), 0 0 24px var(--nav-glow);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  position: relative; z-index: 2;
}
.pnav__center-circle svg {
  width: 24px; height: 24px; stroke: #fff; stroke-width: 2; fill: none;
}
.pnav__center:hover .pnav__center-circle {
  transform: scale(1.06);
  box-shadow: 0 0 0 1px var(--nav-border), 0 6px 24px rgba(69,144,255,0.3), 0 0 32px rgba(69,144,255,0.25);
}
.pnav__center:active .pnav__center-circle { transform: scale(0.95); }
.pnav__center .pnav__label { color: var(--nav-text); margin-top: -2px; }
.pnav__center--active .pnav__label { color: var(--nav-accent); }

/* --- Trigger --- */
.pnav__trigger {
  position: absolute; top: -16px; left: 50%; transform: translateX(-50%);
  width: 34px; height: 16px;
  background: var(--nav-bg); border: 1px solid var(--nav-border); border-bottom: none;
  border-radius: 8px 8px 0 0;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; z-index: 100001;
}
.pnav__trigger svg {
  width: 12px; height: 8px;
  stroke: rgba(255,255,255,0.5); stroke-width: 2; fill: none;
  transition: transform 0.35s ease;
}
.pnav--hidden .pnav__trigger svg { transform: rotate(180deg); }

/* --- Responsive --- */
@media (min-width: 992px) {
  .pnav { display: none !important; }
}

@media (max-width: 374px) {
  .pnav__inner { padding: 8px 4px 6px; }
  .pnav__label { font-size: 9px; }
  .pnav__icon svg { width: 20px; height: 20px; }
  :root { --nav-center-size: 46px; }
}

/* --- Body Padding --- */
@media (max-width: 991px) {
  body {
    padding-bottom: calc(var(--nav-height) + var(--nav-safe-bottom) + 10px) !important;
  }
}
