/* Demir Konut v5.6 – alt gezinme çubuğu (yeniden tasarım) + yerel uygulama hissi
   app.css'ten SONRA yüklenir. Kimlik seçicisi (#tabbar) ile app.css'teki .tab/.fab kurallarını geçersiz kılar. */

:root {
  --tabbar-h: 64px;
  --tb-bg: color-mix(in srgb, var(--surface) 94%, transparent);
  --tb-ink: var(--ink-2);
  --tb-ink-on: var(--navy);
  --tb-pill: color-mix(in srgb, var(--accent) 20%, transparent);
  --tb-press: color-mix(in srgb, var(--ink) 8%, transparent);
  --tb-fab-bg: var(--navy);
  --tb-fab-ink: #fff;
  --tb-ring: var(--accent);
}
[data-theme="dark"] {
  --tb-bg: color-mix(in srgb, var(--surface) 92%, transparent);
  --tb-ink-on: var(--accent-2, #E2B66A);
  --tb-pill: color-mix(in srgb, var(--accent) 22%, transparent);
  --tb-press: rgba(255, 255, 255, .07);
  --tb-fab-bg: var(--accent);
  --tb-fab-ink: #14202F;
}

/* ---------------- çubuk */
#tabbar {
  height: calc(var(--tabbar-h) + var(--safe-b));
  padding: 0 max(4px, env(safe-area-inset-left)) var(--safe-b) max(4px, env(safe-area-inset-right));
  align-items: stretch;
  background: var(--tb-bg);
  border-top: 1px solid var(--line);
  box-shadow: 0 -6px 18px rgba(16, 24, 40, .04);
  transform: translateY(0);
  transition: transform .3s var(--ease-out), box-shadow .2s;
  will-change: transform;
  contain: layout paint;
}
[data-theme="dark"] #tabbar { box-shadow: 0 -6px 18px rgba(0, 0, 0, .25); }
html.tb-hidden #tabbar { transform: translateY(calc(100% + 2px)); box-shadow: none; }

/* ---------------- sekme */
#tabbar .tab {
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: flex-start;
  gap: 8px; min-width: 0; min-height: 48px; height: 100%; padding: 13px 2px 0;
  font-size: 11px; font-weight: 600; letter-spacing: .1px; line-height: 14px;
  color: var(--tb-ink); text-decoration: none; background: none; border: 0; outline: none;
  -webkit-touch-callout: none; touch-action: manipulation; transition: color .2s;
}
#tabbar .tab span { max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#tabbar .tab .ic, #tabbar .tab svg { position: relative; z-index: 1; width: 22px; height: 22px; flex: none; transform: none; transition: transform .2s var(--ease-out); }

/* etkin göstergesi: simgenin arkasında hap */
#tabbar .tab::before {
  content: ''; position: absolute; top: 8px; left: 50%; width: 56px; height: 32px; margin-left: -28px; border-radius: 16px;
  background: var(--tb-pill); opacity: 0; transform: scaleX(.45);
  transition: transform .32s var(--ease-out), opacity .2s, background-color .15s;
}
#tabbar .tab::after { display: none; content: none; }
#tabbar .tab.active { color: var(--tb-ink-on); font-weight: 700; }
#tabbar .tab.active::before { opacity: 1; transform: scaleX(1); }
#tabbar .tab.active svg { stroke-width: 2.25; }

/* dokunma geri bildirimi */
#tabbar .tab:not(.active):active::before { opacity: 1; transform: scaleX(1); background: var(--tb-press); transition-duration: .12s; }
#tabbar .tab:active svg { transform: scale(.9); }

/* klavye odak halkası */
#tabbar .tab:focus-visible::before { opacity: 1; transform: scaleX(1); box-shadow: 0 0 0 2px var(--surface), 0 0 0 4px var(--tb-ring); }
#tabbar .tab:not(.active):focus-visible::before { background: var(--tb-press); }

