/* Reusable search controls, adapted from DNX.Main's Button variants.
   Explicit component classes keep legacy Bootstrap aliases from defining their size. */
.market-search-page {
    --market-control-height: 36px;
    --market-control-radius: 6px;
    --market-control-font: 500 14px/20px var(--dnx-font);
    --market-label-font: 500 12px/18px var(--dnx-font);
    --market-hover: color-mix(in oklch, var(--search-accent) 8%, var(--search-surface));
    --market-focus: 0 0 0 3px color-mix(in oklch, var(--search-accent) 22%, transparent);
    font: 400 14px/1.5 var(--dnx-font);
}
#main-content.market-search-page .market-button {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    height: var(--market-control-height); min-height: var(--market-control-height);
    padding: 7px 12px; margin: 0; border: 1px solid var(--search-border);
    border-radius: var(--market-control-radius); background: var(--search-surface);
    color: var(--search-text); font: var(--market-control-font); letter-spacing: normal;
    text-transform: none; text-decoration: none; white-space: nowrap; cursor: pointer;
    box-shadow: 0 1px 2px rgb(0 0 0 / .04); transform: none !important;
    transition: background-color 150ms ease, border-color 150ms ease, box-shadow 150ms ease;
}
#main-content.market-search-page .market-button--primary { background: var(--search-accent); color: var(--search-on-accent); border-color: var(--search-accent); }
#main-content.market-search-page .market-button--secondary { color: var(--search-accent); }
#main-content.market-search-page .market-button--quiet { background: transparent; color: var(--search-muted); border-color: transparent; box-shadow: none; }
#main-content.market-search-page .market-button--icon { width: var(--market-control-height); padding: 0; flex-shrink: 0; }
#main-content.market-search-page .market-button:hover { background: var(--market-hover); color: var(--search-accent); border-color: var(--search-accent); filter: none; }
#main-content.market-search-page .market-button--primary:hover { background: color-mix(in oklch, var(--search-accent) 90%, var(--search-text)); color: var(--search-on-accent); }
#main-content.market-search-page .market-button:active { box-shadow: none; }
#main-content.market-search-page .market-button:focus-visible { outline: 2px solid var(--search-accent); outline-offset: 2px; box-shadow: var(--market-focus); }
#main-content.market-search-page .market-button:is(:disabled, [aria-disabled='true']) { opacity: .45; pointer-events: none; box-shadow: none; }
#main-content.market-search-page .market-button :is(.accept, .accept2, span) { font-size: inherit; font-weight: inherit; line-height: inherit; color: inherit !important; }
#main-content.market-search-page .market-button i { font-size: 14px; color: inherit !important; }
#main-content.market-search-page .market-button .fa-chevron-right { font-size: 11px; }
#main-content.market-search-page .market-control {
    height: var(--market-control-height); min-height: var(--market-control-height);
    padding: 7px 10px; border: 1px solid var(--search-border); border-radius: var(--market-control-radius);
    background-color: var(--search-surface); color: var(--search-text); font: var(--market-control-font);
    box-shadow: none; max-width: 100%;
}
#main-content.market-search-page select.market-control { padding-right: 28px; }
#main-content.market-search-page textarea.market-control { height: auto; min-height: 100px; }
#main-content.market-search-page .market-control:focus { outline: 2px solid var(--search-accent); outline-offset: 1px; border-color: var(--search-accent); box-shadow: var(--market-focus); }
#main-content.market-search-page :is(.toolbar-label, .filter-area label, .market-domain-label) { font: var(--market-label-font) !important; color: var(--search-muted); }
#main-content.market-search-page .toolbar-section-label { font: 600 13px/20px var(--dnx-font); color: var(--search-text); }
#main-content.market-search-page .view-selector { display: inline-flex; padding: 3px; gap: 2px; border: 1px solid var(--search-border); background: var(--search-soft); border-radius: 8px; }
#main-content.market-search-page .view-selector .market-button { height: 28px; min-height: 28px; padding: 3px 10px; font-size: 13px; }
#main-content.market-search-page .view-selector .active { color: var(--search-text); border-color: var(--search-border); background: var(--search-surface); box-shadow: 0 1px 2px rgb(0 0 0 / .05); }
#main-content.market-search-page .view-selector-row { gap: 12px !important; margin-bottom: 16px !important; }
#main-content.market-search-page :is(.filter-tag, .badge) { display: inline-flex; align-items: center; gap: 6px; padding: 4px 8px; border: 1px solid var(--search-border); border-radius: 5px; background: var(--search-soft); color: var(--search-muted); font: 400 12px/18px var(--dnx-font); }
#main-content.market-search-page :is(.filter-tag-remove, .badge a) { color: var(--search-muted); }
#main-content.market-search-page .paging { font: 400 13px/20px var(--dnx-font); font-variant-numeric: tabular-nums; }
#main-content.market-search-page span.btn-secondary-full-text { font: var(--market-control-font); padding: 7px 12px; color: var(--search-muted); text-transform: none; }
#main-content.market-search-page .prosearch-toolbar { gap: 20px 24px; padding: 20px; }
#main-content.market-search-page .toolbar-section-items { gap: 12px; }
#main-content.market-search-page .toolbar-item { gap: 6px; }
#main-content.market-search-page .dropdown-menu { padding: 6px; border-radius: 8px; }
#main-content.market-search-page .dropdown-item { min-height: 32px; padding: 6px 10px; border-radius: 4px; font: 400 13px/20px var(--dnx-font); }
@media (max-width: 767px) {
    .market-search-page { --market-control-height: 40px; }
    #main-content.market-search-page .view-selector .market-button { height: 32px; min-height: 32px; }
    #main-content.market-search-page .prosearch-toolbar { padding: 16px; }
}
@media (prefers-reduced-motion: reduce) { #main-content.market-search-page .market-button { transition: none; } }

#main-content.market-search-page .market-button--compact { height: 32px; min-height: 32px; padding: 5px 10px; font-size: 13px; }
@media (max-width: 767px) { #main-content.market-search-page .market-button--compact { height: 36px; min-height: 36px; } }

#main-content.market-search-page #toolbarMatchType { min-width: 112px; max-width: none !important; }
#main-content.market-search-page .filter-tag-remove, #main-content.market-search-page .filter-tag-remove i { color: var(--search-muted) !important; }
/* Empty responsive rows must not contribute extra flex gaps around the page heading. */
#main-content.market-search-page .results-page-container { display: block; background: transparent; }

#main-content.market-search-page .filter-tag a, #main-content.market-search-page .filter-tag a i { color: var(--search-muted) !important; }

/* The main domain lookup is larger than the compact search filters. */
#main-content.market-domain .frame-56 { --market-control-height: 56px; }
#main-content.market-domain #domainInput { padding: 12px 16px; font-size: 18px; line-height: 26px; }
#main-content.market-domain .market-domain-label { font: 500 14px/20px var(--dnx-font) !important; }
#main-content.market-domain .search-icon i { font-size: 20px; }
@media (max-width: 767px) {
    #main-content.market-domain .frame-56 { --market-control-height: 52px; }
    #main-content.market-domain #domainInput { font-size: 17px; }
}

/* Shared typography for Advanced and Pro Search filters, including dropdown contents. */
#main-content:is(.market-explore, .market-pro) :is(#filterForm, #toolbarFilters) {
    font: 400 14px/20px var(--dnx-font);
    color: var(--search-text);
}
#main-content:is(.market-explore, .market-pro) :is(#filterForm, #toolbarFilters) .market-filter-label {
    display: block;
    height: auto;
    min-height: 0;
    margin: 0 0 8px;
    padding: 0;
    font: 600 12px/18px var(--dnx-font) !important;
    color: var(--search-muted) !important;
    letter-spacing: normal;
    text-transform: none;
}
#main-content:is(.market-explore, .market-pro) :is(#filterForm, #toolbarFilters) :is(.market-control, .market-button, .form-check-label, .dropdown-item, .saved-search-link, .saved-search-name) {
    font: 400 14px/20px var(--dnx-font) !important;
    letter-spacing: normal;
    text-transform: none;
}
#main-content:is(.market-explore, .market-pro) :is(#filterForm, #toolbarFilters) :is(.form-check-label, .dropdown-item, .saved-search-link, .saved-search-name, .market-button--secondary) {
    color: var(--search-text) !important;
}
#main-content:is(.market-explore, .market-pro) :is(#filterForm, #toolbarFilters) .form-check-label {
    display: inline-block;
    height: auto;
    margin-bottom: 0;
}
#main-content:is(.market-explore, .market-pro) :is(#filterForm, #toolbarFilters) .form-check {
    min-height: 28px;
    margin-bottom: 0;
}
#main-content:is(.market-explore, .market-pro) :is(#filterForm, #toolbarFilters) :is(.accept, .exclude-accept, .categories-accept, .tld-accept, .btn-secondary-full-text, .btn-primary-full-text) {
    font: inherit !important;
    color: inherit !important;
    letter-spacing: normal;
}
#main-content:is(.market-explore, .market-pro) :is(#filterForm, #toolbarFilters) .dropdown-header {
    font: 600 12px/18px var(--dnx-font) !important;
    color: var(--search-muted) !important;
    letter-spacing: normal;
    text-transform: none;
}
#main-content:is(.market-explore, .market-pro) :is(#filterForm, #toolbarFilters) .fa-icon-secondary {
    color: var(--search-muted) !important;
}
#main-content:is(.market-explore, .market-pro) :is(#filterForm, #toolbarFilters) small {
    display: block;
    font: 400 12px/18px var(--dnx-font);
    color: var(--search-muted);
}
#main-content:is(.market-explore, .market-pro) :is(#filterForm, #toolbarFilters) .market-control::placeholder {
    color: var(--search-muted);
    font: inherit;
    opacity: 1;
}
#main-content:is(.market-explore, .market-pro) :is(#filterForm, #toolbarFilters) .market-filter-keywords { width: 100%; }

