/* Çınar Motor Tente — MOBİL üst alan (4d). Sadece ≤768px'te geçerli; masaüstüne dokunmaz.
   Kaynak: ~/Downloads/Claude Code 4d Mobil (css/cinar-mobil-header.css) — site yapısına uyarlandı:
   - Arama: ayrı .cmt-m-searchbox yerine header'daki mevcut .cmt-search formu (action urunler.html,
     name="ara", öneri listesi) mobilde header'ın altında tam genişlik açılır.
   - Şerit mesajları .cmt-ticker'a JS ile mevcut .announce-item'lardan kopyalanır (js/cinar-ui.js);
     panelden değişen metinler de döner. JS yoksa şerit ilk mesajı sabit gösterir.
   Tüm stiller en sona yüklenir (cinar-header.css ve cinar-yukleme.css'ten sonra). */

@media (max-width:768px){
  html{scroll-padding-top:124px}   /* çapa linkleri sabit başlığın altında kalmasın */
  .cmt-sticky{position:sticky;top:0;z-index:40;box-shadow:0 4px 12px rgba(21,40,66,.1)}

  /* Koyu şerit + dönen mesajlar */
  .cmt-top{height:32px;overflow:hidden;background:#0b1a2e;padding:0 14px 0 128px;
    font:11px 'IBM Plex Mono',monospace;color:#cbd5e1;white-space:nowrap;display:block}
  .cmt-top.has-ticker > :not(.cmt-ticker){display:none}
  .cmt-top:not(.has-ticker) > .announce-item:first-of-type{display:flex;height:32px;align-items:center}
  .cmt-top:not(.has-ticker) > :not(.announce-item:first-of-type){display:none}
  .cmt-ticker{display:flex;flex-direction:column;transition:transform .5s cubic-bezier(.4,0,.2,1)}
  .cmt-ticker > span{height:32px;flex-shrink:0;display:flex;align-items:center;gap:8px}
  .cmt-top i{color:#f59e0b;margin-right:0}
  .cmt-top b,.cmt-top strong{color:#fff;font-weight:600}

  /* Header: rozet + 3 buton */
  .cmt-header{position:relative;background:#fff;height:80px;padding:0 14px 0 128px;
    display:flex;align-items:center;justify-content:flex-end;gap:8px;border-bottom:1px solid #e5e2d8}
  .cmt-badge{position:absolute;left:14px;top:-22px;z-index:2;width:100px;height:100px;border-radius:50%;
    background:#fff;border:3px solid #c8922e;box-sizing:border-box;box-shadow:0 6px 16px rgba(21,40,66,.2);
    display:flex;align-items:center;justify-content:center}
  .cmt-badge img{width:90px;height:90px;display:block}
  .cmt-header > :not(.cmt-badge):not(.cmt-m){display:none}
  .cmt-m{display:flex;width:44px;height:44px;border-radius:4px;align-items:center;justify-content:center;
    border:0;cursor:pointer;box-sizing:border-box;text-decoration:none}
  .cmt-m-search{background:#f2f1ec;border:1px solid #deddd4;color:#152842;font-size:16px}
  .cmt-m-wa{background:#0f766e;color:#fff;font-size:19px}
  .cmt-m-menu{background:#152842;color:#fff;font-size:17px}

  /* Açılır arama — header'ın altında tam genişlik (mevcut .cmt-search formu) */
  body.cmt-search-open .cmt-header > .cmt-search{display:block;position:absolute;left:0;right:0;top:100%;
    background:#fff;padding:12px 14px;border-bottom:1px solid #e5e2d8;z-index:15}
  body.cmt-search-open .cmt-search label{height:46px;max-width:none;background:#f2f1ec;border:1px solid #deddd4;border-radius:4px;
    display:flex;align-items:center;gap:12px;padding:0 14px;box-sizing:border-box}
  body.cmt-search-open .cmt-search input{font:14px 'IBM Plex Sans',sans-serif}

  /* Kategori sekmeleri — sticky DEĞİL, sayfayla kayar */
  .cmt-nav{position:static;background:#fff;height:50px;padding:0 6px;display:flex;align-items:stretch;gap:0;
    border-bottom:1px solid #e5e2d8;font:500 14px 'IBM Plex Sans',sans-serif;overflow-x:auto;scrollbar-width:none}
  .cmt-nav::-webkit-scrollbar{display:none}
  .cmt-nav a{flex-shrink:0;display:flex;align-items:center;gap:8px;padding:0 12px;color:#152842;
    text-decoration:none;border-bottom:3px solid transparent;white-space:nowrap}
  .cmt-nav a i{font-size:12px}
  .cmt-nav a.is-active{border-bottom-color:#c2410c}
  .cmt-nav a.cmt-special{color:#c2410c}
  .cmt-nav .cmt-long{display:none}
  .cmt-nav .cmt-m-only{display:inline}
}
@media (min-width:769px){ .cmt-ticker,.cmt-m{display:none} }
.cmt-m-only{display:none}   /* mobilde .cmt-nav içinde görünür (yukarıda) */
@media (prefers-reduced-motion:reduce){ .cmt-ticker{transition:none} }
