/* =============================================
   AFRO ASIAN AVIATION — responsive-fixes.css
   المرحلة 2+3: Responsive كامل + أداء
   LOAD ORDER: بعد main.css مباشرة
   ============================================= */

/* ── GLOBAL OVERFLOW FIX ──────────────────── */
html, body {
  overflow-x: hidden !important;
  max-width: 100vw;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}
*, *::before, *::after {
  box-sizing: border-box;
  min-width: 0; /* يحل مشكلة overflow في flex/grid */
}

/* Responsive images/media */
img, video, iframe, embed, object, picture {
  max-width: 100%;
  height: auto;
  display: block;
}

/* Lazy loading fade-in */
img[loading="lazy"] {
  opacity: 0;
  transition: opacity .3s ease;
}
img[loading="lazy"].loaded { opacity: 1; }

/* ── CONTAINER ────────────────────────────── */
.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 clamp(12px, 4vw, 24px);
  width: 100%;
}

/* ── HEADER ───────────────────────────────── */
.site-header { width: 100%; overflow: visible; }
.hdr-inner { padding: 0 clamp(12px, 3vw, 24px); flex-wrap: nowrap; }
.logo-txt strong {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── HERO ─────────────────────────────────── */
.home-hero,
.cta-premium { background-attachment: scroll !important; }

.hero-content {
  padding: clamp(80px, 12vw, 110px) 0 clamp(60px, 8vw, 80px);
  gap: clamp(24px, 4vw, 48px);
}
.hero-text h1 { font-size: clamp(22px, 5vw, 52px); line-height: 1.2; }
.hero-text p  { font-size: clamp(14px, 2vw, 17px); }
.hero-form-card { width: min(430px, 100%); }

/* ── TABLES ───────────────────────────────── */
.tbl-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
}

/* ── FORMS ────────────────────────────────── */
.form-wrap { padding: clamp(16px, 4vw, 40px); width: 100%; }
.form-control, input[type="text"], input[type="email"],
input[type="password"], input[type="tel"], input[type="number"],
input[type="date"], select, textarea {
  max-width: 100%;
  /* منع iOS zoom عند التركيز */
  font-size: max(16px, 1em) !important;
}

/* ── AUTH ─────────────────────────────────── */
.auth-page { padding: clamp(20px, 6vw, 60px) clamp(12px, 4vw, 20px); }
.auth-box { padding: clamp(20px, 5vw, 48px) clamp(16px, 4vw, 44px); width: 100%; }

/* ── PAGE HERO ────────────────────────────── */
.page-hero { padding: clamp(40px, 8vw, 70px) 0 clamp(30px, 6vw, 60px); }
.page-hero h1 { font-size: clamp(22px, 5vw, 38px); }

/* ── DASHBOARD (CLIENT) ──────────────────── */
.dash-content { padding: clamp(16px, 3vw, 32px); width: 100%; overflow-x: hidden; }
.dash-topbar  { padding: 0 clamp(16px, 3vw, 32px); }

/* ── FOOTER ───────────────────────────────── */
.site-footer { overflow: hidden; width: 100%; }

/* ── BUTTONS ──────────────────────────────── */
.btn { max-width: 100%; }

/* ══════════════════════════════════════════
   BREAKPOINTS — جميع أحجام الشاشات
   ══════════════════════════════════════════ */

/* 1440px - شاشات كبيرة */
@media (max-width: 1440px) {
  .hero-form-card { width: min(420px, 100%); }
}

/* 1280px */
@media (max-width: 1280px) {
  .hero-form-card { width: min(400px, 100%); }
  .ft-grid { grid-template-columns: 2fr 1fr 1fr; }
}

/* 1180px */
@media (max-width: 1180px) {
  .hero-text h1 { font-size: clamp(28px, 4vw, 42px); }
  .hero-form-card { width: min(390px, 100%); }
  .cards-grid { grid-template-columns: repeat(2, 1fr); }
  .features-grid { grid-template-columns: repeat(2, 1fr); }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .contact-grid { grid-template-columns: repeat(2, 1fr); }
  .detail-body { grid-template-columns: 1fr; }
  .booking-widget { position: static; }
  .about-grid { grid-template-columns: 1fr; gap: 40px; }
  .services-grid-4 { grid-template-columns: repeat(3, 1fr); }
  .ft-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  .ft-brand { grid-column: 1 / -1; }
}

/* 1024px - لابتوب */
@media (max-width: 1024px) {
  .dash-layout { grid-template-columns: 240px 1fr; }
}

/* 992px - تابلت أفقي */
@media (max-width: 992px) {
  .dash-layout { grid-template-columns: 1fr; }
  .dash-sidebar { display: none; }
}

/* 980px */
@media (max-width: 980px) {
  .main-nav { display: none !important; }
  .burger   { display: flex !important; }
  .hero-content {
    flex-direction: column;
    padding: clamp(90px, 12vw, 100px) 0 60px;
    min-height: auto;
    gap: 32px;
  }
  .hero-text { max-width: 100%; text-align: center; }
  .hero-tags { justify-content: center; }
  .hero-cta-btn { width: 100%; }
  .hero-form-card { width: 100%; max-width: 540px; margin: 0 auto; max-height: none; overflow-y: visible; }
  .scroll-indicator { display: none; }
  .cards-grid-3 { grid-template-columns: repeat(2, 1fr); }
  .services-grid   { grid-template-columns: repeat(2, 1fr); }
  .services-grid-4 { grid-template-columns: repeat(2, 1fr); }
  .news-grid { grid-template-columns: repeat(2, 1fr); }
  .partner-benefits { grid-template-columns: 1fr 1fr; }
  .form-row { grid-template-columns: 1fr; }
}

