/* ==========================================================================
   Ajax Search Pro — Ultra Modern Dark
   Scoped overrides for the ASP plugin within .ak-community-search.
   Source: ultra modern dark design guide.md, sections 3, 6, 10, 11
   ========================================================================== */

/* ---------- Wrapper panel ---------- */

.ak-community-search {
  max-width: 680px;
  margin: 0 auto 32px;
  padding: 24px 28px;
  background: var(--surface);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-soft);
}

/* ---------- Container reset ---------- */

.ak-community-search .asp_w_container {
  width: 100% !important;
}

/* ---------- Main search box ---------- */

.ak-community-search div.asp_w.ajaxsearchpro {
  background: transparent !important;
  border-radius: var(--radius-pill) !important;
  overflow: visible !important;
}

/* ---------- Probox row ---------- */

.ak-community-search div.asp_m.ajaxsearchpro .probox {
  background: var(--input-bg) !important;
  border: 1px solid var(--input-border) !important;
  border-radius: var(--radius-pill) !important;
  box-shadow: none !important;
  overflow: hidden;
  transition: var(--transition);
}

.ak-community-search div.asp_m.ajaxsearchpro .probox:focus-within {
  border-color: var(--input-focus-border) !important;
  box-shadow: var(--input-focus-shadow) !important;
}

/* ---------- Input field ---------- */

.ak-community-search div.asp_m.ajaxsearchpro .probox .proinput {
  margin: 0 0 0 6px !important;
}

.ak-community-search div.asp_m.ajaxsearchpro .probox .proinput input.orig {
  color: var(--text-primary) !important;
  font-family: var(--font-body) !important;
  font-size: var(--text-body) !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 12px !important;
  caret-color: var(--text-primary);
}

.ak-community-search div.asp_m.ajaxsearchpro .probox .proinput input.orig::placeholder {
  color: var(--input-placeholder) !important;
  opacity: 1;
}

.ak-community-search div.asp_m.ajaxsearchpro .probox .proinput input.autocomplete {
  color: var(--text-dim) !important;
}

/* ---------- Magnifier / search button ---------- */

.ak-community-search div.asp_m.ajaxsearchpro .probox button.promagnifier {
  background: var(--surface-elevated) !important;
  border-radius: 0 var(--radius-pill) var(--radius-pill) 0 !important;
  cursor: pointer;
  transition: var(--transition);
  min-width: 48px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
}

.ak-community-search div.asp_m.ajaxsearchpro .probox button.promagnifier:hover {
  background: var(--accent-red) !important;
}

.ak-community-search div.asp_m.ajaxsearchpro .probox button.promagnifier .innericon svg {
  fill: var(--silver-mid);
  transition: fill 0.25s ease;
}

.ak-community-search div.asp_m.ajaxsearchpro .probox button.promagnifier:hover .innericon svg {
  fill: #fff;
}

.ak-community-search div.asp_m.ajaxsearchpro .probox button.promagnifier:focus-visible {
  box-shadow: inset 0 0 0 2px var(--accent-red) !important;
}

/* ---------- Settings cog ---------- */

.ak-community-search div.asp_m.ajaxsearchpro .probox .prosettings {
  transition: var(--transition);
}

.ak-community-search div.asp_m.ajaxsearchpro .probox .prosettings .innericon svg {
  fill: var(--text-muted);
  transition: fill 0.25s ease;
}

.ak-community-search div.asp_m.ajaxsearchpro .probox .prosettings:hover .innericon svg {
  fill: var(--text-primary);
}

/* ---------- Close button ---------- */

.ak-community-search div.asp_m.ajaxsearchpro .probox .proclose svg {
  background: var(--surface-elevated) !important;
  fill: var(--silver-mid) !important;
  border-radius: 50% !important;
  box-shadow: none !important;
  transition: fill 0.25s ease, background 0.25s ease;
}

.ak-community-search div.asp_m.ajaxsearchpro .probox .proclose:hover svg {
  fill: #fff !important;
  background: var(--accent-red) !important;
}

/* ---------- Loading spinner ---------- */

.ak-community-search div.asp_m.ajaxsearchpro .probox .proloading .asp_loader div {
  background-color: var(--silver-mid) !important;
}

/* ---------- Results panel ---------- */

.ak-community-search div.asp_w.asp_r {
  background: var(--surface) !important;
  border: 1px solid var(--border-subtle) !important;
  border-radius: var(--radius-md) !important;
  box-shadow: var(--shadow-elevated) !important;
  padding: 8px !important;
  margin-top: 8px;
}

.ak-community-search div.asp_w.asp_r.vertical {
  background: var(--surface) !important;
  border: 1px solid var(--border-subtle) !important;
  border-radius: var(--radius-md) !important;
  box-shadow: var(--shadow-elevated) !important;
  padding: 8px !important;
}

/* ---------- Results top info bar ---------- */

.ak-community-search div.asp_w.asp_r .asp_results_top {
  color: var(--text-muted) !important;
  font-family: var(--font-body);
  font-size: var(--text-small);
  padding: 8px 12px !important;
  border-bottom: 1px solid var(--border-subtle);
  margin-bottom: 4px;
}

