/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/

/* 管理画面では必ず横書きに戻す */
body.wp-admin .row-title,
body.wp-admin .row-title a {
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
}

/* 全てのTablePressテーブルの1列目を非表示にする */
.tablepress .column-1 {
    display: none;
}
/* TablePressのテーブル見出しが長すぎる場合に自動で改行する */
.tablepress th {
  overflow-wrap: break-word;
  word-wrap: break-word;
}

/* 記事内の特定の要素を非表示（レガシー設定） */
.single-post .featured-image {
    display: none;
}
.single-post .byline,
.single-post .posted-on {
    display: none;
}

/* =======================================================
   Favorites V1 (Button & Basic Grid)
   ======================================================= */
.add-to-favorite-btn{
  display:inline-flex; align-items:center; gap:6px;
  border:1px solid rgba(0,0,0,.15);
  border-radius:6px; padding:6px 10px;
  background:#fff; color:#222;
  font-weight:600; font-size:0.9rem;
  cursor:pointer; transition:all .2s ease;
}
.add-to-favorite-btn::before{
  content:"☆";
  font-size:1rem;
  color:#ffb400;
}
.add-to-favorite-btn.is-favorited{
  background:#222; color:#fff; border-color:#111;
}
.add-to-favorite-btn.is-favorited::before{
  content:"★"; color:#ffcc00;
}
.add-to-favorite-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 2px 6px rgba(0,0,0,.15);
}

/* 小さめバリエーション（カード内など） */
.add-to-favorite-btn.is-compact { padding:.35rem .6rem; font-size:.9rem; }

/* 一覧のグリッド */
#favorite-pokemon-display {
  display:grid; grid-template-columns:repeat(auto-fill, minmax(140px, 1fr));
  gap:18px; align-items:start;
}

