/* file: public/assets/css/mobile.css */
/* Global mobile / touch refinements — load after main + hero-menu */

html {
  overflow-x: clip;
}

body {
  overflow-x: clip;
  min-height: 100dvh;
  min-height: 100svh;
}

#main {
  min-width: 0;
}

/* Notch + home indicator: horizontal inset on fixed header chrome */
#site-header {
  padding-left: env(safe-area-inset-left, 0);
  padding-right: env(safe-area-inset-right, 0);
}

@media (max-width: 767px) {
  /* Belt-and-suspenders: hero-menu no longer nudges <768px; keep reset if older CSS cached. */
  #site-header .home-hero-locale {
    margin-inline-end: 0 !important;
    transform: none !important;
  }

  /* Locale + Keşfet: stay a tight row; parent row uses justify-between (logo | actions). */
  body[data-page='home'] #site-header .home-header-actions {
    justify-content: flex-end !important;
    width: auto;
    max-width: none;
  }

  body[data-page='home'] #site-header > div:first-child {
    padding-top: calc(1.25rem + env(safe-area-inset-top, 0px));
    padding-bottom: max(1.5rem, env(safe-area-inset-bottom, 0px));
  }

  body[data-page='work'] #site-header > div:first-child {
    padding-top: calc(1.25rem + env(safe-area-inset-top, 0px));
    padding-bottom: calc(1.25rem + env(safe-area-inset-bottom, 0px));
  }

  #site-header .container-shell {
    padding-top: calc(1.25rem + env(safe-area-inset-top, 0px));
    padding-bottom: calc(1.25rem + env(safe-area-inset-bottom, 0px));
  }

  .container-shell {
    padding-left: max(1.25rem, env(safe-area-inset-left, 0px));
    padding-right: max(1.25rem, env(safe-area-inset-right, 0px));
  }

  .section-spacing {
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
  }

  /* iOS: 16px+ inputs avoid focus zoom */
  .contact-form input:not([type='hidden']),
  .contact-form select,
  .contact-form textarea {
    font-size: 1rem;
  }

  /* Discover trigger: no iOS/Tailwind focus halo; room to tap label + bars */
  #site-header #menu-open.menu-trigger {
    min-height: 44px;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    border-radius: 9999px;
    padding-left: 0.7rem;
    padding-right: 0.7rem;
    gap: 0.5rem;
    align-items: center;
    justify-content: center;
  }

  /* Touch: no persistent blue/white ring after tap */
  @media (hover: none) {
    #site-header #menu-open:focus,
    #site-header #menu-open:focus-visible {
      outline: none !important;
      box-shadow: none !important;
      --tw-ring-shadow: 0 0 #0000 !important;
      --tw-ring-offset-shadow: 0 0 #0000 !important;
    }
  }

  /* Narrow desktop / trackpad: keep a light keyboard focus cue */
  @media (hover: hover) {
    #site-header #menu-open:focus-visible {
      outline: 2px solid rgba(255, 255, 255, 0.35);
      outline-offset: 3px;
      box-shadow: none !important;
      --tw-ring-shadow: 0 0 #0000 !important;
      --tw-ring-offset-shadow: 0 0 #0000 !important;
    }
  }

  .home-header-actions {
    flex-shrink: 0;
    align-items: center;
    gap: 0.5rem;
  }

  @media (min-width: 380px) {
    .home-header-actions {
      gap: 0.65rem;
    }
  }

  /* Overlay close — same halo fix */
  #discover-overlay #menu-close.menu-trigger-with-label {
    min-height: 44px;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    padding-left: 0.65rem;
    padding-right: 0.65rem;
    border-radius: 9999px;
  }

  @media (hover: none) {
    #discover-overlay #menu-close:focus,
    #discover-overlay #menu-close:focus-visible {
      outline: none !important;
      box-shadow: none !important;
      --tw-ring-shadow: 0 0 #0000 !important;
      --tw-ring-offset-shadow: 0 0 #0000 !important;
    }
  }

  @media (hover: hover) {
    #discover-overlay #menu-close:focus-visible {
      outline: 2px solid rgba(255, 255, 255, 0.35);
      outline-offset: 3px;
      box-shadow: none !important;
      --tw-ring-shadow: 0 0 #0000 !important;
      --tw-ring-offset-shadow: 0 0 #0000 !important;
    }
  }

  /* Other headers: pill Discover keeps border, kill electric ring on touch */
  #menu-open.menu-trigger,
  #menu-close.menu-trigger-with-label,
  .menu-trigger.menu-trigger-with-label {
    touch-action: manipulation;
  }

  .work-page__filter-summary {
    min-height: 48px;
    padding: 0.35rem 0;
    touch-action: manipulation;
  }

  .work-page__filter-option {
    padding: 0.35rem 0;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }

  .discover-overlay__link {
    min-height: 2.875rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
  }

  footer.border-t a {
    display: inline-flex;
    align-items: center;
    padding: 0.4rem 0;
    min-height: 44px;
    line-height: 1.5;
  }

  .cinematic-heading {
    font-size: clamp(1.875rem, 8.5vw, 2.25rem);
    line-height: 1.08;
  }
}

/* Hero fills dynamic viewport on phones */
@media (max-width: 767px) {
  section.hero-resn.home-intro-hero {
    min-height: 100dvh;
    min-height: 100svh;
  }
}

/* Discover overlay top bar: safe area */
@media (max-width: 767px) {
  #discover-overlay .discover-overlay__chrome {
    padding-top: max(1.25rem, env(safe-area-inset-top, 0px));
    padding-left: max(1.25rem, env(safe-area-inset-left, 0px));
    padding-right: max(1.25rem, env(safe-area-inset-right, 0px));
  }
}

/* Work index: filter title not overflowing tiny screens */
@media (max-width: 480px) {
  .work-page__filter-title {
    font-size: clamp(1.35rem, 7vw, 1.85rem);
  }
}

/* Admin sidebar links — tap-friendly on tablet/phone */
@media (max-width: 1023px) {
  .admin-side-nav a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }
}

/* Contact page breathing room under fixed header */
@media (max-width: 767px) {
  .contact-page-root {
    padding-top: 0;
  }

  .contact-page-shell {
    padding-top: max(0.75rem, env(safe-area-inset-top, 0px));
  }

  .contact-page-shell.section-spacing {
    padding-top: max(0.75rem, env(safe-area-inset-top, 0px));
  }

  /* Inner pages: clear fixed header + notch */
  .page-below-header {
    padding-top: max(6rem, calc(4.25rem + env(safe-area-inset-top, 0px)));
  }
}

/* Locale toggle: easier taps on phone */
@media (max-width: 767px) {
  .home-hero-locale__btn {
    min-height: auto;
    padding-top: 0;
    padding-bottom: 0;
  }
}