/* ---------- Individual result items ---------- */

.ak-community-search div.asp_w.asp_r .results .item {
  background: var(--surface-elevated) !important;
  border: 1px solid var(--border-subtle) !important;
  border-radius: var(--radius-sm) !important;
  padding: 10px !important;
  margin-bottom: 6px !important;
  transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.ak-community-search div.asp_w.asp_r .results .item:last-child {
  margin-bottom: 0 !important;
}

.ak-community-search div.asp_w.asp_r .results .item:hover {
  transform: translateY(-2px);
  border-color: var(--border-strong) !important;
  box-shadow: var(--shadow-soft) !important;
}

/* ---------- Result image ---------- */

.ak-community-search div.asp_w.asp_r .results .item .asp_image {
  border-radius: 8px !important;
  overflow: hidden !important;
}

.ak-community-search div.asp_w.asp_r .results .item .asp_image img {
  object-fit: cover;
}

/* ---------- Result title ---------- */

.ak-community-search div.asp_w.asp_r .results .item .asp_content h3 {
  font-family: var(--font-body) !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
}

.ak-community-search div.asp_w.asp_r .results .item .asp_content h3 a,
.ak-community-search div.asp_w.asp_r .results .item .asp_content h3 a.asp_res_url {
  color: var(--text-primary) !important;
  text-decoration: none !important;
  transition: color 0.25s ease;
}

.ak-community-search div.asp_w.asp_r .results .item .asp_content h3 a:hover {
  color: var(--accent-red) !important;
}

/* ---------- Result description ---------- */

.ak-community-search div.asp_w.asp_r .results .item .asp_res_text {
  color: var(--text-secondary) !important;
  font-family: var(--font-body) !important;
  font-size: var(--text-small) !important;
  line-height: 1.55 !important;
}

/* ---------- Result meta (author, date) ---------- */

.ak-community-search div.asp_w.asp_r .results .item .etc {
  color: var(--text-dim) !important;
  font-size: 12px !important;
}

.ak-community-search div.asp_w.asp_r .results .item .etc span {
  color: var(--text-dim) !important;
}

/* ---------- No results message ---------- */

.ak-community-search div.asp_w.asp_r .asp_nores,
.ak-community-search div.asp_w.asp_r .asp_nores * {
  color: var(--text-muted) !important;
  font-family: var(--font-body) !important;
}

/* ---------- Show more link ---------- */

.ak-community-search div.asp_w.asp_r .asp_showmore_container {
  padding: 10px 0 4px !important;
  text-align: center;
}

.ak-community-search div.asp_w.asp_r p.showmore a.asp_showmore {
  color: var(--text-muted) !important;
  font-family: var(--font-body) !important;
  font-size: var(--text-small) !important;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-decoration: none !important;
  border-bottom: 1px solid var(--accent-champagne) !important;
  padding-bottom: 2px;
  transition: color 0.25s ease, border-color 0.25s ease;
}

.ak-community-search div.asp_w.asp_r p.showmore a.asp_showmore:hover {
  color: var(--accent-red) !important;
  border-bottom-color: var(--accent-red) !important;
}

/* ---------- More-results loader ---------- */

.ak-community-search div.asp_w.asp_r div.asp_moreres_loader {
  background: rgba(9, 9, 9, 0.4) !important;
}

.ak-community-search div.asp_w.asp_r div.asp_moreres_loader-inner {
  border-color: var(--silver-mid) !important;
  border-right-color: transparent !important;
}

/* ---------- Results scrollbar ---------- */

.ak-community-search div.asp_w.asp_r .asp_simplebar-scrollbar::before {
  background: var(--text-dim) !important;
  border-radius: 4px !important;
}

/* ---------- Settings panel (if shown) ---------- */

.ak-community-search div.asp_w.asp_s,
.ak-community-search div.asp_w.asp_sb {
  background: var(--surface) !important;
  border: 1px solid var(--border-subtle) !important;
  border-radius: var(--radius-md) !important;
  box-shadow: var(--shadow-soft) !important;
  margin-top: 8px;
}

.ak-community-search div.asp_w.asp_s *,
.ak-community-search div.asp_w.asp_sb * {
  color: var(--text-secondary);
  font-family: var(--font-body);
}

.ak-community-search div.asp_w.asp_s label,
.ak-community-search div.asp_w.asp_sb label {
  color: var(--text-muted) !important;
  font-size: 12px !important;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

/* ---------- Responsive ---------- */

@media (max-width: 767px) {
  .ak-community-search {
    padding: 18px 16px;
    border-radius: var(--radius-sm);
  }

  .ak-community-search div.asp_w.asp_r {
    border-radius: var(--radius-sm) !important;
  }

  .ak-community-search div.asp_w.asp_r .results .item {
    border-radius: 8px !important;
  }
}

@media (max-width: 480px) {
  .ak-community-search {
    padding: 14px 12px;
    margin-left: -4px;
    margin-right: -4px;
  }
}