/* ============================================================
   PUSULA Platform - Responsive Duzeltmeleri
   Mobile-first; Tailwind ile birlikte kullanilir.
   ============================================================ */

/* Kucuk ekranlarda font olcekleme */
html{ font-size:16px; }
@media (max-width:640px){ html{ font-size:15px; } }

/* Container padding */
.container-pusula{ width:100%; margin-left:auto; margin-right:auto; padding-left:1rem; padding-right:1rem; }
@media (min-width:640px){ .container-pusula{ padding-left:1.5rem; padding-right:1.5rem; } }
@media (min-width:1024px){ .container-pusula{ max-width:80rem; padding-left:2rem; padding-right:2rem; } }

/* Hero responsive */
.hero-title{ font-size:2rem; line-height:1.1; }
@media (min-width:640px){ .hero-title{ font-size:2.75rem; } }
@media (min-width:1024px){ .hero-title{ font-size:3.5rem; } }

.hero-subtitle{ font-size:1rem; }
@media (min-width:640px){ .hero-subtitle{ font-size:1.25rem; } }

/* Paket grid */
.pkg-grid{ grid-template-columns:1fr; }
@media (min-width:768px){ .pkg-grid{ grid-template-columns:repeat(3,1fr); } }

/* Formlar */
.form-grid{ display:grid; grid-template-columns:1fr; gap:1rem; }
@media (min-width:768px){ .form-grid{ grid-template-columns:1fr 1fr; } }

/* Mobilde tam genislik butonlar */
@media (max-width:640px){
  .btn-mobile-block{ width:100%; }
  .stat-value{ font-size:1.375rem; }
  .page-title{ font-size:1.25rem; }
  .dashboard-content{ padding:1rem; }
}

/* Tablo mobil karti */
@media (max-width:640px){
  .table-mobile thead{ display:none; }
  .table-mobile,.table-mobile tbody,.table-mobile tr,.table-mobile td{ display:block; width:100%; }
  .table-mobile tr{ margin-bottom:.75rem; border:1px solid #e5e7eb; border-radius:.5rem; padding:.5rem; }
  .table-mobile td{ border:none; padding:.375rem 0; }
  .table-mobile td::before{ content:attr(data-label); font-weight:600; color:#6b7280; font-size:.75rem; display:block; }
}

/* Touch targets min 44px */
button, a.btn, .accordion-header{ min-height:44px; }

/* Safe area (iOS) */
@supports (padding:max(0px)){
  body{ padding-bottom:env(safe-area-inset-bottom); }
}