/*! Mobile Responsive Boost — touch-friendly, no-overflow, optimized inputs */
*, *::before, *::after { box-sizing: border-box; }

html, body {
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  text-size-adjust: 100%;
  overflow-x: hidden !important;
  max-width: 100vw;
}

img, video, iframe, picture, embed, object, svg {
  max-width: 100% !important;
  height: auto;
  display: inline-block;
}

/* Touch target ≥44x44px (Apple HIG / Material) */
@media (max-width: 768px) {
  button, a.btn, a.button, [role="button"], input[type="button"], input[type="submit"],
  .nav-link, .menu-item a, .pkg-btn, .package-btn, .checkout-btn, .submit-btn,
  .hamburger, .lang-btn, .cart-link, .seo-link-row, .quick-btn {
    min-height: 44px !important;
    min-width: 44px !important;
    padding: 10px 16px !important;
  }

  /* Form input optimize — iOS zoom önle */
  input, select, textarea {
    font-size: 16px !important;
    line-height: 1.4 !important;
    min-height: 44px !important;
    padding: 12px 14px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    border-radius: 8px !important;
  }

  textarea {
    min-height: 88px !important;
  }

  /* Container - tüm sabit genişlikleri ekrana sığdır */
  .container, .wrap, .wrapper, .page-wrap, .content, main {
    width: 100% !important;
    max-width: 100vw !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* Tipografi - okunabilir font */
  body, p, li, td, label, span {
    font-size: 15px !important;
    line-height: 1.55 !important;
  }
  h1 { font-size: clamp(26px, 6vw, 36px) !important; line-height: 1.2 !important; }
  h2 { font-size: clamp(20px, 5vw, 28px) !important; line-height: 1.25 !important; }
  h3 { font-size: clamp(17px, 4vw, 22px) !important; line-height: 1.3 !important; }
  h4 { font-size: 16px !important; line-height: 1.3 !important; }

  /* Tablo - horizontal scroll yerine kart formatı */
  table {
    display: block !important;
    overflow-x: auto !important;
    max-width: 100% !important;
    -webkit-overflow-scrolling: touch;
  }

  /* Modal/Popup mobil uyumlu */
  .modal, .popup, .dialog, [class*="modal"], [class*="popup"] {
    max-width: calc(100vw - 24px) !important;
    margin: 12px !important;
  }
  .modal-content, .popup-content {
    max-height: calc(100vh - 60px) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  /* Grid - mobilde tek kolon veya 2 kolon */
  .packages, .package-grid, .pkg-grid, .package-list,
  [class*="grid"]:not(.no-mobile-stack):not(.h2-grid):not(.h3-grid) {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  @media (min-width: 480px) {
    .packages, .package-grid, .pkg-grid, .package-list {
      grid-template-columns: repeat(2, 1fr) !important;
    }
  }

  /* Footer cols stacked */
  footer .footer-col, footer .col, .footer-content > div, .footer-grid > div {
    width: 100% !important;
    margin-bottom: 18px !important;
  }
  .footer-grid {
    grid-template-columns: 1fr !important;
  }

  /* Eski sabit genişlikli element override */
  [style*="width:"][style*="px"]:not([style*="100%"]):not([style*="auto"]) {
    max-width: 100% !important;
  }

  /* Header logo - taşmasın */
  header .logo, header .logo-icon, .top-bar img, header img {
    max-height: 100px !important;
    width: auto !important;
  }

  /* Cart, hamburger - büyük touch */
  .hamburger, .menu-toggle, .cart-link, .nav-icon {
    width: 44px !important;
    height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
}

/* Telefon küçük (≤375px) — extra compact */
@media (max-width: 375px) {
  .container, .wrap { padding-left: 12px !important; padding-right: 12px !important; }
  h1 { font-size: 22px !important; }
  h2 { font-size: 18px !important; }
}

/* Tablet (768-1024) optimize */
@media (min-width: 768px) and (max-width: 1024px) {
  .container, .wrap, .wrapper { max-width: 95% !important; }
  .packages, .package-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* iOS notch / safe-area */
body { padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right); }

/* Smooth scroll */
html { scroll-behavior: smooth; }

/* Tap highlight kapat (modern look) */
a, button, input, select, textarea {
  -webkit-tap-highlight-color: rgba(0,0,0,0.05);
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* Tüm "Popüler" rozetlerini gizle */
.popular-badge,.popular_badge,.pop-badge,.popular_label{display:none!important;visibility:hidden!important;opacity:0!important;width:0!important;height:0!important;position:absolute!important;left:-9999px!important;pointer-events:none!important}


/* === JetonGames Header Fix: Logo sola, hamburger en sağa, switcher sağda === */
.top-bar {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
}
.top-bar .logo-section {
  order: 0 !important;
  margin: 0 !important;
}
.top-bar > *:not(.logo-section) {
  order: 99 !important;
  margin-left: 0 !important;
}
#jg-locale-switcher {
  order: 90 !important;
  margin-left: auto !important;
  margin-right: 8px !important;
}
.top-bar .mobile-menu,
.top-bar .menu-toggle,
.top-bar .hamburger,
.top-bar .nav-toggle,
.top-bar [id*="menuToggle"],
.top-bar [id*="MenuToggle"] {
  order: 100 !important;
  margin-left: 0 !important;
}

/* === Tüm eski dil widget'ları agresif gizle === */
#langSelect,
#mobileLangIcon,
#mobileLangPopup,
#mobileLangSelect,
.lang-select-simple,
.mobile-lang-icon-simple,
.mobile-lang-popup,
.mobile-lang-bar,
[onclick*="toggleMobileLangMenu"],
[onclick*="MobileLang"],
[onclick*="langMenu"],
.language-selector:not(#jg-locale-switcher),
.lang-button:not(.jg-lng-btn) {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  position: absolute !important;
  left: -9999px !important;
  pointer-events: none !important;
}

@media (max-width: 768px) {
  .top-bar { padding: 10px 14px !important; gap: 8px !important; }
}