/* 필터 프리셋 — 북마크 아이콘 + popover 형태
 * 위치: titleArea 안 (title 옆)
 * 기본: 작은 ☆ 아이콘 1개만 노출. 클릭 시 popover 표시.
 */

.mFilterPresets {
  position: relative;
  /* m-filter 가 있는 페이지에서만 노출 — :has() 로 CSS 단에서 처리 (FOUC/시프트 없음) */
  display: none;
  align-items: center;
  margin: 0 0 0 12px;
}
body:has(.mSearchEngine) .mFilterPresets { display: inline-flex; }

/* 토글 — 텍스트 "내 검색 ▼" 버튼 */
.mFilterPresets .eFilterPresetToggle {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 24px;
  padding: 0 8px;
  border: 1px solid #d0d8e3;
  border-radius: 4px;
  background: #fff;
  color: #4a5872;
  cursor: pointer;
  font-size: 11px;
  font-weight: 500;
  line-height: 1;
  transition: background-color 120ms, color 120ms, border-color 120ms;
}
.mFilterPresets .eFilterPresetToggle:hover {
  color: #1f4d8a;
  background: #f4f7fb;
  border-color: #1f4d8a;
}
.mFilterPresets .eFilterPresetToggle[aria-expanded="true"] {
  color: #1f4d8a;
  background: #eef2f7;
  border-color: #1f4d8a;
}
/* caret 화살표 */
.mFilterPresets .eFilterPresetToggle .icoCaret {
  display: inline-block;
  width: 0; height: 0;
  margin-left: 2px;
  border-left: 3px solid transparent;
  border-right: 3px solid transparent;
  border-top: 4px solid currentColor;
}
.mFilterPresets .eFilterPresetToggle[aria-expanded="true"] .icoCaret {
  border-top: 0;
  border-bottom: 4px solid currentColor;
}
/* 저장된 프리셋 있을 때 텍스트 진하게 */
.mFilterPresets.hasPresets .eFilterPresetToggle {
  color: #1f4d8a;
  font-weight: 600;
}

/* hidden 속성이 CSS display 룰보다 우선되도록 (HTML5 hidden 의 보편 동작 복원) */
.mFilterPresets [hidden] { display: none !important; }

/* 해제(×) 버튼 — 현재 필터가 적용 중일 때만 노출 */
.mFilterPresets .eFilterPresetClear {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 24px;
  margin-left: 2px;
  padding: 0;
  border: 1px solid #d0d8e3;
  border-radius: 4px;
  background: #fff;
  color: #8a93a3;
  cursor: pointer;
  font-size: 14px;
  line-height: 1;
  transition: background-color 120ms, color 120ms, border-color 120ms;
}
.mFilterPresets .eFilterPresetClear:hover {
  color: #a93434;
  background: #fdecec;
  border-color: #a93434;
}

/* 배지 — 프리셋 개수 */
.mFilterPresets .eFilterPresetBadge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 12px;
  height: 12px;
  padding: 0 3px;
  border-radius: 6px;
  background: #1f4d8a;
  color: #fff;
  font-size: 8px;
  font-weight: 700;
  line-height: 1;
}

/* popover */
.eFilterPresetPopover {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 50;
  min-width: 280px;
  padding: 12px;
  background: #fff;
  border: 1px solid #c8d0dc;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(20, 30, 50, 0.16);
  font-size: 12px;
  color: #1d2c4a;
}

.eFilterPresetPopover .eFilterPresetTitle {
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 700;
  color: #1d2c4a;
}

.eFilterPresetPopover .eFilterPresetRow {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 6px;
  flex-wrap: wrap;
}
.eFilterPresetPopover .eFilterPresetRow:last-of-type { margin-bottom: 0; }

.eFilterPresetPopover .eFilterPresetSel {
  flex: 1;
  min-width: 160px;
  padding: 3px 8px;
  font-size: 12px;
}

.eFilterPresetPopover .btnNormal {
  height: 26px;
  line-height: 1;
  font-size: 11px;
  padding: 0 10px;
  display: inline-flex;
  align-items: center;
}

.eFilterPresetPopover .eFilterPresetActions {
  border-top: 1px dashed #e2e6ec;
  padding-top: 8px;
  margin-top: 6px;
}

.eFilterPresetPopover .eFilterPresetFlash {
  margin: 8px 0 0;
  font-size: 11px;
}
.eFilterPresetPopover .eFilterPresetFlash[data-type="ok"]  { color: #1c6b3f; }
.eFilterPresetPopover .eFilterPresetFlash[data-type="err"] { color: #a93434; }

/* mPath(브레드크럼) 우측 끝 정렬 — 토글이 title 옆에 와도 가운데 공간 차지 안 하게 */
.titleArea .mPath { margin-left: auto !important; }