/*
 * Mobile/Wearable UX Hardening — 2026-04-29
 * 目的: スマホ・タブレット・ウェアラブルでの操作快適性・到達性・可読性を統一強化。
 * 既存スタイルを上書きせず、最低保証の補強（タップ44px・iOSズーム抑制・safe-area・focus-visible 等）。
 */

/* ============================================================
   1. iOSテキスト自動拡大の抑制 + タップハイライトの統一
   ============================================================ */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

a,
button,
[role="button"],
input,
select,
textarea {
  -webkit-tap-highlight-color: rgba(17, 79, 161, 0.15);
}

/* ============================================================
   2. タップターゲット最小44x44px (WCAG 2.5.5 AAA / Apple HIG)
   ============================================================ */
@media (hover: none) and (pointer: coarse), (max-width: 1023px) {
  a.sz-header__util-link,
  a.sz-header__sns-link,
  a.sz-mega__guide-card a,
  .sz-mega__list a,
  .sz-footer a,
  .c-pagination a,
  .c-pagination button,
  .c-breadcrumbs a,
  .sz-sp-menu__quick-link,
  .c-bottom-bar__btn,
  .sz-header__hamburger,
  .sz-header__mobile-search,
  .sz-header__mobile-tel,
  button:not(.material-symbols-outlined):not(.hamburger__line) {
    min-block-size: 44px;
    min-inline-size: 44px;
  }

  /* インラインの細かいリンク (パンくず・タグ等) は内側パディングで実効領域を確保 */
  .c-breadcrumbs a,
  .c-pagination a,
  .sz-mega__list a,
  .sz-footer__link {
    padding-block: 0.625rem;
    display: inline-flex;
    align-items: center;
  }
}

/* ============================================================
   3. iOS Safari のフォームフォーカス時自動ズーム防止 (font-size: 16px 以上)
   ============================================================ */
@media (max-width: 767px) {
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input[type="number"],
  input[type="search"],
  input[type="url"],
  input[type="password"],
  input[type="date"],
  input[type="datetime-local"],
  input[type="time"],
  textarea,
  select {
    font-size: max(16px, 1rem);
  }
}

/* ============================================================
   4. Safe-area 対応 (iPhone ノッチ・Dynamic Island)
   ============================================================ */
.c-bottom-bar {
  padding-block-end: max(env(safe-area-inset-bottom, 0px), 0.25rem);
}

@media (max-width: 1023px) {
  body {
    /* ボトムバー高さ + ノッチ分の下端余白を確保 (二重指定はOK) */
    padding-block-end: calc(56px + env(safe-area-inset-bottom, 0px));
  }
}

/* ============================================================
   5. focus-visible キーボード操作可視化 (マウスでは出さない)
   ============================================================ */
:focus-visible {
  outline: 2px solid var(--color-primary, #114FA1);
  outline-offset: 2px;
  border-radius: 2px;
}

/* ボトムバー・CTAボタンは内側に shadow リング */
.c-bottom-bar__btn:focus-visible,
.c-button:focus-visible,
.sz-header__cta-btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(17, 79, 161, 0.55);
}

/* ============================================================
   6. prefers-reduced-motion: アニメーションを最小化
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}

/* ============================================================
   7. 横スクロール禁止 (オーバーフロー監視)
   ============================================================ */
html,
body {
  overflow-x: hidden;
}

/* ============================================================
   8. スマホで画像はフル幅 + 最大幅100%遵守
   ============================================================ */
img,
video,
iframe {
  max-inline-size: 100%;
  block-size: auto;
}

/* ============================================================
   9. 画面幅 ≤ 360px (折りたたみ畳んだ Galaxy Z Fold 等)
   ============================================================ */
@media (max-width: 360px) {
  .c-bottom-bar__label {
    font-size: 0.6875rem;
  }

  .c-bottom-bar__btn {
    padding-inline: 0.25rem;
  }

  h1 {
    font-size: clamp(1.25rem, 5.5vw, 1.5rem);
  }

  .sz-pickup__name {
    font-size: clamp(0.875rem, 3.6vw, 1rem);
  }
}

/* ============================================================
   10. ホバーがないデバイスでメガメニュー hover を無効化
   ============================================================ */
@media (hover: none) {
  .sz-mainnav__item:hover .sz-mega {
    /* hoverに反応せず、タップ/フォーカスのみで開く */
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
  }

  .sz-mainnav__item:focus-within .sz-mega,
  .sz-mainnav__item.is-open .sz-mega {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
  }
}

/* ============================================================
   11. プリント時はFAB・ボトムバー非表示 (患者印刷利用)
   ============================================================ */
@media print {
  .c-bottom-bar,
  .c-fab-ai,
  .sz-header__hamburger,
  .recruit-floating-cta,
  .sp-fab {
    display: none !important;
  }
}

/* ============================================================
   12. ダークモード基礎対応 (媒体ライト指定優先のためトーンのみ調整)
   ============================================================ */
@media (prefers-color-scheme: dark) {
  /* 既存サイトはライト基調のため、強制反転は行わない。
     ただしフォーカスリングのコントラストを引き上げ。 */
  :focus-visible {
    outline-color: #6BB0FF;
  }
}