/* ============================================
   ATAMAP ASSOCIATES — Mobile Optimizations
   Touch Targets · Safe Areas · Performance
   ============================================ */

/* ── iOS Safe Area Insets ── */
@supports (padding: max(0px)) {
  .site-header {
    padding-top: env(safe-area-inset-top, 0);
    height: calc(var(--header-height) + env(safe-area-inset-top, 0));
  }

  .site-footer__bottom {
    padding-bottom: max(env(safe-area-inset-bottom, 0), var(--space-4));
  }

  .chat-toggle {
    bottom: max(calc(24px + env(safe-area-inset-bottom, 0)), 24px);
    right: max(calc(24px + env(safe-area-inset-right, 0)), 24px);
  }

  .chat-window {
    bottom: max(calc(92px + env(safe-area-inset-bottom, 0)), 92px);
    right: max(calc(24px + env(safe-area-inset-right, 0)), 24px);
  }
}

/* ── Touch Target Enforcement ── */
/* Ensure all interactive elements meet 44px minimum */
@media (pointer: coarse) {
  .nav__link,
  .site-footer__link,
  .card__link,
  .service-card__link {
    min-height: var(--touch-target);
  }

  .btn--small {
    min-height: var(--touch-target);
    padding: var(--space-3) var(--space-5);
  }

  /* Larger tap areas for radio/checkbox */
  .form-radio {
    min-height: var(--touch-target);
  }

  /* Prevent accidental double-tap zoom on buttons */
  .btn {
    touch-action: manipulation;
  }
}

/* ── Mobile Hover — Only show hovers on non-touch devices ── */
@media (hover: none) {
  .card:hover {
    transform: none;
    box-shadow: none;
  }

  .service-card:hover,
  .project-card:hover,
  .value-card:hover,
  .country-card:hover,
  .mandate-card:hover,
  .training-card:hover,
  .alliance-card:hover {
    transform: none;
  }

  .btn:hover {
    transform: none;
  }

  .btn--primary:hover {
    box-shadow: none;
  }
}

/* ── Performance: Content Visibility ── */
/* Off-screen content rendering optimization */
.section {
  content-visibility: auto;
  contain-intrinsic-size: auto 600px;
}

/* Hero always renders immediately */
.home-hero,
.page-hero,
.admin-login {
  content-visibility: visible;
}

/* ── Smooth Scrolling on iOS ── */
.mobile-nav,
.chat-messages,
.admin-modal__body,
.admin-sidebar {
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
}

/* ── Prevent iOS Text Size Adjust ── */
.text-size-adjust-none {
  -webkit-text-size-adjust: none;
}

/* ── Landscape phone adjustments ── */
@media (max-width: 896px) and (orientation: landscape) {
  .home-hero {
    min-height: auto;
    padding-top: calc(var(--header-height) + var(--space-8));
    padding-bottom: var(--space-8);
  }

  .page-hero {
    padding-top: calc(var(--header-height) + var(--space-8));
    padding-bottom: var(--space-8);
  }

  .admin-login__brand {
    min-height: auto;
    padding: var(--space-8);
  }
}

/* ── Very small screens (<360px) ── */
@media (max-width: 359px) {
  :root {
    --container-px: var(--space-4);
    --section-px: var(--space-4);
  }

  .home-hero h1 {
    font-size: var(--font-size-2xl);
  }

  .trust-bar__stats {
    grid-template-columns: 1fr;
  }

  .home-hero__ctas {
    flex-direction: column;
    width: 100%;
  }

  .home-hero__ctas .btn {
    width: 100%;
  }

  .admin-login__brand-creds {
    flex-direction: column;
    gap: var(--space-3);
  }
}

/* ── Image rendering optimization ── */
img {
  image-rendering: auto;
}

img[loading="lazy"] {
  content-visibility: auto;
}

/* ── Print styles ── */
@media print {
  .site-header,
  .chat-toggle,
  .chat-window,
  .mobile-nav,
  .nav-toggle {
    display: none !important;
  }

  body {
    background: white;
    color: black;
  }

  .section {
    break-inside: avoid;
  }
}

/* ── Prefers contrast ── */
@media (prefers-contrast: more) {
  :root {
    --color-steel-300: #c0c0c0;
    --color-steel-400: #a0a0a0;
    --border-color: #555;
  }

  .card,
  .service-card,
  .project-card {
    border-width: 2px;
  }
}