/*! FUL SERVIS v67 — Yatay Scroll Fix
 *
 * Sorun:
 *  1) premium-v65.css'te .main { overflow-x:hidden } → mobilde iç yatay
 *     scroll'u kesiyor (calendar, pipeline, table vs.)
 *  2) style.css'te body { overflow-x:hidden } → front'ta da aynı
 *  3) .calendar-grid grid-template-columns:repeat(7,1fr) → 7 günü zorla
 *     sığdırıyor, mobilde okunmaz halde
 *
 * Çözüm:
 *  - overflow-x:hidden → overflow-x:clip (iç scroll container'ları çalışır,
 *    sayfa taşması yine engellenir; clip 2022+ tüm modern tarayıcılarda var)
 *  - .main → overflow-x:visible mobilde
 *  - .calendar-grid mobilde flex + scroll-snap horizontal scroll
 *  - .h-scroll, [data-hscroll] generic utility (her yerde kullanılabilir)
 *  - Native momentum scroll (-webkit-overflow-scrolling:touch)
 *  - touch-action:pan-x pan-y
 */

/* =============================================================
   1. GLOBAL OVERFLOW: hidden → clip (iç scroll'a izin ver)
   ============================================================= */
html,
html body{
  overflow-x:clip !important;
}
/* Eski tarayıcı fallback (clip desteklemeyenler) */
@supports not (overflow:clip){
  html,html body{overflow-x:hidden !important}
}

/* =============================================================
   2. ADMIN .main — overflow-x kaldırıldı (iç scroll çalışsın)
   ============================================================= */
html body .main{
  overflow-x:visible !important;
  overflow-y:visible !important;
  min-width:0 !important;
}

/* =============================================================
   3. CALENDAR GRID — Mobilde yatay scroll-snap
   ============================================================= */
@media(max-width:900px){
  html body .calendar-grid{
    display:flex !important;
    grid-template-columns:none !important;
    flex-wrap:nowrap !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch !important;
    touch-action:pan-x pan-y !important;
    scroll-snap-type:x mandatory !important;
    scroll-padding-inline:14px !important;
    gap:10px !important;
    padding:14px !important;
    /* Ekranın iki kenarına da yapışsın */
    margin-left:calc(var(--sp-3, 12px) * -1) !important;
    margin-right:calc(var(--sp-3, 12px) * -1) !important;
    /* Subtle scrollbar */
    scrollbar-width:thin !important;
    scrollbar-color:rgba(15,26,51,.20) transparent !important;
    /* Scrollbar ipucu için sağdan padding */
    padding-right:24px !important;
    /* Visual cue: sağa scroll edilebilir gradient mask */
    mask-image:linear-gradient(90deg,transparent 0,#000 12px,#000 calc(100% - 24px),transparent 100%);
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12px,#000 calc(100% - 24px),transparent 100%);
  }
  html body .calendar-grid::-webkit-scrollbar{height:6px}
  html body .calendar-grid::-webkit-scrollbar-thumb{background:rgba(15,26,51,.20);border-radius:3px}

  html body .calendar-grid > .calendar-day{
    flex:0 0 auto !important;
    width:78vw !important;
    max-width:280px !important;
    min-width:230px !important;
    scroll-snap-align:start !important;
    min-height:auto !important;
  }
}

/* =============================================================
   4. PIPELINE BOARD — confirm (mevcut grid-auto-flow:column zaten doğru)
   ============================================================= */
html body .pipeline-board{
  overflow-x:auto !important;
  -webkit-overflow-scrolling:touch !important;
  touch-action:pan-x pan-y !important;
  scroll-padding-inline:14px;
  scrollbar-width:thin;
}
html body .pipeline-board::-webkit-scrollbar{height:6px}
html body .pipeline-board::-webkit-scrollbar-thumb{background:rgba(15,26,51,.20);border-radius:3px}

@media(max-width:900px){
  html body .pipeline-board{
    grid-auto-columns:75vw !important;
    scroll-snap-type:x proximity !important;
    padding-bottom:10px !important;
  }
  html body .pipeline-column{
    scroll-snap-align:start !important;
  }
}

/* =============================================================
   5. TABLE WRAPPER — overflow-x:auto zaten var, momentum + touch-action
   ============================================================= */
html body .table-wrap,
html body .tableWrap{
  overflow-x:auto !important;
  -webkit-overflow-scrolling:touch !important;
  touch-action:pan-x pan-y !important;
  scrollbar-width:thin;
}
html body .table-wrap::-webkit-scrollbar,
html body .tableWrap::-webkit-scrollbar{height:6px}
html body .table-wrap::-webkit-scrollbar-thumb,
html body .tableWrap::-webkit-scrollbar-thumb{background:rgba(15,26,51,.20);border-radius:3px}

/* =============================================================
   6. GENERIC HORIZONTAL SCROLL UTILITY
   Her yere ekleyebilirsin: <div class="h-scroll"> veya [data-hscroll]
   ============================================================= */
html body .h-scroll,
html body [data-hscroll]{
  display:flex !important;
  flex-wrap:nowrap !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  -webkit-overflow-scrolling:touch !important;
  touch-action:pan-x pan-y !important;
  scroll-snap-type:x proximity !important;
  scroll-padding-inline:14px !important;
  gap:10px !important;
  scrollbar-width:thin !important;
}
html body .h-scroll > *,
html body [data-hscroll] > *{
  flex:0 0 auto !important;
  scroll-snap-align:start !important;
}
html body .h-scroll::-webkit-scrollbar,
html body [data-hscroll]::-webkit-scrollbar{height:6px}
html body .h-scroll::-webkit-scrollbar-thumb,
html body [data-hscroll]::-webkit-scrollbar-thumb{background:rgba(15,26,51,.20);border-radius:3px}

/* =============================================================
   7. APPOINTMENT GRID, VEHICLE LIST → Mobilde dikey kalır
   (Bunlar zaten kart şeklinde stack oluyor, dokunulmadı)
   ============================================================= */

/* =============================================================
   8. SEÇİLİ TEMA tabloları için ek hint
   .table-wrap kenarlarında scroll cue (ince gradient)
   ============================================================= */
@media(max-width:900px){
  html body .table-wrap{
    margin-left:calc(var(--sp-3, 12px) * -1) !important;
    margin-right:calc(var(--sp-3, 12px) * -1) !important;
    border-radius:0 !important;
    border-left:0 !important;
    border-right:0 !important;
  }
  html body .table-wrap::after{
    /* visual indicator yapılabilir, şimdilik kapalı */
  }
}

/* =============================================================
   9. iOS SAFARI MOMENTUM scroll fix (eski iOS için)
   ============================================================= */
html body .calendar-grid,
html body .pipeline-board,
html body .table-wrap,
html body .tableWrap,
html body .h-scroll,
html body [data-hscroll]{
  -webkit-transform:translateZ(0);
  transform:translateZ(0);
  will-change:scroll-position;
}

/* =============================================================
   10. SİDEBAR DRAWER — overflow:clip etkilemesin
   sidebar fixed pozisyonda olduğu için clip context dışında
   ============================================================= */
html body .sidebar{
  overflow-y:auto !important;
  overflow-x:hidden !important;
  -webkit-overflow-scrolling:touch;
}

/* =============================================================
   11. CARD'lar yatay taşmasın
   ============================================================= */
html body .card,
html body .dash-hero{
  max-width:100% !important;
  min-width:0 !important;
}
html body .card > *,
html body .dash-hero > *{
  min-width:0 !important;
  max-width:100% !important;
}