/* アコーディオンボタンのスタイルを調整して、リストグループのように見せる */
.accordion-button {
    /* フォントサイズの調整（重複を解消し、最終定義として残す） */
    font-size: 0.95rem; 
}
.accordion-button:focus {
    /* フォーカス時の青い影を消す（重複を解消し、最終定義として残す） */
    box-shadow: none; 
}

/* ---------------------------------------------------- */
/* 【削除済み】横スクロールに関するスタイルはすべて不要になったため削除 */
/* ---------------------------------------------------- */
/*
.actress-ranking-scroll-container,
.actress-ranking-scroll-container::-webkit-scrollbar,
.actress-ranking-list の関連スタイルは削除済み
*/
/* Custom CSS File (例: style.css) */

/* デフォルト（閉じている状態）では下向き矢印 */
.accordion-icon {
    transition: transform 0.2s ease-in-out;
}

/* 開いている状態のボタンの直下にある場合 */
.btn:not(.collapsed) .accordion-icon {
    /* ボタンが開いている（.collapsedではない）場合、180度回転させて上向きにする */
    transform: rotate(180deg);
}

/* もし上記で動かない場合は、代わりに以下のクラスを使用 */
/* .collapse.show の状態をターゲットにするCSSが必要になることもあります。 */

.pr-label {
    /* 目立ちすぎないが認識できる色 */
    color: #cc0000; 
    /* 背景色で区別 */
    background-color: #ffe0e0;
    /* 角丸にして、ラベル感を持たせる */
    border-radius: 4px;
    /* パディングで視認性向上 */
    padding: 2px 5px;
    font-size: 0.8em; /* サイズを小さくする */
    font-weight: bold;
    margin-left: 5px;
    /* リンクではないことを明確にするため、カーソルを通常に戻す */
    cursor: default; 
}



/* 1. 全ての画像のコンテナに適用する設定 (中央寄せのベース) */
#thumbnailArea .image-container {
    /* コンテナの幅は親要素（#thumbnailArea）いっぱいを使用 */
    width: 100%;
    /* 内部のインライン要素を中央に寄せる */
    text-align: center;
    /* リンク（aタグ）がブロック要素で覆われている場合も中央寄せを保証 */
    margin: 0 auto; 
}

/* 2. 画像そのものに適用する設定 */
#thumbnailArea .image-container img {
    /* デフォルトの「引き伸ばし防止」設定 */
    width: auto !important; 
    height: auto !important;
    
    /* ブロック要素化して margin: 0 auto; による中央寄せを適用 */
    display: block; 
    margin: 0 auto;
    
    /* プレースホルダー画像（150x100）や、代替画像（128x128）はこの設定で中央に表示されます */
}

/* 3. 【重要】親要素を基準に引き伸ばしたい画像（大きなサムネイルなど）のスタイル */
/* もし、代替画像ではない大きな画像の場合に引き伸ばしたい場合は、
 * その画像のクラスを特定し、 width: 100%; を適用します。
 * (例: 代替画像と判別できないため、現時点では #videoThumbnail にデフォルトで適用することは避けます)
 */