/* ===========================
   eYIKAMA styles.css (v2025-10-22)
   =========================== */

/* ------- Brand / Theme ------- */
:root{
  /* Ana marka renkleri */
  --ey-primary: #1A73E8;           /* İstersen değiştir */
  --brand:      #0ea5e9;           /* Buton rengi (primary) */
  --text:       #0f172a;           /* slate-900 */
  --muted:      #334155;           /* slate-700 */
  --line:       #cbd5e1;           /* slate-300 */
  --line-2:     #e2e8f0;           /* slate-200 */
  --bg-soft:    #f1f5f9;           /* slate-50 benzeri */
  --white:      #ffffff;
  --danger:     #ef4444;
}

/* ------- Reset / Base ------- */
html { -webkit-text-size-adjust: 100%; }
*, *::before, *::after { box-sizing: border-box; }
::placeholder { opacity: .5; }

body {
  margin: 0;
  color: var(--text);
  background: var(--bg-soft);
  width: 100%;
  overflow-x: hidden;          /* Yatay kaymayı kes */
  overscroll-behavior-x: none; /* iOS/Android kenar sarkması */
  -webkit-tap-highlight-color: transparent;
}

/* Medya taşmasını engelle */
img, svg, video, canvas { max-width: 100%; height: auto; }

/* Uzun kelimeler taşmasın */
.break-any { overflow-wrap: anywhere; word-break: break-word; }

/* Yumuşak kaydırma */
.touch-scroll { -webkit-overflow-scrolling: touch; }

/* Yatay scrollbar zıplamasını azalt (destekleyen tarayıcılar) */
.fix-ghost-scroll { scrollbar-gutter: stable both-edges; }

/* iOS input odaklanınca zoom engelle (16px kuralı) */
.no-zoom-input input,
.no-zoom-input select,
.no-zoom-input textarea { font-size: 16px; }

/* Güvenli alan / vh değişkenleri (JS ile güncellenir) */
:root {
  --vh: 1vh; /* index head içinde JS güncelliyor */
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
}

/* ------- Layout Helpers ------- */
.app-shell {
  min-height: calc(var(--vh) * 100);
  padding-bottom: calc(1rem + var(--safe-bottom));
  padding-top: calc(.25rem + var(--safe-top));
}

.h-screen-fix { min-height: calc(var(--vh) * 100); }

.container-soft { max-width: 64rem; margin: 0 auto; padding: 0 1rem; }

.w-screen-guard { width: 100%; max-width: 100%; }

.has-sticky-header { padding-top: calc(56px + var(--safe-top)); }

.sticky-bottom {
  position: fixed; left: 0; right: 0; bottom: 0;
  padding-bottom: var(--safe-bottom);
  z-index: 50;
}

/* ------- Components ------- */
.btn{
  background: var(--brand);
  color: var(--white);
  padding: .7rem 1rem;
  border-radius: .75rem;
  font-weight: 600;
  display: inline-block;
  text-align: center;
  border: none;
  cursor: pointer;
}
.btn:hover{ opacity:.95; }

.btn-secondary{
  background: var(--white);
  color: var(--text);
  border:1px solid var(--line);
  padding:.6rem .9rem;
  border-radius:.75rem;
  font-weight:600;
  display:inline-block;
}

.btn-ghost{
  background: transparent;
  color: var(--text);
  border:1px solid var(--line);
  padding:.5rem .9rem;
  border-radius:.75rem;
  font-weight:600;
  display:inline-flex;
  align-items:center;
  gap:.5rem;
}

.label{ display:block; font-size:.85rem; color: var(--muted); margin-bottom:.25rem; }

.input{
  border:1px solid var(--line);
  border-radius:.75rem;
  padding:.6rem .8rem;
  width:100%;
  background: var(--white);
}
.input:focus{
  outline: none;
  border-color: var(--brand);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 20%, transparent);
}

.card{
  background: var(--white);
  border:1px solid var(--line-2);
  border-radius:1rem;
  padding:1rem;
}

.badge{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:1.5rem; height:1.5rem;
  border-radius:9999px;
  background: var(--danger);
  color: var(--white);
  font-size:.75rem; font-weight:700;
  padding:0 .35rem;
}

.icon-wa{ width:22px; height:22px; display:inline-block; vertical-align:middle; }

/* Tabs */
.tab{
  padding:.6rem 1rem;
  border-radius:.75rem;
  border:1px solid var(--line);
  background: var(--white);
  font-weight:600;
}
.tab.active{ background: var(--brand); color: var(--white); border-color: var(--brand); }

.tab-row { display:flex; flex-wrap:wrap; gap:.5rem; }
.tab-row .tab { white-space: nowrap; }

/* Screen switcher */
.screen{ display:none; }
.screen.active{ display:block; }

/* Hızlı aksiyon grid */
.action-grid { display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap:.5rem; }
@media (max-width: 400px) { .action-grid { grid-template-columns: repeat(3, minmax(0,1fr)); } }

/* Hizmet kartlarına el işareti */
.svc{ cursor:pointer; }

/* ------- Track & Modal Guards (p15.2) ------- */
#trackResult { overflow: hidden; }
#trackResult .timeline{
  display:flex; gap:.5rem;
  overflow-x:auto; -webkit-overflow-scrolling:touch;
  padding:.25rem 0;
}
#trackResult .timeline > *{ flex:0 0 auto; }

#cartModal{ -webkit-overflow-scrolling: touch; }
#cartModal .sheet{
  overscroll-behavior: contain;
  max-height: calc(var(--vh) * 92);
  overflow: auto;
}
#cartItems{
  max-height: calc(var(--vh) * 40);
  overflow: auto;
}

/* ------- Splash Overlay ------- */
/* HTML açılış overlay (index’teki #launch) */
.launch-screen{
  position:fixed; inset:0;
  background: #fff;
  display:flex; align-items:center; justify-content:center;
  z-index: 999999;
}
.launch-screen .mark{ width:min(38vw,160px); height:auto; opacity:.98; }
.launch-hide{ opacity:0; visibility:hidden; transition:opacity .24s ease, visibility 0s linear .24s; }

/* PWA (standalone) modunda ikinci splash'ı tamamen kes */
.pwa .launch-screen{ display:none !important; }