/* =====================================================================
   Dark skin for the PLATFORM search screen, shared by every dark v2 theme
   (enduser/mxc_search: type tabs sub_tabs_inc.php, main.php results,
   search_form.php). Moved out of worldsedge/css/feed.css so no theme keeps a
   copy. A theme loads this file and maps the --ds-* colours to its own tokens
   (see the --ds-* block in worldsedge/css/feed.css or delano_massey/css/feed.css).
   ===================================================================== */

/* ---------- 2. Platform type tabs (enduser/mxc_search/sub_tabs_inc.php)  ---------- */
:root .mxc-subtabs {
  display: flex;
  flex-wrap: wrap; /* all tabs visible: wrap, never a hidden sideways scroller */
  gap: 4px;
  padding: 5px;
  width: fit-content;
  max-width: 100%;
  overflow: visible;
  scrollbar-width: none;
  border-radius: 26px; /* a pill on one row, rounded corners once it wraps */
  background: rgba(0, 0, 0, .4);
  border: 1px solid var(--ds-stroke);
}
:root .mxc-subtabs::-webkit-scrollbar { display: none; }
:root .mxc-subtabs a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 16px;
  border: 0;
  border-radius: 999px;
  background: transparent !important;
  color: var(--ds-muted) !important;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  text-decoration: none;
  transition: color .2s, background .2s;
}
:root .mxc-subtabs a:hover { color: #fff !important; }
:root .mxc-subtabs a.active { background: var(--ds-grad) !important; color: #fff !important; }
/* The RSS tab keeps its colour on hover and gets no fill (design .seg .rss-tab). */
:root .mxc-subtabs .mxc-subtabs__rss,
:root .mxc-subtabs .mxc-subtabs__rss:hover,
:root .mxc-subtabs .mxc-subtabs__rss i,
:root .mxc-subtabs .mxc-subtabs__rss span { color: var(--ds-rss) !important; background: transparent !important; }

/* ---------- 7. Search results screen (Mxc_search -> enduser/mxc_search/main.php) ---------- */
:root .mxc-search-wrap { background: transparent; color: var(--ds-text); padding: 40px 0 64px; }

/* Result-type tabs */
:root .mxc-tabs { border-bottom: 1px solid var(--ds-stroke); }
:root .mxc-tabs a { color: var(--ds-muted); font-size: 14px; }
:root .mxc-tabs a:hover { color: #fff; }
:root .mxc-tabs a.active { color: #fff; border-bottom-color: var(--ds-accent); }
:root .mxc-tabs a .badge { background: var(--ds-panel-2); color: var(--ds-muted); font-size: 14px; border: 1px solid var(--ds-stroke); }
:root .mxc-tabs a.active .badge { background: var(--ds-grad); color: #fff; border-color: transparent; }
:root .mxc-tabs-scroll::-webkit-scrollbar-track { background: transparent; }
:root .mxc-tabs-scroll::-webkit-scrollbar-thumb { background: var(--ds-stroke-hi); }

/* Shared search form (enduser/mxc_search/search_form.php) */
:root .mxc-search-form .form-inline {
  background: rgba(0, 0, 0, .4);
  border: 1px solid var(--ds-stroke);
  border-radius: 28px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
  padding: 6px 8px;
}
:root .mxc-search-form .form-inline:focus-within { border-color: var(--ds-focus); }
:root .mxc-search-input-wrap,
:root .mxc-search-select-wrap { border-right-color: var(--ds-stroke); }
:root .mxc-search-input-wrap .form-control,
:root .mxc-search-select-wrap .form-control { color: var(--ds-text) !important; }
:root .mxc-search-input-wrap .form-control::placeholder { color: var(--ds-muted); opacity: 1; }
:root .mxc-search-select-wrap .form-control option { background: var(--ds-popover); color: var(--ds-text); }
:root .mxc-search-icon-grid,
:root .mxc-search-loc-icon { stroke: var(--ds-muted); }
:root .mxc-search-form .btn-search {
  background: var(--ds-grad);
  border-radius: 999px;
  padding: 10px 22px;
  font-size: 15px;
  box-shadow: 0 10px 30px var(--ds-glow);
}
:root .mxc-search-form .btn-search:hover { background: var(--ds-grad); color: #fff; filter: brightness(1.08); }
:root .mxc-search-form .btn-reset {
  background: var(--ds-panel-2);
  color: var(--ds-text);
  border: 1px solid var(--ds-stroke);
  border-radius: 999px;
  font-size: 15px;
}
:root .mxc-search-form .btn-reset:hover { background: var(--ds-panel-3); color: #fff; }
:root .mxc-autocomplete-list {
  background: var(--ds-popover);
  border: 1px solid var(--ds-stroke);
  border-radius: 18px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .6);
  padding: 6px;
}
:root .mxc-autocomplete-item { color: var(--ds-text); font-size: 14px; border-radius: 12px; }
:root .mxc-autocomplete-item:hover,
:root .mxc-autocomplete-item.is-active { background: var(--ds-panel-2); }
:root .mxc-autocomplete-item .mxc-ac-icon { color: var(--ds-muted); }
:root .mxc-autocomplete-item .mxc-ac-label mark { background: color-mix(in srgb, var(--ds-magenta) 30%, transparent); color: #fff; }
:root .mxc-autocomplete-item .mxc-ac-sub { color: var(--ds-muted); font-size: 14px; }
:root .mxc-autocomplete-item .mxc-ac-badge { font-size: 14px; text-transform: none; letter-spacing: 0; background: var(--ds-tag-bg); border: 1px solid var(--ds-tag-line); color: var(--ds-tag-text); border-radius: 999px; }
:root .mxc-autocomplete-item :is(.mxc-ac-badge-recent, .mxc-ac-badge-hint) { background: var(--ds-panel-2); border-color: var(--ds-stroke); color: var(--ds-muted); }
:root .mxc-autocomplete-item.is-loading { color: var(--ds-muted); }
:root .mxc-autocomplete-item.is-loading:hover { background: transparent; }
:root .mxc-ac-spinner { border-color: var(--ds-stroke); border-top-color: var(--ds-accent); }
:root .mxc-autocomplete-item .mxc-ac-remove { color: var(--ds-muted); }
:root .mxc-autocomplete-item .mxc-ac-remove:hover { background: var(--ds-panel-3); color: #fff; }

/* Multi-section results layout (enduser/mxc_search/live_feed.php) */
:root .mxc-lf-column-right { background: transparent; border-left-color: var(--ds-stroke); }
:root .mxc-lf-section-title { color: var(--ds-text); font-family: var(--ds-display); font-size: 15px; }
:root .mxc-lf-section-title::after { background: var(--ds-stroke); }

/* Post-loop cards in results: the list wrapper paints them white */
:root .mxc-livefeed-list .list_style_posts { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; }
:root .mxc-livefeed-list .list_style_posts .card { background: var(--ds-card-bg) !important; }

/* Result cards: spotlight, profile, newsroom (enduser/mxc_search/partials/*) = the design's glow card.
   A theme sets --ds-card-surface / --ds-card-inset / --ds-card-line / --ds-card-hover-shadow to its own glow card. */
:root :is(.mxc-spotlight-card, .mxc-profile-card, .mxc-newsroom-card) {
  background: var(--ds-card-surface, linear-gradient(160deg, rgba(220, 224, 230, .10), rgba(255, 255, 255, .02) 60%));
  border: 1px solid var(--ds-stroke);
  border-radius: 24px;
  box-shadow: var(--ds-card-inset, inset 0 1px 0 rgba(255, 255, 255, .12));
  color: var(--ds-text);
  overflow: hidden;
}
:root :is(.mxc-spotlight-card, .mxc-profile-card, .mxc-newsroom-card):hover {
  transform: translateY(-4px);
  border-color: var(--ds-card-line, var(--ds-stroke-hi));
  box-shadow: var(--ds-card-hover-shadow, 0 30px 60px rgba(0, 0, 0, .45), 0 0 60px rgba(200, 205, 214, .12));
}
:root .mxc-spotlight-card .card-header { background: transparent; border-bottom: 1px solid var(--ds-stroke); }
:root .mxc-spotlight-card .card-author-name { color: var(--ds-text); font-size: 14px; font-weight: 600; }
:root .mxc-spotlight-card .card-time { color: var(--ds-muted); font-size: 14px; }
:root .mxc-spotlight-card .card-type-badge,
:root .mxc-spotlight-card .card-category {
  background: var(--ds-tag-bg);
  border: 1px solid var(--ds-tag-line);
  color: var(--ds-tag-text);
  border-radius: 999px;
  font-size: 14px;
  font-weight: 600;
  padding: 3px 10px;
}
:root .mxc-spotlight-card .card-body { background: transparent; }
:root .mxc-spotlight-card .card-title { color: #fff; font-family: var(--ds-display); font-size: 17px; font-weight: 700; line-height: 1.3; }
:root .mxc-spotlight-card .card-title a:hover { color: var(--ds-tag-text); }
:root .mxc-spotlight-card .card-excerpt { color: var(--ds-muted); font-size: 14px; }
:root .mxc-spotlight-card .card-footer { background: transparent; border-top: 1px solid var(--ds-stroke); }
:root .mxc-spotlight-card .card-footer a { color: var(--ds-soft); font-size: 14px; }
:root .mxc-spotlight-card .card-footer a:hover { color: #fff; }
:root .mxc-profile-card .profile-photo { border: 1px solid var(--ds-stroke); background: var(--ds-panel-2); }
:root .mxc-profile-card .profile-name { color: #fff; font-family: var(--ds-display); font-size: 16px; }
:root .mxc-profile-card .profile-title { color: var(--ds-soft); font-size: 14px; }
:root .mxc-profile-card .profile-location { color: var(--ds-muted); font-size: 14px; }
:root .mxc-profile-card .profile-plan { background: var(--ds-tag-bg); border: 1px solid var(--ds-tag-line); color: var(--ds-tag-text); font-size: 14px; border-radius: 999px; }
:root .mxc-profile-card .btn-view-profile { color: #fff; border: 1px solid var(--ds-stroke); background: var(--ds-panel-2); border-radius: 999px; font-size: 14px; font-weight: 600; }
:root .mxc-profile-card .btn-view-profile:hover { background: var(--ds-grad); border-color: transparent; color: #fff; }
:root .mxc-newsroom-card .newsroom-body { background: transparent; }
:root .mxc-newsroom-card .newsroom-name { color: #fff; font-family: var(--ds-display); font-size: 16px; }
:root .mxc-newsroom-card .newsroom-name:hover { color: var(--ds-tag-text); }

/* Load more and empty / 404 states */
:root .mxc-load-more-wrap .btn-load-more {
  background: var(--ds-panel);
  border: 1px solid var(--ds-stroke);
  color: var(--ds-text);
  border-radius: 999px;
  font-size: 15px;
  letter-spacing: .02em;
  padding: .75rem 1.6rem;
}
:root .mxc-load-more-wrap .btn-load-more:hover { background: var(--ds-panel-2); border-color: var(--ds-stroke-hi); color: #fff !important; opacity: 1; }
:root .mxc-empty-state-inner,
:root .mxc-empty-state-label { color: var(--ds-soft); }
:root .mxc-empty-state-message { color: var(--ds-soft); }
:root .mxc-empty-state-message strong { color: #fff; }
:root .mxc-empty-state-list li { color: var(--ds-muted); }
:root .mxc-404-state {
  background: linear-gradient(160deg, rgba(210, 214, 222, .10), rgba(255, 255, 255, .02) 50%, rgba(0, 0, 0, .4));
  border: 1px solid var(--ds-stroke);
  border-radius: 28px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12);
}
:root .mxc-404-kicker { color: var(--ds-tag-text); font-size: 14px; }
:root .mxc-404-state h1 { color: #fff; font-family: var(--ds-display); }
:root .mxc-404-state p { color: var(--ds-soft); }
:root .mxc-404-actions a { border-radius: 999px; }
:root .mxc-404-actions .mxc-404-primary { background: var(--ds-grad); color: #fff; }
:root .mxc-404-actions .mxc-404-secondary { background: var(--ds-panel-2); border-color: var(--ds-stroke); color: var(--ds-text); }