/**
 * WP Barba PJAX - トランジションCSS
 */

/* =========================================================
 *  プログレスバー
 * ========================================================= */
.barba-progress {
  position: fixed;
  top: 0;
  left: 0;
  width: 0;
  height: 3px;
  background: linear-gradient(90deg, #3b82f6, #8b5cf6, #ec4899);
  z-index: 999999;
  pointer-events: none;
  opacity: 0;
  border-radius: 0 2px 2px 0;
  box-shadow: 0 0 10px rgba(59, 130, 246, 0.5);
}

/* 管理バー表示時はその下に */
.admin-bar .barba-progress {
  top: 32px;
}

@media screen and (max-width: 782px) {
  .admin-bar .barba-progress {
    top: 46px;
  }
}

/* =========================================================
 *  オーバーレイ（overlay トランジション用）
 * ========================================================= */
.barba-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #1e293b;
  z-index: 99999;
  transform: scaleY(0);
  transform-origin: center bottom;
  pointer-events: none;
}

/* =========================================================
 *  Barba コンテナの基本スタイル
 * ========================================================= */
[data-barba="container"] {
  will-change: opacity, transform;
}

/* トランジション中のオーバーフロー制御 */
.barba-pjax-enabled [data-barba="wrapper"] {
  overflow: hidden;
  position: relative;
}

/* トランジション中、古いコンテナは absolute にして重ねる */
[data-barba="container"].barba-leave-active {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

/* =========================================================
 *  クリップパス トランジション初期状態
 * ========================================================= */
[data-barba="container"] {
  clip-path: circle(150% at 50% 50%);
}

/* =========================================================
 *  スムーズなリンクカーソル
 * ========================================================= */
.barba-pjax-enabled a:not([data-barba-prevent]):not([target="_blank"]) {
  cursor: pointer;
}

/* =========================================================
 *  ローディング状態
 * ========================================================= */
.barba-pjax-enabled.is-loading {
  cursor: wait;
}

.barba-pjax-enabled.is-loading a {
  pointer-events: none;
}
