/* =============================
   News Filter Styles Only
   お知らせページのフィルター部分のみ適用
================================ */

:root {
  --blog-bg: #f9fafb;
  --blog-card: #ffffff;
  --blog-ink: #111827;
  --blog-muted: #6b7280;
  --blog-brand: #CE2746;
  --blog-brand-dark: #b71f39;
  --blog-radius: 12px;
}

/* フィルターコントロール */
body.news-page .wp-block-ultimate-post-advanced-filter {
  position: sticky !important;
  top: 0 !important;
  z-index: 5 !important;
  background: #fff !important;
  padding: 16px !important;
  border-radius: var(--blog-radius) !important;
  box-shadow: 0 2px 10px rgba(0,0,0,0.05) !important;
  margin-bottom: 18px !important;
}

body.news-page .ultp-filter-navigation,
body.news-page .ultp-block-wrapper > div:first-child {
  position: sticky !important;
  top: 0 !important;
  z-index: 5 !important;
  background: #fff !important;
  padding: 16px !important;
  border-radius: var(--blog-radius) !important;
  box-shadow: 0 2px 10px rgba(0,0,0,0.05) !important;
  margin-bottom: 18px !important;
}

/* ultp-heading-filterのボックスを完全に削除 */
body.news-page .ultp-heading-filter,
body.news-page .ultp-heading-filter * {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
}

/* 見出しテキストだけは通常表示 */
body.news-page .ultp-heading-filter h2,
body.news-page .ultp-heading-filter h3,
body.news-page .ultp-heading-filter .ultp-heading-filter-tag {
  display: none !important;
}

/* フィルターボタン（pills風） */
body.news-page .ultp-filter-select__parent,
body.news-page .ultp-filter-button {
  border: 1px solid #d1d5db !important;
  background: #fff !important;
  color: var(--blog-ink) !important;
  padding: 8px 12px !important;
  border-radius: 999px !important;
  cursor: pointer !important;
  transition: background .2s, color .2s, border-color .2s !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  box-shadow: none !important;
}

body.news-page .ultp-filter-select__parent-inner,
body.news-page .ultp-filter-button {
  color: var(--blog-ink) !important;
}

body.news-page .ultp-filter-select__parent:hover,
body.news-page .ultp-filter-button:hover,
body.news-page .ultp-filter-button-active {
  background: var(--blog-brand-dark) !important;
  border-color: var(--blog-brand-dark) !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: none !important;
}

body.news-page .ultp-filter-select__parent:hover .ultp-filter-select__parent-inner,
body.news-page .ultp-filter-button:hover,
body.news-page .ultp-filter-button-active {
  color: #fff !important;
}

body.news-page .ultp-filter-select__parent:hover .ultp-filter-select-field-icon svg,
body.news-page .ultp-filter-button:hover svg {
  fill: #fff !important;
}

body.news-page .ultp-filter-select-field-icon svg {
  fill: var(--blog-ink) !important;
}

/* ドロップダウンメニュー */
body.news-page .ultp-filter-select__dropdown {
  border-radius: 12px !important;
  border: 1px solid #e5e7eb !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
  background-color: #ffffff !important;
  margin-top: 8px !important;
}

body.news-page .ultp-filter-select__dropdown-inner {
  padding: 8px 16px !important;
  border-radius: 8px !important;
  transition: all 0.2s ease !important;
  color: var(--blog-ink) !important;
}

body.news-page .ultp-filter-select__dropdown-inner:hover {
  background: var(--blog-brand-dark) !important;
  color: #ffffff !important;
}

/* 検索ボックス */
body.news-page .ultp-filter-select-search {
  border-radius: 8px !important;
  border: 1px solid #e5e7eb !important;
  padding: 8px 12px !important;
  transition: all 0.3s ease !important;
  background: #f8f9fa !important;
}

body.news-page .ultp-filter-select-search:focus {
  border-color: var(--blog-brand-dark) !important;
  background: #fff !important;
  box-shadow: 0 0 0 3px rgba(183, 31, 57, 0.1) !important;
}

/* クリアボタン */
body.news-page .ultp-clear-button {
  border: 1px solid #e5e7eb !important;
  background: #fff !important;
  color: var(--blog-ink) !important;
  padding: 8px 12px !important;
  border-radius: 999px !important;
  cursor: pointer !important;
  transition: background .2s, color .2s, border-color .2s !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  box-shadow: none !important;
}

body.news-page .ultp-clear-button:hover {
  background: var(--blog-brand-dark) !important;
  border-color: var(--blog-brand-dark) !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: none !important;
}

/* 選択されたフィルタータグ */
body.news-page .ultp-selected-filter {
  border: 1px solid #d1d5db !important;
  background: #fff !important;
  color: var(--blog-ink) !important;
  padding: 6px 12px !important;
  border-radius: 999px !important;
  cursor: pointer !important;
  transition: background .2s, color .2s, border-color .2s !important;
  font-weight: 500 !important;
  font-size: 13px !important;
  box-shadow: none !important;
}

body.news-page .ultp-selected-filter:hover {
  background: var(--blog-brand-dark) !important;
  border-color: var(--blog-brand-dark) !important;
  color: #fff !important;
  box-shadow: none !important;
}

body.news-page .ultp-selected-filter-text {
  color: inherit !important;
  font-weight: 500 !important;
}

body.news-page .ultp-selected-filter-icon svg {
  fill: currentColor !important;
}

/* レスポンシブ対応 */
@media (max-width: 767px) {
  body.news-page .ultp-filter-select__parent,
  body.news-page .ultp-filter-button {
    padding: 7px 10px !important;
    font-size: 13px !important;
  }
}