/*
Theme Name: Yoshimura Child
Theme URI: https://example.com/yoshimura-child
Template: yoshimura-v2
Author: Yoshimura
Author URI: https://example.com
Description: 津山ホルモンうどん よしむら 子テーマ - カスタマイズ用
Version: 31.0
License: GPL v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: yoshimura-child
*/

/* 親テーマのスタイルを継承 */

/* こだわりタイトルを確実に表示 */
.kodawari-image {
    position: relative !important;
    overflow: visible !important;
}

.kodawari-image h3 {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: absolute !important;
    bottom: 20px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    color: #ffffff !important;
    font-size: 2rem !important;
    font-weight: bold !important;
    text-shadow: 
        3px 3px 8px rgba(0,0,0,1),
        2px 2px 4px rgba(0,0,0,0.8) !important;
    z-index: 100 !important;
    width: 7em !important;
    text-align: center !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    line-height: 1 !important;
    padding: 5px 0 !important;
    margin: 0 !important;
}

/* お知らせセクション - 親テーマのスタイルを補完 */
.news-section {
    background: linear-gradient(135deg, #1a1a2e 0%, #0f0f1e 100%) !important;
    padding: 80px 20px !important;
}

/* フッター修正 */
.footer-info {
    display: none !important;
}

.footer-logo h3 {
    font-family: "Kaisei HarunoUmi", serif !important;
}

/* モバイル版でフッターロゴを1行に収める（13文字対応） */
@media (max-width: 768px) {
    .footer-logo h3 {
        font-size: calc(100vw / 13 * 0.9) !important; /* 画面幅に対して13文字が収まるサイズ */
        letter-spacing: -0.05em !important;
        white-space: nowrap !important;
        padding: 0 !important;
        line-height: 1.2 !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }
}

/* より小さい画面用の追加調整 */
@media (max-width: 390px) {
    .footer-logo h3 {
        font-size: 1rem !important;
    }
}

/* ================================================
   お知らせセクションのテキスト色統一（子テーマで補強）
   ================================================ */
.news-section .news-item .news-excerpt,
.news-section .news-item .news-excerpt *,
.news-section .news-item .news-content p,
.news-section .news-item .news-content p * {
    color: rgba(255, 255, 255, 0.6) !important;
}

/* お知らせ詳細ページのテキスト色統一 */
.news-detail-content,
.news-detail-content p,
.news-detail-content p *,
.news-detail-content span,
.news-detail-content div {
    color: rgba(255, 255, 255, 0.9) !important;
}

/* アーカイブページのテキスト色統一 */
.news-archive-excerpt,
.news-archive-excerpt *,
.news-archive-content p,
.news-archive-content p * {
    color: rgba(255, 255, 255, 0.6) !important;
}

/* お知らせ一覧へボタンのセンター配置を強化 - 最優先 */
.news-section .news-more[class],
section.news-section .news-more[class],
.news-section div.news-more[class] {
    text-align: center !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

.news-section .news-more-btn[class],
section.news-section .news-more-btn[class],
.news-section .news-more a.news-more-btn[class] {
    margin: 0 auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
    float: none !important;
    display: inline-flex !important;
}

/* ================================================
   お知らせアイテムのアニメーション強化（子テーマで補強）
   ================================================ */

/* ホバー時のアニメーションを維持しながらスクロールアニメーションを適用 */
.news-section .news-item.scroll-animation {
    opacity: 0 !important;
    transform: translateY(30px) !important;
    transition: opacity 0.6s ease-out, transform 0.6s ease-out, background 0.3s ease, border-color 0.3s ease !important;
}

.news-section .news-item.scroll-animation.visible {
    opacity: 1 !important;
    transform: translateY(0) !important;
}

/* ホバー時の効果は維持 */
.news-section .news-item.visible:hover {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(255, 215, 0, 0.3) !important;
    transform: translateX(5px) !important;
}

/* 順次表示のためのディレイ - すべての記事に対応 */
.news-section .news-item:nth-child(1).scroll-animation,
.news-archive-list .news-archive-item:nth-child(1).scroll-animation {
    transition-delay: 0s;
}

.news-section .news-item:nth-child(2).scroll-animation,
.news-archive-list .news-archive-item:nth-child(2).scroll-animation {
    transition-delay: 0.1s;
}

.news-section .news-item:nth-child(3).scroll-animation,
.news-archive-list .news-archive-item:nth-child(3).scroll-animation {
    transition-delay: 0.2s;
}

.news-section .news-item:nth-child(n+4).scroll-animation,
.news-archive-list .news-archive-item:nth-child(n+4).scroll-animation {
    transition-delay: 0.3s;
}

/* お知らせアイテム内のテキスト要素は親と一緒に動く（個別アニメーション無効） */
.news-section .news-item h3,
.news-section .news-item p,
.news-section .news-item .news-content,
.news-section .news-item .news-content *,
.news-section .news-item .news-excerpt,
.news-section .news-item .news-excerpt *,
.news-section .news-item .news-item-title,
.news-section .news-item .news-item-title *,
.news-archive-list .news-archive-item h3,
.news-archive-list .news-archive-item p,
.news-archive-list .news-archive-item .news-archive-content,
.news-archive-list .news-archive-item .news-archive-content *,
.news-archive-list .news-archive-item .news-archive-excerpt,
.news-archive-list .news-archive-item .news-archive-excerpt * {
    opacity: 1 !important;
    transform: none !important;
    transition: color 0.3s ease !important;
}

/* 緊急修正: アニメーションを削除して通常表示に戻す */
.news-section .news-list article.news-item[class],
.news-section .news-list .news-item[class],
.news-archive-list article.news-archive-item[class],
.news-archive-list .news-archive-item[class] {
    opacity: 1 !important;
    transform: translateY(0) !important;
}

/* JavaScriptのscroll-animationクラスが付いた場合のみアニメーション */
.news-section .news-list article.news-item.scroll-animation[class] {
    opacity: 0 !important;
    transform: translateY(30px) !important;
    transition: opacity 0.6s ease-out, transform 0.6s ease-out !important;
}

.news-section .news-list article.news-item.scroll-animation.visible[class] {
    opacity: 1 !important;
    transform: translateY(0) !important;
}