/* 820px - تابلت صغير */
@media (max-width: 820px) {
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .contact-grid { grid-template-columns: repeat(2, 1fr); }
}

/* 768px - تابلت عمودي */
@media (max-width: 768px) {
  .section { padding: 56px 0; }
  .container { padding: 0 16px; }
  .page-hero h1 { font-size: 26px; }
  .sec-head h2  { font-size: 26px; }
  .dash-topbar { height: auto; min-height: 60px; padding: 12px 16px; flex-wrap: wrap; gap: 8px; }
  .dash-title  { font-size: 20px; }
}

/* 700px */
@media (max-width: 700px) {
  .hero-text h1 { font-size: clamp(22px, 7vw, 30px); }
  .hero-text p  { font-size: 15px; }
  .hero-form-card { padding: 20px 16px; border-radius: 18px; }
  .hf-row-2 { grid-template-columns: 1fr; }
  .hf-nights-row { grid-template-columns: 1fr; }
  .travelers-row { grid-template-columns: 1fr 1fr; }
  .travelers-row .traveler-box:nth-child(3) { grid-column: 1 / -1; }
  .cards-grid   { grid-template-columns: 1fr; }
  .cards-grid-3 { grid-template-columns: 1fr; }
  .features-grid { grid-template-columns: 1fr 1fr; }
  .services-grid   { grid-template-columns: 1fr; }
  .services-grid-4 { grid-template-columns: 1fr 1fr; }
  .news-grid { grid-template-columns: 1fr; }
  .contact-grid { grid-template-columns: 1fr 1fr; }
  .partner-benefits { grid-template-columns: 1fr; }
  .stats-grid { grid-template-columns: 1fr 1fr; }
  .form-wrap { padding: 20px 16px; }
  .auth-box  { padding: 28px 16px; }
  .about-nums { grid-template-columns: 1fr 1fr; }
  .ft-grid { grid-template-columns: 1fr; gap: 20px; }
  .ft-brand { grid-column: auto; }
  .ft-bottom-inner { flex-direction: column; text-align: center; }
  .cta-content h2 { font-size: 26px; }
  .cta-btns .btn { width: 100%; }
  .hero-stats { gap: 20px; }
  .nusuk-spotlight { padding: 24px 20px; flex-direction: column; }
  .nusuk-spotlight .btn { width: 100%; }
  .cta-premium { padding: 60px 0; }
  .cta-p-inner h2 { font-size: 26px; }
  .cta-p-btns { flex-direction: column; align-items: stretch; }
  .cta-p-stats { flex-direction: column; gap: 16px; padding: 16px; }
  .cta-p-divider { display: none; }
  .step-line { width: 40px; }
  /* Table stack on very small */
  .steps-bar { overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 8px; }
}

/* 480px */
@media (max-width: 480px) {
  .hdr-inner { height: 60px; }
  .logo-ic { width: 36px; height: 36px; font-size: 16px; }
  .logo-txt strong { font-size: 13px; }
  .logo-txt small  { display: none; }
  .hero-text h1 { font-size: 22px; }
  .features-grid { grid-template-columns: 1fr 1fr; }
  .filters-bar { top: 60px; }
  .page-hero { padding: 40px 0 30px; }
  .about-nums { grid-template-columns: 1fr 1fr; }
  .card-body h3 { font-size: 15px; }
  .price-new { font-size: 18px; }
  .track-row { flex-direction: column; gap: 4px; }
}

/* 440px */
@media (max-width: 440px) {
  .hero-text h1 { font-size: 21px; }
  .contact-grid { grid-template-columns: 1fr; }
  .about-nums   { grid-template-columns: 1fr; }
  .features-grid { grid-template-columns: 1fr; }
  .stats-grid { grid-template-columns: 1fr; }
  .services-grid-4 { grid-template-columns: 1fr; }
  .travelers-row { grid-template-columns: 1fr; }
  .travelers-row .traveler-box:nth-child(3) { grid-column: auto; }
}

/* 414px - iPhone Plus */
@media (max-width: 414px) {
  .hero-form-card { padding: 18px 14px; }
  .btn { padding: 11px 16px; font-size: 14px; }
}

/* 390px - iPhone 14/15 */
@media (max-width: 390px) {
  .hero-text h1 { font-size: 20px; }
  .auth-box { border-radius: 16px; padding: 24px 16px; }
}

/* 375px - iPhone SE / Galaxy */
@media (max-width: 375px) {
  .container { padding: 0 14px; }
  .hero-form-card { padding: 16px 12px; border-radius: 16px; }
  .logo-txt strong { font-size: 12px; }
  .login-btn { padding: 8px 12px; font-size: 12px; }
  .form-wrap { border-radius: 14px; }
}

/* 360px - Android شائع */
@media (max-width: 360px) {
  .hdr-inner { gap: 8px; }
  .hero-text h1 { font-size: 19px; }
  .hero-tags span { font-size: 12px; padding: 5px 10px; }
}

/* 320px - الحد الأدنى */
@media (max-width: 320px) {
  .container { padding: 0 12px; }
  .hero-text h1 { font-size: 18px; }
  .hero-form-card { padding: 14px 10px; }
  .btn-sm { padding: 8px 12px; font-size: 12px; }
}

/* ── طباعة ────────────────────────────────── */
@media print {
  .site-header, .site-footer, .wa-btn, .top-btn,
  .nav-drawer, .nav-overlay, .burger,
  .cta-section, .cta-premium { display: none !important; }
  body { overflow-x: visible; color: #000; }
  .container { max-width: 100%; padding: 0; }
  a[href]::after { content: " (" attr(href) ")"; }
}