/*--------------------------------------------------------------
This is your custom stylesheet.

Add your own styles here to make theme updates easier.
To override any styles from other stylesheets, simply copy them into here and edit away.

Make sure to respect the media queries! Otherwise you may
accidentally add desktop styles to the mobile layout.
https://www.w3schools.com/css/css_rwd_mediaqueries.asp
--------------------------------------------------------------*/
/* ===============================
   ベストアンサーバッジのスタイル
   =============================== */
.rg-best-answer-badge {
  display: inline-block;
  padding: 2px 8px;
  margin-right: 6px;
  margin-bottom: 4px;
  font-size: 11px;
  border-radius: 999px;
  background: #ffe58f;
  font-weight: 600;
}

/* ベストアンサーリンク */
.rg-best-answer-toggle {
  font-size: 11px;
  margin-left: 8px;
  cursor: pointer;
}
.rg-best-answer-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.rg-ba-item {
    background: #ffffff;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.04);
}

.rg-ba-header .rg-ba-label {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
    background: #ffe9a3;
    color: #7a5800;
    margin-bottom: 6px;
}

.rg-ba-question,
.rg-ba-answer {
    margin-bottom: 6px;
    font-size: 14px;
}

.rg-ba-author {
    font-size: 12px;
    color: #888;
    margin-left: 4px;
}

.rg-ba-meta a {
    font-size: 12px;
    text-decoration: underline;
}

.rg-profile-best-answers strong {
    font-weight: 700;
}

/* ===========================
   ギルド看板ヘッダー（整理版）
   =========================== */

/* ヘッダー全体にウッド×金ロゴを敷く */
#masthead,
.site-header,
.site-header .bb-header,
.site-header .bb-header-main,
.site-header .bb-header-primary,
.bb-sticky-header {
    background-color: #1b120d !important; /* 画像が見えないとき用の土台色 */
    background-image: url('https://rich-guild.jp/wp-content/uploads/2025/12/Gemini_Generated_Image_imfhldimfhldimfh.png') !important;
    background-repeat: no-repeat;
    background-size: cover;                /* 全幅にドーンと表示 */
    background-position: center 22% !important;  /* ← 看板の文字が真ん中に来る高さ */
    border-bottom: 2px solid #e3b75c;
}

/* ヘッダーの高さ（好みで 150〜190px くらい） */
.site-header,
.site-header .bb-header,
.site-header .bb-header-main,
.bb-sticky-header {
    min-height: 170px;
}

/* 中身を上下中央に揃える＋少し暗いグラデーション */
.site-header .bb-header-inner {
    height: 170px;
    display: flex;
    align-items: center;
    background: linear-gradient(
        to bottom,
        rgba(0, 0, 0, 0.55),
        rgba(0, 0, 0, 0.20)
    );
}

/* サイトタイトル（左上「RICH GUILD」） */
.site-header .site-title a {
    color: #f6e2a4 !important;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    text-shadow: 0 0 6px rgba(0, 0, 0, 0.7);
}

/* サイトのサブタイトルがあれば */
.site-header .site-description {
    color: #e3b75c !important;
}

/* 右上アイコン（検索・ベル・プロフィール） */
.site-header .header-right-menu a,
.site-header .header-right-menu i,
.site-header .header-right-menu .bb-icon {
    color: #f6e2a4 !important;
}
.site-header .header-right-menu a:hover,
.site-header .header-right-menu i:hover {
    color: #ffffff !important;
}

/* ===== タイトル位置を中央に揃える ===== */

/* タイトルをヘッダー高さに合わせて中央揃え */
.site-header .site-title a {
    line-height: 170px !important;  /* ← ヘッダーの高さと同じにする */
    margin: 0 !important;
    padding: 0 !important;
}

/* 万が一ズレる場合は微調整（必要なら値を変更） */
.site-header .site-title {
    position: relative;
    top: 10px;  /* ← 5〜15px の間で微調整すると完璧 */
}

/* ===========================
   モバイル用ヘッダー調整（ロゴは非表示風＋リンクは生かす）
   =========================== */
@media (max-width: 768px) {

    /* タイトル枠は残す */
    .site-header .site-title {
        margin: 0;
    }

    /* テキストは見せないけど、タップできるボタンとして残す */
    .site-header .site-title a {
        display: block !important;
        width: 180px;      /* タップ範囲（お好みで調整OK） */
        height: 60px;      /* 同上 */
        text-indent: -9999px;  /* 文字だけ画面外に追い出す */
        overflow: hidden;
        background: transparent;
        z-index: 5;
    }

    /* ヘッダーの高さ（スマホ用） */
    .site-header,
    .site-header .bb-header,
    .site-header .bb-header-main,
    .bb-sticky-header {
        min-height: 150px;
    }

    .site-header .bb-header-inner {
        height: 150px;
        display: flex;
        align-items: center;
    }

    /* 背景看板の位置 */
    #masthead,
    .site-header,
    .site-header .bb-header,
    .site-header .bb-header-main,
    .site-header .bb-header-primary,
    .bb-sticky-header {
        background-position: center center !important;
        background-size: cover !important;
        background-repeat: no-repeat !important;
    }
}

/* ===========================
   モバイル時：ヘッダーの下に余白を足す
   =========================== */
@media (max-width: 768px) {

    /* メインコンテンツにヘッダー分の余白を付ける */
    #content,
    .site-content {
        padding-top: 150px;  /* 足りなければ 50〜60px に増やしてみてOK */
    }
}