#main-content.market-pro #toolbarFilters .toolbar-label {
    font: 600 12px/18px var(--dnx-font) !important;
    color: var(--search-muted) !important;
    letter-spacing: normal;
    text-transform: none;
}
#main-content.market-pro #toolbarFilters .toolbar-section-label {
    font: 600 13px/20px var(--dnx-font);
    color: var(--search-text);
    letter-spacing: normal;
    text-transform: none;
}
#main-content.market-pro #toolbarFilters .market-button :is(span, .selected-text) {
    font: inherit !important;
    color: inherit !important;
}
/* Table column filters are part of the same Pro Search filter interface. */
#main-content.market-pro .col-header-menu :is(.col-filter-input, .col-filter-select, .col-sort-option, label) {
    font: 400 14px/20px var(--dnx-font);
    color: var(--search-text);
    letter-spacing: normal;
    text-transform: none;
}
#main-content.market-pro .col-header-menu :is(.col-filter-input, .col-filter-select)::placeholder {
    font: inherit;
    color: var(--search-muted);
    opacity: 1;
}

#main-content .market-control-label { display: flex; align-items: center; gap: 6px; min-height: 20px; }
#main-content .market-control-label label { margin: 0; }
#main-content button.market-control-help {
    display: inline-grid; place-items: center; flex: 0 0 20px;
    width: 20px; height: 20px; min-height: 20px; padding: 0;
    border: 1px solid var(--search-border); border-radius: 50%;
    background: var(--search-soft); color: var(--search-muted);
    font: 600 12px/1 var(--dnx-font); cursor: help;
}
#main-content button.market-control-help:focus-visible { outline: 2px solid var(--search-accent); outline-offset: 2px; }
#main-content .market-control-tooltip {
    position: fixed; z-index: 1100; display: block; width: 280px; max-width: calc(100vw - 16px);
    padding: 12px 14px; border: 1px solid var(--search-border); border-radius: 10px;
    background: var(--search-surface); color: var(--search-text);
    box-shadow: 0 6px 24px rgb(0 0 0 / .15);
    white-space: normal; text-align: left; font: 400 13px/1.5 var(--dnx-font);
}
#main-content .market-control-tooltip[hidden] { display: none; }