/* 解除ボタン（小さく目立ちすぎない） */
.unfavorite-btn {
  margin-top:8px;
  font-size:.8rem; padding:.35rem .6rem;
  border-radius:9999px; border:1px solid rgba(0,0,0,.15);
  background:#f6f6f6; color:#333; cursor:pointer;
}
.unfavorite-btn:hover { background:#ededed; }
.unfavorite-btn:focus-visible { outline:3px solid #4da3ff; outline-offset:2px; }

@media (prefers-color-scheme: dark) {
  #favorite-pokemon-display > div { background:#1f1f1f; border-color:rgba(255,255,255,.08); }
  #favorite-pokemon-display a { color:#e9e9e9; }
  .add-to-favorite-btn { background:#2b2b2b; color:#e9e9e9; border-color:rgba(255,255,255,.1); }
  .unfavorite-btn { background:#2b2b2b; color:#e9e9e9; border-color:rgba(255,255,255,.1); }
}

@media (prefers-reduced-motion: reduce) {
  .add-to-favorite-btn, #favorite-pokemon-display > div { transition:none !important; }
}

/* =======================================================
   Toast UI (Notifications)
   ======================================================= */
/* どのUIよりも上に。ブラウザ最大級のz-indexに */
#pgo-toast-host{
  position:fixed;
  left:50%;
  transform:translateX(-50%);
  bottom: calc(env(safe-area-inset-bottom, 0px) + 18px + var(--pgo-safe-bottom, 0px));
  z-index: 2147483647;     /* “ほぼ最上位” */
  pointer-events:none;
}
.pgo-toast{
  pointer-events:auto;     /* Undo ボタンなどは押せる */
  opacity:0; transform:translateY(8px);
  transition:opacity .2s, transform .2s;
  background:#222; color:#fff;
  padding:.55rem .8rem; border-radius:10px;
  box-shadow:0 6px 18px rgba(0,0,0,.25);
  font-weight:600; font-size:.9rem; margin-top:8px;
  display:inline-flex; gap:.8rem; align-items:center;
}
.pgo-toast.in{ opacity:1; transform:translateY(0) }

/* PopupMaker（ドロワー/モーダル）を開いている時は上側へ逃がす */
body.pum-open #pgo-toast-host{
  bottom:auto;
  top: 18px;
  transform:translateX(-50%); /* 位置リセット */
}

/* ライトモードでも視認性を確保 */
@media (prefers-color-scheme: light){
  .pgo-toast{ background:#2a2a2a }
}


/* =======================================================
   PGO Route Map Styles (Final Version)
   - Mobile Optimized
   - Current Location Highlight (Vermilion)
   - Vertical Layout for Station Name/Stars
   ======================================================= */

.pgo-route-container {
    font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
    margin: 10px 0;
    padding: 10px 5px; /* スマホ用に余白を削減 */
    background: #fdfdfd;
    border-radius: 8px;
    border: 1px solid #eee;
}

.pgo-route-timeline {
    list-style: none;
    margin: 0;
    padding: 0 0 0 16px; /* 左ライン用のスペースを最小限に */
    position: relative;
}

/* 縦のライン線 */
.pgo-route-timeline::before {
    content: '';
    position: absolute;
    top: 10px;
    bottom: 10px;
    left: 6px;
    width: 3px;
    background: #e0e0e0;
    border-radius: 2px;
}

.pgo-route-station {
    position: relative;
    margin-bottom: 0;
    padding: 8px 0 8px 18px; /* 上下の余白を詰め、左はマーカー分空ける */
}

/* -------------------------------------------------------
   マーカー（点）のデザイン定義
   ------------------------------------------------------- */
/* デフォルト（通過駅など） */
.pgo-route-marker {
    position: absolute;
    left: 0px;
    top: 50%;
    transform: translateY(-50%); /* 常に垂直中央配置 */
    width: 14px;
    height: 14px;
    background: #fff;
    border: 3px solid #ccc;
    border-radius: 50%;
    z-index: 2;
    transition: all 0.3s ease;
}

/* リンクがある駅（通常）のマーカーを「青」にする */
.pgo-route-station.is-linked .pgo-route-marker {
    border-color: #3498db;
    background: #fff;
}

/* 現在地ハイライト（朱色）のマーカー ※優先度高 */
.pgo-route-station.is-current-location .pgo-route-marker {
    border-color: #e74c3c !important; /* 朱色 */
    background: #e74c3c !important;   /* 中身も塗りつぶす */
    width: 16px;
    height: 16px;
    left: -1px;
    box-shadow: 0 0 0 3px rgba(231, 76, 60, 0.2);
}

/* -------------------------------------------------------
   リンクボタン・パネル部分のデザイン
   ------------------------------------------------------- */
.pgo-route-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-decoration: none;
    color: #333;
    background: #fff;
    padding: 10px 12px;
    border-radius: 6px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.06);
    border: 1px solid #f0f0f0;
    border-left: 4px solid #3498db; /* デフォルトの青アクセント */
    transition: transform 0.2s, background 0.2s;
}

.pgo-route-link:active {
    transform: scale(0.98);
    background: #f5f5f5;
}

/* 現在地ハイライト時のパネル（薄い赤背景＋朱色ボーダー） */
.pgo-route-station.is-current-location .pgo-route-link {
    border-left-color: #e74c3c !important;
    background-color: #fff5f5 !important;
    border-color: #fadbd8;
}

/* -------------------------------------------------------
   テキスト・情報・星のデザイン
   ------------------------------------------------------- */
.station-info {
    display: flex;
    flex-direction: column; /* 駅名と星を常に縦積みにする（全デバイス共通） */
    line-height: 1.2;
}

.station-name {
    font-weight: bold;
    font-size: 16px; /* 指でタップしやすいサイズ */
    color: #333;
}

/* レイドレベルの星 */
.pgo-route-stars {
    color: #f39c12;
    font-size: 11px;
    margin-top: 2px;
    letter-spacing: 1px;
}

/* -------------------------------------------------------
   GOボタンのデザイン
   ------------------------------------------------------- */
.pgo-route-go-btn {
    background: #3498db;
    color: #fff;
    font-size: 11px;
    font-weight: bold;
    padding: 4px 8px;
    border-radius: 12px;
    margin-left: 8px;
    white-space: nowrap;
    flex-shrink: 0; /* 縮まないように */
}

/* 現在地ハイライト時のボタン（朱色） */
.pgo-route-station.is-current-location .pgo-route-go-btn {
    background: #e74c3c;
}

/* -------------------------------------------------------
   通過駅（リンクなし）の表示調整
   ------------------------------------------------------- */
.pgo-route-station.is-passing .pgo-route-marker {
    width: 10px;
    height: 10px;
    left: 2px;
    border-width: 2px;
    border-color: #ccc; /* 念のため灰色指定 */
    background: #fff;
}
.pgo-route-nolink {
    padding: 5px 10px;
    display: block;
    color: #aaa;
    font-size: 14px;
}

/* =======================================================
   モバイル特化調整 (iPhone SE等の小画面用 Max 400px)
   ======================================================= */
@media (max-width: 400px) {
    /* 全体の余白をさらに詰める */
    .pgo-route-link {
        padding: 8px 8px;
    }
    
    /* 文字サイズを少し小さくして改行しても圧迫感が出ないようにする */
    .station-name {
        font-size: 14px;
        line-height: 1.3;
    }
    
    /* 星のサイズと位置調整 */
    .pgo-route-stars {
        font-size: 10px;
        margin-top: 2px;
        margin-left: 0;
    }
    
    /* ボタンもコンパクトに */
    .pgo-route-go-btn {
        padding: 3px 6px;
        font-size: 10px;
        margin-left: 6px;
    }
    
    /* 重要：狭い画面でも「縦並び」を強制（横並びコードは削除済み） */
    .station-info {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
    }
}

/* =======================================================
   Expressway Green Sign Ver.2.0
   ======================================================= */

/* 全体レイアウト */
.pgo-hw-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 20px 0;
    font-family: "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
    box-sizing: border-box;
}