/* スマホ時だけWordPress管理バーを消す */
@media (max-width: 768px) {
    #wpadminbar {
        display: none !important;
    }
    html {
        margin-top: 0 !important;
    }
}


/* =======================================
   RICH GUILD 共通テーマカラー
   （既存のヘッダーCSSの下に追記）
   ======================================= */

/* ---------------------------------------
   ベストアンサーバッジ ＋ プロフィール情報
   --------------------------------------- */

/* ベストアンサーバッジ */
.rg-best-answer-badge {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 999px;
    background: linear-gradient(135deg, #f5d777, #d4af37);
    color: #3a2a22;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
}

/* ============================
   ベストアンサーバッジ（読みやすさ最強バージョン）
   ============================ */
.rg-best-answer-badge {
    display: inline-block;
    padding: 3px 12px;
    border-radius: 999px;

    /* 背景はブラック＋ゴールド縁取り */
    background-color: #000;
    color: #FFD875; /* 濃い金色で超見やすい */
    
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.03em;

    /* しっかり見える縁取り */
    border: 1px solid #C89B3C;

    /* 読みやすさ優先、影は最小限にシャープに */
    text-shadow: none;

    /* 少しだけ浮かせて高級感を出す */
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.4),
        inset 0 0 6px rgba(255, 215, 100, 0.15);
	
	background: linear-gradient(145deg, #1a1a1a, #000000);

}

/* ---------------------------------------
   モバイル向け 微調整（ヘッダー下の余白）
   --------------------------------------- */
@media (max-width: 768px) {
    .site-inner,
    .site-content {
        padding-top: 8px;
    }
}

/* プロフィールヘッダーの「ベストアンサー獲得数」表示（読みやすさ優先） */
.rg-profile-best-answers {
    margin-top: 4px;
    font-size: 13px;
    font-weight: 600;
    color: #3a2a22 !important;      /* 濃いブラウンでくっきり */
    text-shadow: none !important;   /* 影は消してシャープに */

    /* 見やすさのための薄いチップ風背景（いらなければ削除してOK） */
    padding: 2px 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.85);
    border: 1px solid rgba(0, 0, 0, 0.03);
}

.rg-profile-best-answers {
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid #d4af37; /* 控えめゴールド */
}

/* BuddyBoss：活動投稿のタイトル欄を非表示にする */
#whats-new-title,
#activity-whats-new-form .whats-new-title {
    display: none !important;
}

/* 投稿一覧に表示されるタイトルも非表示 */
.activity-item .activity-item-title,
.bb-activity-content .entry-header {
    display: none !important;
}

/* ===== X風 コメントレイアウト ===== */

/* コメント全体の背景は白、余白を少しだけ */
.activity-comments {
    background: #ffffff;
    border-radius: 0 0 10px 10px;
    padding: 8px 0 4px;
}

/* 1コメントごとの並び（アイコン左・テキスト右） */
.activity-comments .acomment-container {
    display: flex;
    align-items: flex-start;
    padding: 8px 16px;
    gap: 10px;
    border-top: 1px solid #eee3c7; /* 薄い仕切り線 */
}

/* 一番上のコメントだけ上の線を消す */
.activity-comments .acomment-container:first-child {
    border-top: none;
}

/* アバター（丸く・少し小さめ） */
.activity-comments .acomment-avatar img {
    width: 34px;
    height: 34px;
    border-radius: 50%;
}

/* 右側テキストラッパー */
.activity-comments .acomment-content {
    flex: 1;
    margin: 0; /* もともとの余白をリセット */
}

/* 名前＋メタ情報の行（Xの「名前　＠ID　・◯時間」みたいなイメージ） */
.activity-comments .acomment-meta {
    font-size: 13px;
    margin-bottom: 2px;
}

/* 投稿者名を太字 */
.activity-comments .acomment-meta a {
    font-weight: 600;
    color: #222222;
}

/* 日付などのメタ情報をグレーで */
.activity-comments .acomment-meta span,
.activity-comments .acomment-meta .time-since {
    color: #777777;
    font-weight: 400;
    margin-left: 4px;
}

/* コメント本文 */
.activity-comments .acomment-content p {
    margin: 0 0 4px;
    font-size: 14px;
    line-height: 1.5;
    color: #222;
}

/* アクション行全体 */
.activity-comments .acomment-options {
    display: flex;
    gap: 12px;
    font-size: 12px;
    color: #8899a6; /* Xっぽい薄グレー */
}

/* いいね / 返信ボタン */
.activity-comments .acomment-options a {
    color: #8899a6;
    text-decoration: none;
}

.activity-comments .acomment-options a:hover {
    color: #c89b3c;              /* ギルド金色でホバー */
    text-decoration: underline;
}

@media (max-width: 768px) {
    .activity-comments .acomment-container {
        padding: 6px 12px;
        gap: 8px;
    }

    .activity-comments .acomment-avatar img {
        width: 30px;
        height: 30px;
    }

    .activity-comments .acomment-content p {
        font-size: 13px;
    }
}

/* ランクページ（/guild-rank/ 配下）のサイドバーを非表示 */
body.post-type-gamipress_rank .widget-area,
body.single-gamipress_rank .widget-area {
    display: none !important;
}

/* ランクページのコンテンツ幅をフル幅に広げる */
body.post-type-gamipress_rank .content-area,
body.single-gamipress_rank .content-area {
    width: 100% !important;
    max-width: 100% !important;
}