/* jj-price-manager: Search — Structural CSS */

.jjpm-search { position: relative; margin-bottom: 1.5em; }

.jjpm-search__input-wrap {
  display: flex; align-items: center;
  border: 1px solid var(--jjpm-border, #e0e0e0);
  border-radius: 999px;
  padding: 0.5em 1.25em;
  gap: 0.5em;
  transition: border-color 0.2s;
  margin:var(--space-xl);
}
.jjpm-search__input-wrap:focus-within { border-color: var(--jjpm-primary, currentColor); }

.jjpm-search__icon { color: var(--jjpm-text-light, #999); font-size: 20px; flex-shrink: 0; }

.jjpm-search__input {
  flex: 1; border: none; outline: none;
  font-size: 1em; font-family: inherit;
  color: var(--jjpm-text, #333);
  background: transparent;
  padding: 0.25em 0;
}
.jjpm-search__input::placeholder { color: var(--jjpm-text-light, #999); }

.jjpm-search__clear {
  display: flex; align-items: center; justify-content: center;
  width: 24px; height: 24px;
  border: none; background: var(--jjpm-bg-alt, #f5f5f5);
  border-radius: 50%; cursor: pointer;
  color: var(--jjpm-text-light, #999);
  flex-shrink: 0; padding: 0;
}
.jjpm-search__clear .material-icons { font-size: 16px; }
.jjpm-search__clear:hover { background: var(--jjpm-border, #e0e0e0); }

.jjpm-search__results {
  display: none; position: absolute;
  top: 100%; left: 0; right: 0; z-index: 100;
  background: var(--jjpm-bg, #fff);
  border: 1px solid var(--jjpm-border, #e0e0e0);
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  max-height: 300px; overflow-y: auto;
  list-style: none; margin: 0.25em 0 0; padding: 0.25em 0;
}

.jjpm-search__result-item {
  border-bottom: 1px solid var(--jjpm-border, #f0f0f0);
}
.jjpm-search__result-item:last-child { border-bottom: none; }

.jjpm-search__result-link {
  display: flex; align-items: center; gap: 0.5em;
  padding: 0.75em 1.25em;
  cursor: pointer;
  transition: background 0.15s;
  text-decoration: none !important; color: inherit !important;
}
@media screen and (max-width:780px) {
  .jjpm-search__result-link{
    flex-wrap:wrap;
  }
}
.jjpm-search__result-item { cursor: pointer; }
.jjpm-search__result-link:hover { background: var(--jjpm-bg-alt, #f5f5f5); }

.jjpm-search__result-cat {
  font-size: 0.75em;
  color: var(--jjpm-primary, #333);
  background: var(--jjpm-primary-light, #f0f0f0);
  padding: 0.15em 0.5em;
  border-radius: 4px;
  flex-shrink: 0; white-space: nowrap;
}

.jjpm-search__result-tab {
  font-size: 0.6875em;
  color: var(--jjpm-bg, #fff);
  background: var(--jjpm-primary, #333);
  padding: 0.15em 0.5em;
  border-radius: 4px;
  flex-shrink: 0; white-space: nowrap;
  font-weight: 700;
}

.jjpm-search__result-text { font-size: 0.875em; color: var(--jjpm-text, #333); }
.jjpm-search__empty { padding: 1.25em; text-align: center; color: var(--jjpm-text-light, #999); font-size: 0.875em; }

/* カテゴリアコーディオン（フォーカス時） */
.jjpm-search__cat-group { list-style: none; }
.jjpm-search__cat-toggle {
  display: flex; align-items: center; justify-content: space-between;
  width: 100%; padding: 0.5em 1.25em; border: none; background: none;
  font-size: 0.875em; font-weight: 700; font-family: inherit;
  color: var(--jjpm-primary, #333); cursor: pointer;
  border-bottom: 1px solid var(--jjpm-border, #f0f0f0);
  transition: background 0.15s;
}
.jjpm-search__cat-toggle:hover { background: var(--jjpm-bg-alt, #f5f5f5); }
.jjpm-search__cat-toggle .material-icons { transition: transform 0.2s; }
.jjpm-search__cat-toggle.is-open .material-icons { transform: rotate(180deg); }
.jjpm-search__cat-items { list-style: none; margin: 0; padding: 0; }
.jjpm-search__cat-items .jjpm-search__result-link { padding-left: 2em; font-size: 0.8125em; }