/* ============================================================
   ElmaFM — MOBİL
   ------------------------------------------------------------
   Tema1'in görsel dili AYNEN korunur: aynı palet, aynı yazı
   tipleri, ince çizgiler, keskin köşeler, gölge yok.
   Değişen yalnızca DAVRANIŞ — telefonda site bir uygulama gibi
   çalışır: altta sekme çubuğu, yapışık player, tek sütun akış.

   Tüm kurallar @media içindedir; masaüstü görünüm birebir aynıdır.

   Palet (Tema1):
     zemin #F3EFE7 · mürekkep #141824 · vurgu #8C1C13
     lacivert #22304A · çizgi #E2DCD0 · soluk #8A90A0 · bej #B6AE9E
   ============================================================ */

/* Mobil parçalar masaüstünde yok. */
.t1-sekme,
.t1-menu-ac,
.t1-menu-panel { display: none; }

@media (max-width: 860px) {

  html, body { overflow-x: hidden; }

  /* Alt sekme + player kadar boşluk bırak, son satır altta kalmasın. */
  .t1-govde {
    /* Üstte player (60px + çentik), altta sekme çubuğu kadar boşluk. */
    padding-top: calc(60px + env(safe-area-inset-top)) !important;
    padding-bottom: calc(72px + env(safe-area-inset-bottom)) !important;
    max-width: 100% !important;
  }

  /* ---------- üst şerit: şu an yayında ---------- */
  .t1-serit {
    flex-wrap: wrap !important;
    gap: 4px 12px !important;
    padding: 8px 16px !important;
    font-size: 11px !important;
    line-height: 1.4;
  }

  /* ---------- üst menü: logo solda, yatay kayan menü altta ---------- */
  .t1-header {
    grid-template-columns: 1fr auto !important;
    gap: 10px 12px !important;
    padding: 14px 16px !important;
    background: #F3EFE7;
  }
  .t1-logo span { font-size: 26px !important; }

  /* Üstteki yatay menü ve canlı dinle düğmesi mobilde yok:
     menü hamburger'a, dinleme alt çubuğa taşındı. */
  .t1-nav { display: none !important; }
  .t1-cta { display: none !important; }

  /* ---------- hamburger ---------- */
  /* Üç çizgi; Tema1'de yuvarlak köşe ve gölge yok, burada da yok. */
  .t1-menu-ac {
    display: flex; flex-direction: column; justify-content: center;
    gap: 5px;
    width: 44px; height: 44px;
    padding: 0 10px;
    margin-right: -10px;
    border: 0; background: none; cursor: pointer;
  }
  .t1-menu-ac span {
    display: block; height: 1.5px; width: 100%;
    background: #141824;
    transition: transform .18s ease, opacity .18s ease;
  }
  .t1-menu-ac[aria-expanded="true"] span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
  .t1-menu-ac[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .t1-menu-ac[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

  /* ---------- tam ekran menü ---------- */
  .t1-menu-panel {
    display: flex; flex-direction: column;
    position: fixed; inset: 0; z-index: 200;   /* player ve sekme çubuğunun üstünde */
    background: #141824;
    color: #F3EFE7;
    padding: env(safe-area-inset-top) 20px calc(20px + env(safe-area-inset-bottom));
  }
  .t1-menu-panel[hidden] { display: none; }

  .t1-menu-ust {
    display: flex; align-items: center; justify-content: space-between;
    height: 64px;
    border-bottom: 1px solid #2A3245;
    margin: 0 -20px;
    padding: 0 20px;
  }
  .t1-menu-logo {
    font-family: 'Instrument Serif', serif;
    font-size: 26px; line-height: 1;
    display: flex; align-items: baseline; gap: 6px;
  }
  .t1-menu-logo em { font-style: italic; color: #B6AE9E; }
  .t1-menu-kapat {
    width: 44px; height: 44px; margin-right: -10px;
    display: grid; place-items: center;
    border: 0; background: none; cursor: pointer;
    color: #F3EFE7;
  }
  .t1-menu-kapat svg { width: 22px; height: 22px; }

  /* Menü maddeleri: büyük serif, ince ayırıcı — Tema1'in liste dili. */
  .t1-menu-liste { display: flex; flex-direction: column; margin: 0 -20px; }
  .t1-menu-liste a {
    display: flex; align-items: center; justify-content: space-between;
    gap: 16px;
    min-height: 62px;
    padding: 0 20px;
    border-bottom: 1px solid #222B3D;
    font-family: 'Instrument Serif', serif;
    font-size: 27px;
    color: #F3EFE7;
    text-decoration: none;
  }
  .t1-menu-liste a svg { width: 18px; height: 18px; color: #6E7484; flex: none; }
  .t1-menu-liste a.acik { color: #E8B4A0; }
  .t1-menu-liste a.acik svg { color: #E8B4A0; }
  .t1-menu-liste a:active { background: #1A2130; }

  /* Altta yayın durumu — menüyü kapatmadan ne çaldığı görünsün. */
  .t1-menu-alt {
    margin-top: auto;
    display: flex; flex-direction: column; gap: 6px;
    padding-top: 22px;
    font-family: 'Manrope', system-ui, sans-serif;
  }
  .t1-menu-durum {
    display: flex; align-items: center; gap: 9px;
    font-size: 13px; font-weight: 600; color: #F3EFE7;
  }
  .t1-menu-durum i {
    width: 7px; height: 7px; border-radius: 50%;
    background: #8C1C13; flex: none;
  }
  .t1-menu-hafta { font-size: 12px; color: #6E7484; }

  /* ---------- bölümler: tek sütun ---------- */
  section[style*="grid-template-columns: 1.55fr 1fr"],
  section[style*="grid-template-columns: 1.2fr 1fr"],
  section[style*="grid-template-columns: 1.4fr 1fr"],
  section[style*="grid-template-columns: 420px 1fr"],
  section[style*="grid-template-columns: 1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }

  /* Sütun ayıracı olan dikey çizgi, tek sütunda yatay çizgiye döner. */
  article[style*="border-right: 1px solid #D8D1C4"],
  div[style*="border-right: 1px solid #D8D1C4"] {
    border-right: 0 !important;
    border-bottom: 1px solid #D8D1C4 !important;
  }

  /* Geniş yan boşluklar telefonda 16px. */
  section[style*="padding: 0 40px"]    { padding: 0 16px !important; }
  section[style*="padding: 54px 40px"] { padding: 30px 16px 0 !important; }
  section[style*="padding: 52px 40px"] { padding: 30px 16px 0 !important; }
  section[style*="padding: 48px 40px"] { padding: 26px 16px 20px !important; }
  section[style*="padding: 38px 40px"] { padding: 22px 16px 0 !important; }
  section[style*="padding: 34px 40px"] { padding: 20px 16px 0 !important; }
  article[style*="padding: 44px 40px 48px"] { padding: 26px 16px 30px !important; }
  article[style*="padding: 38px 40px 48px"] { padding: 22px 16px 30px !important; }
  div[style*="padding: 34px 40px 40px"]     { padding: 20px 16px 26px !important; }
  div[style*="padding: 30px 32px 20px"]     { padding: 18px 16px 12px !important; }
  div[style*="padding: 26px 32px 30px"]     { padding: 18px 16px 22px !important; }
  div[style*="padding: 38px 40px 44px"]     { padding: 22px 16px 28px !important; }
  div[style*="padding: 24px 40px"]          { padding: 16px !important; }
  div[style*="padding: 28px 40px 34px"]     { padding: 20px 16px 24px !important; }
  div[style*="padding: 15px 32px"]          { padding: 13px 16px !important; }

  /* ---------- başlıklar: serif kalır, ölçü küçülür ---------- */
  h1[style*="font-size: 58px"] { font-size: 32px !important; }
  h1[style*="font-size: 54px"] { font-size: 30px !important; }
  h1[style*="font-size: 48px"] { font-size: 28px !important; }
  h2[style*="font-size: 42px"] { font-size: 25px !important; }
  h2[style*="font-size: 40px"] { font-size: 24px !important; }
  h2[style*="font-size: 36px"] { font-size: 23px !important; }
  h2[style*="font-size: 34px"] { font-size: 22px !important; }
  h2[style*="font-size: 30px"] { font-size: 21px !important; }

  /* Uzun paragrafların max-width'i telefonda anlamsız. */
  p[style*="max-width: 700px"], p[style*="max-width: 660px"],
  p[style*="max-width: 640px"], p[style*="max-width: 620px"],
  h1[style*="max-width: 700px"] { max-width: 100% !important; }

  /* Görsel yükseklikleri telefonda orantılı. */
  img[style*="height: 400px"] { height: 230px !important; }
  img[style*="height: 340px"] { height: 220px !important; }
  img[style*="height: 320px"] { height: 200px !important; }
  img[style*="height: 280px"] { height: 240px !important; }
  img[style*="height: 184px"], img[style*="height: 170px"] { height: 180px !important; }

  /* ---------- Top 10 satırı: 6 sütun telefona sığmaz ---------- */
  /* sıra | kapak | şarkı üstte; sanatçı-hareket-hafta alt satıra akar */
  div[style*="grid-template-columns: 62px 64px 1fr 240px 120px 110px"],
  div[style*="grid-template-columns: 58px 56px 1fr 220px 110px 100px"] {
    grid-template-columns: 40px 52px 1fr !important;
    gap: 2px 12px !important;
    padding: 12px 0 !important;
  }
  div[style*="grid-template-columns: 62px 64px 1fr 240px 120px 110px"] > *:nth-child(n+4),
  div[style*="grid-template-columns: 58px 56px 1fr 220px 110px 100px"] > *:nth-child(n+4) {
    grid-column: 3 / -1 !important;
    text-align: left !important;
  }
  div[style*="grid-template-columns: 62px 64px 1fr 240px 120px 110px"] span[style*="font-size: 30px"],
  div[style*="grid-template-columns: 58px 56px 1fr 220px 110px 100px"] span[style*="font-size: 27px"] {
    font-size: 21px !important;
  }
  div[style*="grid-template-columns: 62px 64px 1fr 240px 120px 110px"] span[style*="font-size: 25px"],
  div[style*="grid-template-columns: 58px 56px 1fr 220px 110px 100px"] span[style*="font-size: 23px"] {
    font-size: 18px !important;
  }
  img[style*="width: 64px; height: 64px"] { width: 52px !important; height: 52px !important; }
  img[style*="width: 56px; height: 56px"] { width: 52px !important; height: 52px !important; }

  /* Top 10 oylama: satır sonunda değil, alt satırda sağda */
  div[style*="grid-template-columns: 58px 56px 1fr 180px 100px 90px 104px"] {
    grid-template-columns: 40px 52px 1fr auto !important;
    gap: 2px 10px !important;
  }
  div[style*="grid-template-columns: 58px 56px 1fr 180px 100px 90px 104px"] > *:nth-child(n+4) {
    grid-column: 3 / -1 !important;
  }

  /* ---------- haftalık akış: sıkıştırma, kaydır ---------- */
  div[style*="grid-template-columns: 148px repeat(7, 1fr)"] { min-width: 700px !important; }
  div[style*="border-top: 1px solid #141824; border-left: 1px solid #E2DCD0"] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* ---------- 4'lü ızgaralar ---------- */
  div[style*="grid-template-columns: repeat(4, 1fr)"] {
    grid-template-columns: 1fr 1fr !important;
    gap: 20px 14px !important;
  }
  /* programcı kartlarındaki dikey ayıraç tek sütunda bozuk durur */
  div[style*="border-right: 1px solid #E2DCD0"][style*="padding: 26px 24px 30px"] {
    border-right: 0 !important;
    border-bottom: 1px solid #E2DCD0 !important;
    padding: 18px 16px 22px !important;
  }

  /* programcı detay satırı: foto üstte, yazı altta */
  div[style*="grid-template-columns: 300px 1fr 220px"] {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    padding: 22px 0 !important;
  }
  img[style*="width: 300px; height: 360px"] { width: 100% !important; height: 260px !important; }

  /* program listesi satırı */
  div[style*="grid-template-columns: 210px 1fr 200px"] {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    padding: 18px 0 !important;
  }
  span[style*="justify-self: end"] { justify-self: start !important; }

  /* magazin yan haber + iletişim satırı */
  a[style*="grid-template-columns: 1fr 132px"] { grid-template-columns: 1fr 104px !important; }
  a[style*="grid-template-columns: 1fr 96px"]  { grid-template-columns: 1fr 88px !important; }
  div[style*="grid-template-columns: 150px 1fr"] {
    grid-template-columns: 1fr !important;
    gap: 6px !important;
  }
  div[style*="grid-template-columns: repeat(3, 1fr)"] { grid-template-columns: 1fr 1fr !important; }

  /* bugünün akışı satırı */
  div[style*="grid-template-columns: 74px 1fr auto"] { padding: 13px 16px !important; }

  /* ---------- alt bilgi ---------- */
  .t1-footer {
    grid-template-columns: 1fr 1fr !important;
    gap: 26px 20px !important;
    margin: 36px 16px 0 !important;
    padding: 26px 0 30px !important;
  }
  .t1-footer > div:first-child { grid-column: 1 / -1; }

  /* ---------- player: EN ÜSTTE, menünün üzerinde ---------- */
  /* Ekranın en tepesinde ince şerit; menü onun altına yapışır. */
  .t1-player {
    grid-template-columns: 1fr auto !important;
    gap: 12px !important;
    height: calc(60px + env(safe-area-inset-top)) !important;
    padding: env(safe-area-inset-top) 14px 0 !important;
    top: 0 !important;
    bottom: auto !important;
    z-index: 120 !important;
    border-top: 0 !important;
    border-bottom: 1px solid #2A3245 !important;
  }
  .t1-pl-sag { display: none !important; }
  .t1-pl-orta { gap: 12px !important; }
  .t1-cubuklar { display: none !important; }
  .t1-player img { width: 40px !important; height: 40px !important; }
  .t1-player button[data-yayin="ac-kapa"] { width: 40px !important; height: 40px !important; }
  .t1-pl-sol span[style*="font-size: 15px"] {
    font-size: 13.5px !important;
    display: block; max-width: 46vw;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .t1-pl-sol span[style*="font-size: 13px"] { font-size: 12px !important; }
  /* süre/durum satırı: dar ekranda bitişmesin */
  .t1-pl-orta > div[style*="flex: 1"] { min-width: 0; }
  .t1-pl-orta > div[style*="flex: 1"] > div {
    font-size: 11px !important;
    gap: 10px;
    white-space: nowrap;
  }
  .t1-pl-orta > div[style*="flex: 1"] > div > span:first-child {
    overflow: hidden; text-overflow: ellipsis;
  }

  /* ---------- alt sekme çubuğu ---------- */
  .t1-sekme {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 110;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    height: calc(58px + env(safe-area-inset-bottom));
    padding-bottom: env(safe-area-inset-bottom);
    background: #141824;
    border-top: 1px solid #2A3245;
  }
  .t1-sekme a,
  .t1-sekme button {
    display: flex; flex-direction: column;
    align-items: center; justify-content: center; gap: 4px;
    min-height: 44px;
    border: 0; background: none; cursor: pointer;
    font-family: 'Manrope', system-ui, sans-serif;
    font-size: 9.5px; font-weight: 600;
    letter-spacing: 0.08em; text-transform: uppercase;
    color: #8A90A0;
    text-decoration: none;
    position: relative;
  }
  .t1-sekme svg { width: 21px; height: 21px; }

  /* Açık sekme: Tema1'in vurgu rengiyle üstten ince çizgi. */
  .t1-sekme a.acik { color: #F3EFE7; }
  .t1-sekme a.acik::before {
    content: "";
    position: absolute; top: -1px; left: 0; right: 0;
    height: 2px; background: #8C1C13;
  }

  /* Ortadaki "canlı dinle" — vurgu rengiyle dolu blok, tam yükseklik. */
  .t1-sekme-dinle {
    background: #8C1C13 !important;
    color: #F3EFE7 !important;
    gap: 5px !important;
    padding: 0 4px;
    line-height: 1.15;
    text-align: center;
  }
  .t1-sekme-nokta {
    width: 7px; height: 7px; border-radius: 50%;
    background: #F3EFE7;
  }

  /* ---------- formlar ---------- */
  input, textarea, select, button { font-size: 16px; }  /* iOS otomatik yakınlaştırmasın */
  form[style*="display: flex; gap: 0"] { flex-wrap: wrap !important; gap: 8px !important; }
  form[style*="display: flex; gap: 0"] input { flex: 1 1 100% !important; }
  form[style*="display: flex; gap: 0"] button { flex: 1 1 100% !important; border-left: 1px solid #141824 !important; }
}

/* ---------- dar telefon ---------- */
@media (max-width: 400px) {
  div[style*="grid-template-columns: repeat(4, 1fr)"] { grid-template-columns: 1fr !important; }
  div[style*="grid-template-columns: repeat(3, 1fr)"] { grid-template-columns: 1fr !important; }
  .t1-footer { grid-template-columns: 1fr !important; }
  h1[style*="font-size: 58px"] { font-size: 28px !important; }
  h1[style*="font-size: 54px"] { font-size: 27px !important; }
  .t1-sekme { font-size: 9px; }
}