/* =====================================================================
   OwnzYou — Mobile / Responsive / UX fixes
   Bu dosya parity + fidelity'den SONRA yüklenir; mobil davranış ve
   birkaç tutarlılık düzeltmesinin son söz sahibi burasıdır.
   Masaüstü görünümü kasıtlı olarak değiştirmez (kurallar mobile-scoped'tur,
   tutarlılık blokları hariç).
   ===================================================================== */

/* ---------------------------------------------------------------------
   1) Preview butonu tutarlılığı
   Sorun: archive=mavi (fidelity), onhold/ip-filter=kırmızı (inline),
   s5 sayfaları=camgöbeği. Hepsini tek camgöbeği (tema aksanı) yapıyoruz.
   --------------------------------------------------------------------- */
.archive-preview-btn,
.onhold-preview-btn,
.ip-filter-preview-btn {
  background: rgba(37, 213, 228, .06) !important;
  border: 1px solid rgba(37, 213, 228, .55) !important;
  color: var(--oy-cyan, #25d5e4) !important;
  box-shadow: none !important;
}
.archive-preview-btn:hover,
.onhold-preview-btn:hover,
.ip-filter-preview-btn:hover {
  background: var(--oy-cyan, #25d5e4) !important;
  border-color: var(--oy-cyan, #25d5e4) !important;
  color: #06121a !important;
  transform: none !important;
  text-decoration: none !important;
}

/* =====================================================================
   2) MOBİL NAVİGASYON (<=991px)
   Sorun: hamburger butonu hiçbir şey yapmıyordu ve üst menü mobilde
   sürekli açık kalıp dikeyde çok yer kaplıyordu.
   Çözüm: menüyü varsayılan gizle, hamburger (.sidebarCollapse) ile aç/kapat.
   app.js zaten .main-container'a 'sbar-open' class'ı ekliyor.
   ===================================================================== */
@media (min-width: 992px) {
  /* Masaüstünde menü zaten yatay duruyor; hamburger işlevsiz -> gizle */
  .header .sidebarCollapse {
    display: none !important;
  }
}

@media (max-width: 991.98px) {
  /* Hamburger görünür ve dokunulabilir olsun */
  .header-container .sidebarCollapse {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 8px;
    cursor: pointer;
  }
  .header-container .sidebarCollapse:hover {
    background: rgba(37, 213, 228, .08) !important;
    color: var(--oy-cyan, #25d5e4) !important;
  }

  /* Menü çubuğu varsayılan kapalı */
  .topbar-nav.header.navbar {
    display: none !important;
  }
  /* Hamburgere basınca açılır (app.js sbar-open ekler) */
  .main-container.sbar-open .topbar-nav.header.navbar {
    display: block !important;
    border-top: 1px solid var(--oy-line, #191e3a) !important;
    animation: oyNavDrop .18s ease;
  }
  /* Açık menüde üstteki mini-logo zaten görünür; buradaki tekrarını gizle */
  .main-container.sbar-open .topbar-nav .theme-brand {
    display: none !important;
  }
  /* Açık menüde öğeleri tek sütun, ferah ve okunaklı yap */
  .main-container.sbar-open .menu-categories {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    padding: 12px 4px !important;
  }
  .main-container.sbar-open .menu.single-menu > a {
    height: 50px !important;
  }

  /* Arka plan karartma (app.js .overlay'e .show ekliyor) */
  .overlay {
    position: fixed;
    inset: 0;
    background: rgba(2, 6, 18, .55);
    z-index: 1035;
    opacity: 0;
    visibility: hidden;
    transition: opacity .2s ease, visibility .2s ease;
  }
  .overlay.show {
    opacity: 1;
    visibility: visible;
  }
}

@keyframes oyNavDrop {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* =====================================================================
   3) MOBİL VERİ TABLOLARI -> KART DÜZENİ (<=767px)
   Sorun: tüm tablolarda min-width 960-1080px -> telefonda yatay kaydırma.
   Çözüm: <=767px'de her satır bir kart, her hücre "Etiket / Değer" şeklinde.
   Etiketler responsive-tables.js tarafından data-label ile doldurulur;
   JS çalışmasa bile kartlar düzgün yığılır (güvenli degrade).
   bulk_live tablosu KAPSAM DIŞIDIR (canlı JS ile dolan süreç tablosu).
   ===================================================================== */
@media (max-width: 767.98px) {

  /* Yatay scroll kabuklarını serbest bırak */
  .table-responsive,
  .s5-special-scroll,
  .s5-hacker-scroll,
  .s5-reporters-scroll {
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
  }

  /* min-width zorlamasını kaldır */
  .oy-data-table,
  .archive-table,
  .onhold-table,
  .ip-filter-table,
  .s5-special-table,
  .s5-reporters-table,
  .s5-hacker-table {
    min-width: 0 !important;
    width: 100% !important;
    border-collapse: collapse !important;
    display: block !important;
  }

  /* Başlık satırını görsel olarak gizle (erişilebilir kalır) */
  .oy-data-table thead,
  .archive-table thead,
  .onhold-table thead,
  .ip-filter-table thead,
  .s5-special-table thead,
  .s5-reporters-table thead,
  .s5-hacker-table thead {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
  }

  .oy-data-table tbody,
  .archive-table tbody,
  .onhold-table tbody,
  .ip-filter-table tbody,
  .s5-special-table tbody,
  .s5-reporters-table tbody,
  .s5-hacker-table tbody { display: block !important; width: 100% !important; }

  /* Her satır = kart */
  .oy-data-table tbody tr,
  .archive-table tbody tr,
  .onhold-table tbody tr,
  .ip-filter-table tbody tr,
  .s5-special-table tbody tr,
  .s5-reporters-table tbody tr,
  .s5-hacker-table tbody tr {
    display: block !important;
    width: 100% !important;
    margin: 0 0 14px !important;
    padding: 6px 0 !important;
    border: 1px solid var(--oy-panel-2, #1b2e4b) !important;
    border-radius: 10px !important;
    background: rgba(255, 255, 255, .015) !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .18) !important;
    overflow: hidden;
  }

  /* Her hücre = "Etiket üstte / Değer altta" bloğu */
  .oy-data-table tbody td,
  .archive-table tbody td,
  .onhold-table tbody td,
  .ip-filter-table tbody td,
  .s5-special-table tbody td,
  .s5-reporters-table tbody td,
  .s5-hacker-table tbody td {
    display: block !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    text-align: left !important;
    white-space: normal !important;
    word-break: break-word;
    padding: 10px 16px !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(148, 163, 184, .10) !important;
  }
  .oy-data-table tbody tr td:last-child,
  .archive-table tbody tr td:last-child,
  .onhold-table tbody tr td:last-child,
  .ip-filter-table tbody tr td:last-child,
  .s5-special-table tbody tr td:last-child,
  .s5-reporters-table tbody tr td:last-child,
  .s5-hacker-table tbody tr td:last-child { border-bottom: 0 !important; }

  /* Etiket (data-label JS tarafından konur) */
  .oy-data-table tbody td[data-label]::before,
  .archive-table tbody td[data-label]::before,
  .onhold-table tbody td[data-label]::before,
  .ip-filter-table tbody td[data-label]::before,
  .s5-special-table tbody td[data-label]::before,
  .s5-reporters-table tbody td[data-label]::before,
  .s5-hacker-table tbody td[data-label]::before {
    content: attr(data-label);
    display: block;
    margin-bottom: 5px;
    color: var(--oy-cyan, #25d5e4);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
  }
  /* Etiketsiz / boş-durum (colspan) hücreleri: etiket yok, ortala */
  .oy-data-table tbody td[data-label=""]::before,
  .archive-table tbody td[data-label=""]::before,
  .onhold-table tbody td[data-label=""]::before,
  .ip-filter-table tbody td[data-label=""]::before,
  .s5-special-table tbody td[data-label=""]::before,
  .s5-reporters-table tbody td[data-label=""]::before,
  .s5-hacker-table tbody td[data-label=""]::before { content: none; }

  .archive-empty-state,
  .onhold-empty-state,
  .ip-filter-empty-state,
  .s5-special-empty,
  .s5-reporters-empty,
  .s5-hacker-empty { text-align: center !important; }

  /* İçerideki sabit genişlikleri esnet */
  .archive-url, .ip-filter-url, .onhold-url,
  .archive-attacker, .ip-filter-attacker,
  .archive-server-cell, .ip-filter-server-cell, .onhold-server-cell,
  .archive-date-cell, .ip-filter-date-cell,
  .s5-col-url, .s5-hacker-col-url, .s5-special-urlrow, .s5-special-urlmain {
    min-width: 0 !important;
    max-width: none !important;
    width: auto !important;
  }
  .archive-url a, .ip-filter-url a, .onhold-url a,
  .s5-special-url, .s5-hacker-url { word-break: break-word; }

  /* İlk hücre (bayrak/rank) sola hizalı, ferah */
  .archive-table td:first-child,
  .onhold-table td:first-child,
  .ip-filter-table td:first-child { width: auto !important; text-align: left !important; }
  .archive-location-cell { display: block !important; }

  /* Sayfalama mobilde ortalı ve sarmalı */
  .archive-pager, .onhold-pager, .ip-filter-pager,
  .s5-special-pagination, .s5-reporters-pagination, .s5-hacker-pagination {
    justify-content: center !important;
    flex-wrap: wrap !important;
  }
  .archive-pager-wrap, .onhold-pager-wrap, .ip-filter-pager-wrap,
  .s5-special-footer, .s5-reporters-footer, .s5-hacker-footer {
    flex-direction: column !important;
    align-items: stretch !important;
    text-align: center;
  }
}

/* =====================================================================
   4) Gömülü mirror iframe — küçük ekran yükseklikleri
   ===================================================================== */
@media (max-width: 575.98px) {
  .onhold-frame { height: 420px !important; }
}