/* ---------------- yeni kayıt düğmesi (FAB) – çubuğa gömülü, abartısız */
#tabbar .fab {
  position: relative; justify-self: stretch; display: flex; flex-direction: column; align-items: center; justify-content: flex-start;
  gap: 8px; width: auto; height: 100%; min-height: 48px; margin: 0; padding: 13px 2px 0; border: 0; border-radius: 0;
  background: none; box-shadow: none; color: var(--tb-ink); outline: none; transform: none;
  font-size: 11px; font-weight: 600; letter-spacing: .1px; line-height: 14px; -webkit-touch-callout: none; touch-action: manipulation;
}
#tabbar .fab::before {
  content: ''; position: absolute; top: 8px; left: 50%; width: 56px; height: 32px; margin-left: -28px; border-radius: 11px;
  background: var(--tb-fab-bg);
  box-shadow: 0 1px 2px rgba(16, 24, 40, .18), 0 6px 14px color-mix(in srgb, var(--tb-fab-bg) 30%, transparent);
  transition: transform .18s var(--ease-out), box-shadow .18s;
}
#tabbar .fab .ic, #tabbar .fab svg { position: relative; z-index: 1; width: 22px; height: 22px; color: var(--tb-fab-ink); stroke-width: 2.4; transition: transform .25s var(--ease-out); }
#tabbar .fab span { position: relative; z-index: 1; white-space: nowrap; }
[data-theme="dark"] #tabbar .fab::before { box-shadow: 0 1px 2px rgba(0, 0, 0, .4); }
#tabbar .fab:active { transform: none; }
#tabbar .fab:active::before { transform: scale(.93); box-shadow: 0 1px 2px rgba(16, 24, 40, .2); }
#tabbar .fab:active svg { transform: scale(.9) rotate(90deg); }
#tabbar .fab:focus-visible::before { box-shadow: 0 0 0 2px var(--surface), 0 0 0 4px var(--tb-ring); }

/* dar ekran (≤360px) */
@media (max-width: 360px) {
  #tabbar .tab, #tabbar .fab { font-size: 10.5px; }
  #tabbar .tab::before { width: 52px; margin-left: -26px; }
  #tabbar .fab::before { width: 52px; margin-left: -26px; }
}
/* yatay telefon: yalnızca simgeler, alçak çubuk */
@media (orientation: landscape) and (max-height: 520px) {
  :root { --tabbar-h: 52px; }
  #tabbar .tab, #tabbar .fab { justify-content: center; padding-top: 0; }
  #tabbar .tab span, #tabbar .fab span { display: none; }
  #tabbar .tab::before { top: 50%; margin-top: -16px; }
  #tabbar .fab::before { top: 50%; margin-top: -16px; }
}
@media (prefers-reduced-motion: reduce) {
  #tabbar, #tabbar .tab::before, #tabbar .fab::before, #tabbar svg { transition: none !important; }
  #tabbar .fab:active svg { transform: scale(.9); }
}
@media (forced-colors: active) {
  #tabbar .tab.active { text-decoration: underline; }
  #tabbar .fab::before { border: 1px solid ButtonText; }
}

/* ---------------- yerel uygulama hissi (dokunmatik cihazlar) */
html { -webkit-tap-highlight-color: transparent; }
img, svg { -webkit-user-drag: none; }
a, button { -webkit-touch-callout: none; }
@media (pointer: coarse) {
  html { scrollbar-width: none; }
  html::-webkit-scrollbar { width: 0; height: 0; }
  .view { min-height: calc(100dvh - var(--topbar-h) - var(--safe-t)); }
}
@media (display-mode: standalone) {
  html, body { overscroll-behavior: none; }
  .topbar { padding-top: max(var(--safe-t), 0px); }
}
/* alt sayfa/arama açıkken çubuk her zaman görünür kalır (gizlenmez) */
body.noscroll #tabbar { transform: none; }
/* çubuk gizliyken alttaki yüzen öğeler aşağı iner */
html.tb-hidden .toasts { bottom: calc(var(--safe-b) + 16px); }
.toasts { transition: bottom .3s var(--ease-out); }
/* Üst çubuk: dar ekranda fazla simgeler "Diğer" penceresine taşınır */
.tb-hid { display: none !important; }