/* ═══════════════════════════════════════════════════════════════════════════
   RistayCraft — TABLET KATMANI · DESKTOP TEMASI İÇİN
   ---------------------------------------------------------------------------
   YALNIZCA desktop teması yüklendiğinde enqueue edilir (functions.php).
   Kimi kapsar: iPad Safari — iPadOS 13+ masaüstü kimliği gönderdiği için
   wp_is_mobile() false döner ve desktop teması yüklenir.

   main.css'e TEK BAYT dokunulmaz. RC_TABLET=false → bu dosya hiç yüklenmez.
   1200px ve üzeri HİÇ ETKİLENMEZ → geniş ekran desktop aynen kalır.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════════════════════════
   A) DESKTOP HTML → TABLET   (768–1199px)
   main.css'te 17 seçici SABİT 1300px genişlik kullanıyor; 834px'lik iPad'de
   bunlar ekrandan taşıyor (yatay kaydırma + kırık düzen). Burada akışkan
   hale getiriliyor ve ızgaralar tablete indiriliyor.
   1200px ve üzeri HİÇ ETKİLENMEZ → geniş ekran desktop aynen kalır.
   ═══════════════════════════════════════════════════════════════════════════ */
@media (min-width: 768px) and (max-width: 1199px) {

  /* 1300px sabit konteynerler → akışkan */
  .header-inner, .footer-inner, .hero-inner, .stats-inner, .filter-inner,
  .product-grid, .pd-inner, .pd-desc-box, .pd-breadcrumb-inner,
  .ds-hero-inner, .ds-pricing-inner, .ds-pricing-note, .ds-contact-inner,
  .shop-carousel-outer, .cat-section-title, .header-row2, .rc-hero {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  /* Kenar boşluğu — içerik kenara yapışmasın */
  .header-inner, .footer-inner, .hero-inner, .stats-inner, .filter-inner,
  .pd-inner, .ds-hero-inner, .ds-pricing-inner, .ds-contact-inner,
  .header-row2, .rc-hero, .product-grid {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }

  /* ── Izgaralar: tablet ölçeği ── */
  .product-grid      { grid-template-columns: repeat(3, 1fr) !important; gap: 18px !important; }
  .rc-hero           { grid-template-columns: 1fr !important; gap: 14px !important; }   /* 3 panel alt alta */
  /* DÜZELTME (canlı test): .rc-pan height:580px SABİT — tablette tam genişlik
     olunca dev kutu oluyor, başlık üstte / buton en altta, arada koca boşluk.
     Tablette banner yüksekliğine indiriyorum; iç öğeler yakınlaşıp toparlanıyor. */
  .rc-pan            { height: 280px !important; }
  .rc-phead          { top: 26px !important; left: 28px !important; font-size: 30px !important; }
  .rc-txt            { padding: 20px 26px !important; }
  .rc-txt p          { font-size: 16px !important; margin-bottom: 12px !important; }
  .header-row2       { grid-template-columns: repeat(3, 1fr) !important; gap: 8px !important; }
  .hero-inner        { grid-template-columns: 1fr !important; }
  .stats-inner       { grid-template-columns: repeat(3, 1fr) !important; }
  .footer-inner      { grid-template-columns: 1fr 1fr 1fr !important; gap: 24px 18px !important; }
  .ds-pricing-inner  { grid-template-columns: repeat(2, 1fr) !important; gap: 18px !important; }
  .ds-contact-inner  { grid-template-columns: 1fr !important; gap: 24px !important; }
  .ds-showcase-grid  { grid-template-columns: repeat(3, 1fr) !important; gap: 18px !important; }

  /* ÜRÜN DETAY: desktop 2 sütun (650+650=1300px) tablette ekrandan taşıyordu
     ("desktop bozuk yükleniyor"). Tablette TEK sütuna indir: galeri üstte,
     bilgi altta. Galeri ortalı ve tam genişlik. */
  .pd-inner         { grid-template-columns: 1fr !important; gap: 22px !important; }
  .pd-gallery       { padding: 0 !important; }
  .pd-gallery-inner { max-width: 520px !important; margin: 0 auto !important; }

  /* (rc-pan yüksekliği yukarıda 280px olarak veriliyor — aspect-ratio kaldırıldı,
     ikisi çakışıyordu) */

  /* Başlık/tipografi ölçeği */
  .logo            { font-size: 34px !important; }
  .rc-phead        { font-size: 26px !important; }
  .section-title   { font-size: 30px !important; }
  .ds-hero-h1      { font-size: 44px !important; }
  .ds-hero-h1--large { font-size: 56px !important; }
  .ds-price-title  { font-size: 18px !important; }
  .ds-price-amount { font-size: 44px !important; }
  .ds-price-sub    { font-size: 15px !important; }

  /* Kategori paneli tablette daha dar */
  .cat-drawer { width: 280px !important; }
  /* CATEGORIES sekmesi tablette ilk hero panelinin üstüne biniyordu.
     Header'ın hemen altından, hero'nun BİRAZ altına indiriyorum ki
     çakışmasın; kaydırınca zaten sabit kalır. */
  .cat-tab { top: calc(var(--rc-hdr-h, 68px) + 300px) !important; }

  /* Yatay taşmayı kesin engelle */
  html, body { overflow-x: hidden !important; }
}