/**
 * Infinite Scroll - 汎用無限スクロールコンポーネント
 *
 * すべてのpost_typeで使用される無限スクロールの共通スタイル
 */

/* ========================================
   ローダー共通スタイル
======================================== */

.c-infinite-scroll__loader {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: var(--wp--preset--spacing--2-xl) var(--wp--preset--spacing--base);
    text-align: center;
}

.c-infinite-scroll__loader p {
    margin: 0;
    font-size: var(--wp--preset--font-size--base);
    color: var(--wp--preset--color--gray-dark);
}

/* ローディングアニメーション */
.c-infinite-scroll__loader::before {
    content: '';
    display: inline-block;
    width: 24px;
    height: 24px;
    margin-right: var(--wp--preset--spacing--sm);
    border: 3px solid var(--wp--preset--color--gray-light);
    border-top-color: var(--wp--preset--color--primary);
    border-radius: var(--wp--custom--border--radius--circle);
    animation: infinite-scroll-spin 0.8s linear infinite;
}

@keyframes infinite-scroll-spin {
    to {
        transform: rotate(360deg);
    }
}

/* ========================================
   「すべて表示」メッセージ
======================================== */

.c-infinite-scroll__no-more {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: var(--wp--preset--spacing--xl) var(--wp--preset--spacing--base);
    text-align: center;
}

.c-infinite-scroll__no-more p {
    margin: 0;
    padding: var(--wp--preset--spacing--base) var(--wp--preset--spacing--lg);
    font-size: var(--wp--preset--font-size--base);
    color: var(--wp--preset--color--gray-dark);
    background: var(--wp--preset--color--gray-lightest);
    border: var(--wp--custom--border--width--1) solid var(--wp--preset--color--gray-light);
    border-radius: var(--wp--custom--border--radius--md);
}

/* ========================================
   Post Type別のテーマカラー
======================================== */

/* Clinic (primary - 青) */
body.post-type-archive-clinic .c-infinite-scroll__loader::before {
    border-top-color: var(--wp--preset--color--primary);
}

/* Treatment (secondary - ピンク) */
body.post-type-archive-treatment .c-infinite-scroll__loader::before {
    border-top-color: var(--wp--preset--color--secondary);
}

/* C-Column (success - 緑) */
body.post-type-archive-c-column .c-infinite-scroll__loader::before {
    border-top-color: var(--wp--preset--color--success);
}

/* ========================================
   ページネーション非表示（無限スクロール有効時）
======================================== */

body.post-type-archive-clinic .c-pagination-001,
body.post-type-archive-treatment .c-pagination-001,
body.post-type-archive-c-column .c-pagination-001 {
    display: none;
}

/* ========================================
   レスポンシブ
======================================== */

@media (max-width: 768px) {
    .c-infinite-scroll__loader {
        padding: var(--wp--preset--spacing--xl) var(--wp--preset--spacing--base);
    }

    .c-infinite-scroll__no-more {
        padding: var(--wp--preset--spacing--lg) var(--wp--preset--spacing--base);
    }

    .c-infinite-scroll__no-more p {
        padding: var(--wp--preset--spacing--sm) var(--wp--preset--spacing--base);
        font-size: var(--wp--preset--font-size--sm);
    }
}