/* 緑看板 本体 */
.pgo-hw-sign {
    width: 95%;
    max-width: 500px;
    background-color: #006a4d; /* 高速道路グリーン */
    color: #fff;
    border-radius: 6px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    overflow: hidden;
    position: relative;
    border: 2px solid #fff;
    outline: 2px solid #006a4d; /* 二重枠表現 */
    margin-bottom: 0;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* ★ 現在地ハイライト（赤いオーラ） */
.pgo-hw-sign.is-current-location {
    box-shadow: 0 0 0 4px rgba(231, 76, 60, 0.6), 0 8px 20px rgba(0,0,0,0.3);
    outline: none; /* 緑枠を消して赤枠を目立たせる */
    border-color: #fff;
    z-index: 5; /* 他より手前に表示 */
    transform: scale(1.02); /* ほんの少し大きく */
}

/* ヘッダー：住所部分 */
.pgo-hw-header {
    background-color: rgba(0,0,0,0.2); /* 少し濃くして視認性UP */
    border-bottom: 1px solid rgba(255,255,255,0.3);
    padding: 8px 12px;
    font-size: 0.9rem;
}

.pgo-hw-header a {
    color: #fff;
    text-decoration: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.pgo-hw-header a:hover {
    background-color: rgba(255,255,255,0.1);
}

/* ★ HEREバッジ */
.pgo-hw-here-badge {
    background-color: #fff;
    color: #e74c3c; /* 赤文字 */
    font-weight: bold;
    font-size: 0.75rem;
    padding: 2px 8px;
    border-radius: 12px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    animation: pulse 2s infinite; /* 軽く明滅させる演出 */
}

@keyframes pulse {
    0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.7); }
    70% { transform: scale(1.05); box-shadow: 0 0 0 6px rgba(255, 255, 255, 0); }
    100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); }
}

