/* ==========================================================================
   mobil.css — Tüm herkese açık sayfalarda, sayfanın kendi CSS'inden SONRA yüklenir.
   Masaüstü görünümüne dokunmaz: hepsi @media içinde.
   (Menü/hamburger kuralları navbar.php içinde.)
   ========================================================================== */

/* ---------- Tüm ekranlar: şifre / e-posta / url kutuları da metin kutusu gibi görünsün (giriş, kayıt, şifre sayfaları) ---------- */
.form-grup input[type=password], .form-grup input[type=email], .form-grup input[type=url], .form-grup input[type=search]{
  width:100%; border:1px solid var(--border, #d7dce1); border-radius:6px; padding:10px 12px; font-size:13.5px; font-family:inherit;
}

/* mobilde JS ile eklenen arama simgesi; masaüstünde görünmez */
.ts-ara-ac{ display:none; }

/* ---------- Tablet ve altı: üç sütun → tek sütun, sidebar'lar içeriğin altına ---------- */
@media (max-width: 1050px){
  .main{ display:flex !important; flex-direction:column; gap:16px; padding:14px 16px; }
  .main > *{ min-width:0; width:100%; }
  .main > .sidebar-left{ order:2; }
  .main > .sidebar-right{ order:3; }
  .main > :not(.sidebar-left):not(.sidebar-right){ order:1; }
}

/* ---------- Telefon ---------- */
@media (max-width: 768px){
  html{ -webkit-text-size-adjust:100%; }
  html, body{ overflow-x:hidden; }
  body{ font-size:15px; }
  img, video, iframe{ max-width:100%; }
  .wrap{ padding:0 12px; }
  .wrap > .main, .main{ padding:12px 0; }

  /* --- üst şerit: kayan yazı solda, sağ üstte 🔍 simgesi; tıklayınca arama kutusu alt satırda açılır --- */
  .topstrip{ flex-direction:row; flex-wrap:wrap; align-items:center; gap:0; padding:0 8px 0 12px; min-height:44px; }
  .topstrip .msg{ flex:1; margin-right:8px; font-size:12px; min-width:0; }
  .topstrip .right{ display:contents !important; }
  .ts-ara-ac{ display:flex; align-items:center; justify-content:center; width:44px; height:44px; background:none; border:none; color:#fff; cursor:pointer; flex-shrink:0; }
  .topstrip.ara-acik .ts-ara-ac{ color:var(--blue, #1e88c7); }
  .topstrip .search-mini{ display:none; order:3; flex:1 1 100%; margin:0 0 8px 0; }
  .topstrip.ara-acik .search-mini{ display:flex; }
  .search-mini input{ flex:1; width:auto; min-width:0; padding:11px 12px; font-size:16px; }
  .search-mini button{ padding:10px 16px; }

  /* --- logo solda; Giriş/Kayıt ve kullanıcı bilgisi menünün içine taşındı --- */
  .header-inner{ flex-direction:row; justify-content:flex-start; align-items:center; padding:10px 12px; }
  .logo{ justify-content:flex-start; width:auto; max-width:100%; }
  .logo img{ height:auto !important; max-height:56px; width:auto; max-width:100%; }
  .badge-clean{ display:none; }
  .header-actions{ display:none !important; }

  /* --- renkli kutucuklar (varsa) yatay kaydırılır --- */
  .tiles .wrap{ padding:0; -webkit-overflow-scrolling:touch; }
  .tile{ min-width:110px; padding:12px 8px; }

  /* --- ekmek kırıntısı --- */
  .breadcrumb{ padding:9px 12px; font-size:12px; overflow-x:auto; white-space:nowrap; }

  /* --- sidebar kutuları: "Öne Çıkanlar" yatay kaydırmalı kartlar --- */
  .sidebar-left .featured-box{ flex-direction:row; overflow-x:auto; gap:10px; padding:10px; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch; }
  .sidebar-left .featured-card{ min-width:230px; max-width:260px; flex-shrink:0; scroll-snap-align:start; }
  .sidebar-right .tool-item{ padding:12px 14px; }
  .box-title{ padding:12px 14px; font-size:14px; }

  /* --- içerik kartları --- */
  .article{ padding:14px; border-radius:6px; }
  .article h1{ font-size:18px; line-height:1.35; align-items:flex-start; }
  .author-line{ line-height:1.6; }
  .desc, .yazi-ozet{ font-size:14px; line-height:1.75; text-align:left; overflow-wrap:anywhere; }
  .desc img{ height:auto; border-radius:4px; }
  .desc pre, .desc table{ display:block; overflow-x:auto; max-width:100%; }
  .prog-cover{ margin:10px 0 14px; }
  .box-3d{ width:min(210px, 62vw); height:auto; aspect-ratio:230 / 290; }
  .official-note, .updated-line{ font-size:13px; }
  .mini-galeri img{ height:84px; }

  /* ana sayfa kartındaki indirme özeti alt alta */
  .mini-indirme{ flex-direction:column; align-items:flex-start; gap:8px; }
  .mini-indirme-link, .mini-indirme-etiket-link{ font-size:14px; padding:4px 0; }
  .meta-row{ flex-direction:column; align-items:stretch; gap:10px; }
  .meta-row .date-chip{ justify-content:center; }
  .meta-row a{ display:block; }
  .readmore{ width:100%; padding:12px 14px; font-size:14px; border-radius:6px; }

  /* --- program sayfası --- */
  .meta-line{ gap:8px 14px; }
  .galeri-serit{ -webkit-overflow-scrolling:touch; }
  .galeri-serit img{ height:110px; }
  .video-izgara{ grid-template-columns:1fr; }
  .akordiyon-baslik{ padding:14px; font-size:14px; }
  .akordiyon-icerik{ padding:14px 10px; }
  .akordiyon-link{ display:inline-block; padding:6px 0; font-size:14px; }
  .lightbox{ padding:10px; }
  .lightbox-kapat{ top:10px; right:16px; }

  /* --- kategori / arama / profil listeleri: kapak üstte değil solda kalsın ama daha küçük --- */
  .kat-main{ padding:0 !important; }
  .kat-head-row{ margin-bottom:12px; }
  .kat-head-row h1{ font-size:18px; }
  .yazi-blok{ gap:12px; }
  .yazi-kapak-3d{ width:72px; height:92px; font-size:15px; }
  .yazi-baslik{ font-size:15px; line-height:1.35; }
  .yazi-blok .meta-row{ flex-direction:row; align-items:center; }
  .yazi-blok .readmore{ width:auto; padding:9px 12px; font-size:13px; }
  .yazi-blok .meta-row a{ display:inline-block; }

  /* kategoriler sayfası */
  .kategori-satir{ padding:14px 12px; }

  /* --- sayfalama: sığmazsa alta iner, dokunması kolay --- */
  .sayfalama{ flex-wrap:wrap; gap:6px; padding:12px 0; }
  .sayfalama a, .sayfalama span{ min-width:40px; height:40px; }

  /* --- formlar (giriş, kayıt, istek, telif, şifre) --- */
  .istek-main, .telif-main{ padding:14px 12px !important; margin:0 auto; }
  .istek-kutu, .telif-form-kutu, .telif-metin-kutu{ padding:18px 14px !important; border-radius:8px; }
  .form-grup input, .form-grup textarea, .form-grup select,
  input[type=text], input[type=email], input[type=password], input[type=url], input[type=search], textarea, select{
    font-size:16px !important; /* iOS'ta odaklanınca sayfa zoom yapmasın */
  }
  .form-grup input, .form-grup textarea, .form-grup select{ padding:12px !important; }
  .istek-gonder-btn, .telif-gonder-btn{ width:100%; padding:14px !important; font-size:15px; }
  /* captcha satırı: resim + yenile + kod kutusu sığmazsa kod kutusu alta iner */
  .captcha-satiri{ flex-wrap:wrap; }
  .captcha-satiri img{ max-width:60%; height:auto; }
  .captcha-satiri input{ flex:1 1 100%; min-width:0; width:100%; padding:12px !important; border:1px solid var(--border); border-radius:6px; }

  /* --- yorumlar --- */
  .yorum-form-kutu textarea{ min-height:110px; }

  /* --- alt bilgi --- */
  footer{ padding:18px 12px 84px; /* sağ alttaki robota yer bırak */ }

  /* --- Hızlı Arama Robotu: küçük ve köşeye yakın, panel ekrana sığar --- */
  .robot-sabit{ right:14px; bottom:14px; }
  .robot-halka{ width:52px; height:52px; }
  .robot-halka::before, .robot-halka::after{ width:52px; height:52px; }
  .robot-halka svg{ width:26px; height:26px; }
  .robot-tooltip{ display:none; }
  .robot-panel{ right:10px; left:10px; width:auto; bottom:76px; max-height:65vh; }
  .robot-panel-alt input{ font-size:16px; }
}

/* ---------- Dar telefonlar ---------- */
@media (max-width: 380px){
  .article h1{ font-size:17px; }
  .yazi-kapak-3d{ width:60px; height:78px; }
  .sayfalama a, .sayfalama span{ min-width:36px; height:36px; padding:0 6px; }
}

/* Dokunmatik cihazlarda hover'a bağlı efektleri devre dışı bırak */
@media (hover: none){
  .galeri-serit img:hover{ transform:none; }
}
