/* ===== ゆるりいこう デザイン微調整（ブラウン×ベージュ×くすみブルー） ===== */
:root{
  --yuru-pink:#6fa3aa;        /* 差し色：くすみブルー */
  --yuru-pink-soft:#e7eff0;   /* 淡いブルー */
  --yuru-line:#e8ddc9;        /* ベージュの線 */
  --yuru-beige:#f8f3ea;       /* 背景ベージュ */
  --yuru-brown:#7a5d49;       /* ブラウン（文字差し色） */
  --yuru-blue:#6fa3aa;        /* くすみブルー */
  --yuru-blue-soft:#cfe1e3;
}

/* ---------- 全体の色味（ピンク→ブラウン×ベージュ×くすみブルー） ---------- */
/* 背景をベージュに */
body{ background-color:var(--yuru-beige) !important; }

/* カテゴリーラベル（ピンクのバッジ）→ くすみブルー */
.cat-label,
.widget-entry-cards .cat-label,
.entry-card-wrap .cat-label{
  background-color:var(--yuru-blue) !important;
  color:#fff !important;
}

/* スマホ下部の固定メニュー（ピンク）→ くすみブルー */
.navi-menu-buttons,
.navi-menu-button,
.mobile-menu-buttons,
.mobile-menu-buttons a,
.mobile-menu-buttons .menu-button-in,
.navi-menu-content,
.menu-content,
.menu-button-in,
#fixed-mobile-menu .menu-button{
  background-color:var(--yuru-blue) !important;
}

/* ページ送り（ピンク）→ くすみブルー */
.page-numbers.current,
.pagination .current,
a.page-numbers:hover{
  background-color:var(--yuru-blue) !important;
  border-color:var(--yuru-blue) !important;
  color:#fff !important;
}
.page-numbers{ border-color:var(--yuru-blue-soft) !important; }

/* 見出し・引用などピンクの差し色をブラウン/ブルーに */
.widget-sidebar-title,
.article h2, .article h3,
.entry-content h2, .entry-content h3{
  border-color:var(--yuru-blue) !important;
}
blockquote{ border-color:var(--yuru-blue-soft) !important; }

/* ボタン類のピンク→くすみブルー */
.wp-block-button__link,
.btn, .cocoon-button{
  background-color:var(--yuru-blue) !important;
  border-color:var(--yuru-blue) !important;
}

/* 「次のページ」などのキーボタン（ピンク枠）→ くすみブルー */
.pagination-next-link.key-btn,
.key-btn{
  border-color:var(--yuru-blue) !important;
  background-color:var(--yuru-blue-soft) !important;
  color:var(--yuru-brown) !important;
}
.pagination-next-link.key-btn:hover,
.key-btn:hover{
  background-color:var(--yuru-blue) !important;
  color:#fff !important;
}

/* リンク文字（プロフィール名など）をくすみブルー寄りに統一 */
.author-link, .widget a, .sidebar a{ color:var(--yuru-blue) !important; }

/* ---------- ヘッダー画像の差し替え（新・水彩バナー） ---------- */
#header.header{
  background-image:url(/wp-content/uploads/2025/05/header-yuru-2026.png?v=2) !important;
  background-size:cover !important;       /* 画像と帯の比率を合わせるので切れない */
  background-position:center !important;
  background-repeat:no-repeat !important;
  aspect-ratio:2172 / 724;               /* 新画像と同じ比率に */
  height:auto !important;
  min-height:0 !important;
}
#header.header .header-in{ min-height:0 !important; }

/* ---------- 記事一覧カード ---------- */
.entry-card-wrap.a-wrap{
  border-radius:16px !important;
  border:1px solid var(--yuru-line) !important;
  box-shadow:0 4px 14px rgba(180,120,140,.10) !important;
  overflow:hidden;
  background:#fff;
  transition:transform .2s ease, box-shadow .2s ease;
}
.entry-card-wrap.a-wrap:hover{
  transform:translateY(-4px);
  box-shadow:0 12px 26px rgba(180,120,140,.20) !important;
}
.entry-card.e-card{ border:none !important; }

/* サムネイルの角丸 */
.card-thumb-image,
.entry-card-thumb-image{ border-radius:12px !important; }

/* カード同士の間隔をゆったり */
.list .a-wrap,
.list .entry-card-wrap{ margin-bottom:24px !important; }

/* タイトルにマウスを乗せたらピンクに */
.entry-card-wrap:hover .entry-card-title,
.entry-card-wrap:hover .card-title{ color:var(--yuru-pink) !important; }

/* カテゴリーラベルを少しやわらかく */
.cat-label{
  border-radius:6px !important;
  font-weight:600;
}

/* ---------- グローバルメニュー ---------- */
.global-nav-list a,
.navi-in > ul > li > a{
  border-radius:10px;
  transition:background .2s ease, color .2s ease;
}
.global-nav-list a:hover,
.navi-in > ul > li > a:hover{
  background:var(--yuru-pink-soft) !important;
  color:var(--yuru-pink) !important;
}

/* ページ送りの矢印が□（豆腐）になるのを普通の矢印に置き換え */
.pagination .fa,
.pagination [class*="fa-angle"]{ font-family:inherit !important; }
.pagination .fa-angle-left::before{ content:"\2039" !important; }       /* ‹ */
.pagination .fa-angle-right::before{ content:"\203A" !important; }       /* › */
.pagination .fa-angle-double-left::before{ content:"\00AB" !important; }  /* « */
.pagination .fa-angle-double-right::before{ content:"\00BB" !important; } /* » */

/* ---------- 楽天ROOM：Rのみフォローボタンを消し、わたしのROOMバナーを中央に ---------- */
/* 「こうきをフォローする！」内の R だけのボタンを非表示 */
.rakuten-room-follow-button-sq,
.sns-button.rakuten-room-button{ display:none !important; }

/* わたしのROOM バナーをフォローボタンの下に中央揃え */
img[src*="myroom_banner"]{
  display:block !important;
  margin:20px auto 6px !important;
  max-width:100%;
  height:auto;
}