/* ボディ：IC名部分 */
.pgo-hw-body {
    padding: 12px 20px 15px; /* 下を少し広めに */
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.pgo-hw-main-info {
    display: flex;
    flex-direction: column; /* 日本語と英語を縦積みに */
}

.pgo-hw-ic-name {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: 0.05em;
}

/* ★ ローマ字表記 */
.pgo-hw-ic-en {
    font-size: 0.9rem; /* 日本語より小さく */
    font-weight: 500;
    opacity: 0.9; /* 少し薄くして階層感を出す */
    margin-top: 2px;
    font-family: "Helvetica Neue", Arial, sans-serif; /* 英語らしいフォント */
    text-transform: capitalize; /* 先頭大文字 */
}

/* 上り・下りバッジ */
.pgo-hw-badge {
    font-size: 0.7rem;
    padding: 3px 6px;
    border-radius: 4px;
    background-color: #fff;
    color: #006a4d;
    font-weight: bold;
    white-space: nowrap;
    margin-left: 10px;
}

/* 連結矢印 (⇅) */
.pgo-hw-connector {
    color: #006a4d;
    font-size: 1.6rem;
    font-weight: bold;
    line-height: 1;
    margin: 4px 0;
    text-shadow: 0 1px 0 #fff;
    opacity: 0.6; /* 矢印は少し控えめに */
}

.pgo-hw-end {
    color: #888;
    font-size: 0.8rem;
    margin-top: 10px;
    font-weight: bold;
    letter-spacing: 1px;
}

/* =======================================================
   General Road Sign Ver.4 (No Arrow, Wide Area)
   ======================================================= */

.pgo-gr-container {
    width: 100%;
    max-width: 600px;
    margin: 30px auto;
    font-family: "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* ポール */
.pgo-gr-pole-top { width: 12px; height: 20px; background: #444; }
.pgo-gr-pole-bottom { width: 12px; height: 30px; background: #444; margin-top: -2px; border-radius: 0 0 4px 4px; }

/* 青看板本体 */
.pgo-gr-board {
    width: 100%;
    background-color: #005ea5; /* 道路標識ブルー */
    border: 3px solid #fff;
    border-radius: 6px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.3);
    overflow: hidden;
    color: #fff;
}

/* 行リンク */
a.pgo-gr-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-decoration: none;
    color: #fff;
    padding: 15px 15px; /* 上下余白を少しゆったりと */
    transition: background-color 0.2s;
}
a.pgo-gr-row:hover {
    background-color: #004488;
}

/* 区切り線 */
.pgo-gr-divider {
    height: 1px;
    background-color: rgba(255,255,255,0.4);
    margin: 0 10px;
}
.pgo-gr-divider:last-child { display: none; }

/* --- カラム設定 --- */

/* 1. 都道府県エリア */
.pgo-gr-pref-col {
    flex: 0 0 auto;
    width: 50px;
    margin-right: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-right: 1px solid rgba(255,255,255,0.5);
    padding-right: 12px;
}
.pgo-gr-pref {
    font-size: 14px;
    font-weight: bold;
    line-height: 1.2;
    text-align: center;
    writing-mode: vertical-rl; /* 縦書き */
    text-orientation: upright;
    letter-spacing: 2px;
}

/* 2. 行き先エリア (メイン・最大化) */
.pgo-gr-dest-col {
    flex: 1; /* 残りの幅を全て使う */
    display: flex;
    align-items: center;
    min-width: 0; /* 文字あふれ防止のために必須 */
}

.pgo-gr-names {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.pgo-gr-name-jp {
    font-size: 22px; /* 少し大きく */
    font-weight: bold;
    line-height: 1.1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pgo-gr-name-en {
    font-size: 15px;
    font-family: "Helvetica Neue", Arial, sans-serif;
    font-weight: normal;
    opacity: 0.9;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 4px;
}

/* 3. 距離エリア */
.pgo-gr-dist-col {
    flex: 0 0 auto;
    text-align: right;
    margin-left: 10px;
    min-width: 60px;
}
.pgo-gr-dist-val {
    font-size: 26px; /* 強調 */
    font-weight: bold;
    line-height: 1;
    font-family: Arial, sans-serif;
}
.pgo-gr-dist-unit {
    font-size: 13px;
    margin-left: 2px;
}

/* --- スマホ用レスポンシブ (480px以下) --- */
@media (max-width: 480px) {
    .pgo-gr-container { margin: 15px auto; }
    
    a.pgo-gr-row { padding: 10px 10px; }

    /* 都道府県エリア縮小 */
    .pgo-gr-pref-col {
        width: 30px;
        margin-right: 8px;
        padding-right: 8px;
    }
    .pgo-gr-pref { font-size: 11px; letter-spacing: 1px; }

    /* 文字サイズ調整 */
    .pgo-gr-name-jp { font-size: 18px; }
    .pgo-gr-name-en { font-size: 12px; margin-top: 2px; }
    .pgo-gr-dist-val { font-size: 20px; }
    .pgo-gr-dist-unit { font-size: 10px; }
}

/* --- 共通: コンテナ --- */
.pgo-fids-container, .pgo-airport-tickets-grid {
    width: 100%;
    max-width: 700px;
    margin: 20px auto;
    font-family: "Roboto Mono", "Courier New", sans-serif;
}

/* =========================================
   1. FIDS (電光掲示板) Styles
   ========================================= */
.pgo-fids-container {
    background: #1a1a1a;
    border: 4px solid #333;
    border-radius: 8px;
    box-shadow: 0 10px 20px rgba(0,0,0,0.5);
    overflow: hidden;
}
.pgo-fids-header {
    background: #000;
    color: #666;
    display: flex;
    padding: 8px 15px;
    font-size: 0.75rem;
    letter-spacing: 1px;
    border-bottom: 2px solid #333;
}
.pgo-fids-row {
    display: flex;
    align-items: center;
    padding: 12px 15px;
    border-bottom: 1px solid #333;
    background: #222;
}
.pgo-fids-city-link {
    color: #ffb300; /* Amber LED Color */
    font-size: 1.1rem;
    font-weight: bold;
    text-decoration: none;
    text-shadow: 0 0 5px rgba(255, 179, 0, 0.5);
}
.fids-code {
    color: #00e5ff;
    font-weight: bold;
}
.pgo-fids-book-btn {
    background: #e67e22;
    color: #fff;
    padding: 4px 10px;
    border-radius: 3px;
    font-size: 0.8rem;
    text-decoration: none;
    font-weight: bold;
}
.pgo-fids-col.dest { flex: 1; }
.pgo-fids-col.route { margin: 0 15px; color: #fff; font-size: 0.9rem;}
.pgo-fids-footer {
    background: #000;
    color: #444;
    text-align: right;
    font-size: 0.7rem;
    padding: 4px 10px;
}

/* =========================================
   2. Airport Ticket (搭乗券リンク) Styles
   ========================================= */
.pgo-airport-tickets-grid {
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.pgo-air-ticket {
    display: flex;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    text-decoration: none;
    color: #333;
    position: relative;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
    transition: transform 0.2s, box-shadow 0.2s;
    overflow: hidden;
}
.pgo-air-ticket:hover {
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.15);
}
/* 左側の半券風デザイン */
.pgo-air-ticket::after {
    content: "";
    position: absolute;
    top: 10px; bottom: 10px;
    right: 80px;
    border-right: 2px dashed #ccc; /* キリトリ線 */
}
.ticket-left {
    flex: 1;
    padding: 15px;
    display: flex;
    flex-direction: column;
}
.ticket-label {
    font-size: 0.7rem;
    color: #999;
    letter-spacing: 1px;
    font-weight: bold;
}
.ticket-code {
    font-size: 2rem;
    font-weight: 900;
    color: #222;
    line-height: 1;
    margin: 5px 0;
}
.ticket-city {
    font-size: 0.9rem;
    color: #555;
}
.ticket-right {
    width: 80px;
    background: #f9f9f9;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 10px;
    text-align: center;
}
.ticket-memo {
    font-size: 0.7rem;
    color: #e67e22;
    font-weight: bold;
    margin-bottom: 5px;
}
.ticket-icon {
    font-size: 1.5rem;
    color: #222;
    transform: rotate(-45deg);
}

/* スマホ対応 */
@media (max-width: 500px) {
    .pgo-fids-header { display: none; }
    .pgo-fids-row { flex-wrap: wrap; padding: 15px; }
    .pgo-fids-col.dest { width: 100%; margin-bottom: 10px; }
    .pgo-fids-col.route { margin: 0; flex: 1; }
}

/* --- FIDS (掲示板) の調整 --- */

/* 行き先リンクのレイアウト */
.pgo-fids-dest-link {
    display: flex;
    flex-direction: column; /* 縦並びにする */
    line-height: 1.2;
    text-decoration: none;
}

/* ① 空港名（大） */
.dest-airport-name {
    color: #ffb300;
    font-size: 1.1rem;
    font-weight: bold;
    text-shadow: 0 0 5px rgba(255, 179, 0, 0.5);
}

/* ① 市町村名（小） */
.dest-city-name {
    color: #888;
    font-size: 0.75rem;
    margin-top: 2px;
}

/* モバイル調整 */
@media (max-width: 500px) {
    .pgo-fids-dest-link {
        flex-direction: row; /* スマホなら横並びでもOK、お好みで */
        align-items: baseline;
        gap: 5px;
        flex-wrap: wrap;
    }
}


/* --- Ticket (アクセス券) の調整 --- */

/* ② 空港名を大きく */
.ticket-name {
    font-size: 1.4rem; /* コードよりは小さくても読めるサイズに */
    font-weight: bold;
    color: #222;
    line-height: 1.2;
    margin: 5px 0 8px 0;
}

/* ② 距離・時間情報 */
.ticket-info {
    font-size: 0.85rem;
    color: #555;
    background: #f0f0f0;
    padding: 3px 8px;
    border-radius: 4px;
    display: inline-block;
    align-self: flex-start; /* 左寄せ */
}

/* 右側の装飾 */
.ticket-sub-code {
    font-size: 1.2rem;
    font-weight: 900;
    color: #ddd; /* 薄く表示してデザイン要素にする */
    margin-bottom: 5px;
}

/* ===== FAVORITES v2 (clean) — start ===== */

/* ラッパー：カードを縦に並べる（PCでも読みやすい） */
.fav-list{
  display:flex;
  flex-direction:column;
  gap:12px;
}

/* カード2カラム：左＝画像 / 右＝本文 */
.fav-card{
  display:grid;
  grid-template-columns: 112px 1fr;
  gap:14px;
  background:#111; color:#fff;
  border-radius:14px; padding:14px;
  box-shadow:0 6px 20px rgba(0,0,0,.18);
  overflow:hidden; align-items:start;
}
.fav-card__media img{
  width:100px; height:100px; object-fit:cover; border-radius:12px; display:block;
}

/* 本文の上部：タイトル + タイプ列（PCは横、SPは縦） */
.fav-head{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.fav-card__title{ margin:0; font-size:18px; line-height:1.25; }
.fav-card__title a{ color:#fff; text-decoration:none }
.fav-card__title a:hover{ text-decoration:underline }
.fav-types{ display:flex; gap:6px; flex-wrap:wrap; }

/* タイプバッジ（Favorites専用のサイズ固定） */
.fav-card .pgo-type{
  display:inline-flex; align-items:center; gap:6px;
  padding:4px 8px; margin:2px; border-radius:9999px;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.15);
  line-height:1; font-size:13px; color:#fff;
}
.fav-card .pgo-type img{
  width:18px; height:18px; object-fit:contain; display:block; border-radius:50%;
}
.fav-card .pgo-type i{ font-style:normal; font-size:13px; }

/* 情報ボード（右側の囲い） */
.info-board{
  margin-top:10px;
  padding:12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.05);
}
.board-row + .board-row{
  margin-top:12px; padding-top:12px;
  border-top:1px dashed rgba(255,255,255,.15);
}
.board-title{ font-size:13px; font-weight:700; opacity:.9; margin-bottom:8px; }

/* “弱点チップ = 2列固定” */
.chips-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap:8px;
}
.chips-grid .pgo-type{ width:100%; justify-content:center; }

/* “レイドCP = 2行（ラベル左・値右）” */
.raid-grid{
  display:grid;
  grid-template-columns: auto 1fr;
  gap:8px 12px;
}
.raid-grid .raid-label{ font-size:13px; opacity:.85; }
.raid-grid .raid-value{ font-weight:700; }

/* 下部アクション */
.fav-card__actions{ margin-top:10px }
.unfavorite-btn{
  font-size:12px; padding:6px 10px; border-radius:9999px;
  border:1px solid rgba(255,255,255,.2);
  background:#222; color:#fff; cursor:pointer;
}
.unfavorite-btn:hover{ background:#2a2a2a }

/* --------- モバイル最適化（≤600px） --------- */
@media (max-width:600px){
  .fav-card{ grid-template-columns: 88px 1fr; padding:12px; }
  .fav-card__media img{ width:80px; height:80px; }
  .fav-head{ display:block; }
  .fav-types{ margin-top:6px; }
  .board-title{ margin-bottom:6px; }
}

/* ライトモードの微調整（任意） */
@media (prefers-color-scheme: light){
  .info-board{ background: rgba(0,0,0,.04); border-color: rgba(0,0,0,.08); }
  .board-row + .board-row{ border-top-color: rgba(0,0,0,.12); }
}

/* ---- SPでは弱点チップを1列に（レイドCPはそのまま2行） ---- */
@media (max-width: 600px){
  .info-board .chips-grid{
    grid-template-columns: 1fr;   /* 1列固定 */
    gap: 8px;
  }
  .info-board .chips-grid .pgo-type{
    width: 100%;
    justify-content: center;      /* ピルを中央寄せ */
  }
}