/* Valve Life — header search icon (loaded after Magento styles)
 *
 * Magento Blank adds .control { padding-bottom: 25px } on desktop. With
 * top/bottom:0 the submit button stretches into that padding and the icon
 * sits low inside the visible input. Always zero control padding and
 * center the button on the input with top:50% + translateY(-50%).
 */

.header.content .block-search .control,
.block-search .control {
    position: relative !important;
    overflow: visible !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    clear: none !important;
}

.header.content .block-search input.input-text,
.block-search input.input-text {
    padding-right: 2.75rem !important;
}

.block-search .action.search.ht-search-btn,
.block-search .action.search.ht-search-btn[disabled],
.block-search .action.search.ht-search-btn.disabled,
fieldset[disabled] .block-search .action.search.ht-search-btn,
.header.content .block-search .action.search,
.header.content .block-search .action.search[disabled],
.header.content .block-search .action.search.disabled,
fieldset[disabled] .header.content .block-search .action.search {
    position: absolute !important;
    top: 50% !important;
    right: 10px !important;
    bottom: auto !important;
    left: auto !important;
    width: 36px !important;
    height: 36px !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transform: translateY(-50%) !important;
    -webkit-transform: translateY(-50%) !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    cursor: pointer !important;
    z-index: 5 !important;
    float: none !important;
    color: #4a5560 !important;
    line-height: 0 !important;
    font-size: 0 !important;
    vertical-align: middle !important;
}

.block-search .action.search.ht-search-btn:before,
.header.content .block-search .action.search:before {
    display: none !important;
    content: none !important;
    font-size: 0 !important;
    line-height: 0 !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Undo Magento's .action.search > span screen-reader clip for the icon */
.block-search .action.search.ht-search-btn > span.ht-search-btn__icon,
.block-search .action.search > span.ht-search-btn__icon,
.header.content .block-search .action.search > span.ht-search-btn__icon {
    border: 0 !important;
    clip: auto !important;
    clip-path: none !important;
    height: 18px !important;
    width: 18px !important;
    margin: 0 !important;
    overflow: visible !important;
    padding: 0 !important;
    position: static !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.block-search .action.search.ht-search-btn > span.ht-search-btn__icon svg,
.block-search .action.search > span.ht-search-btn__icon svg,
.header.content .block-search .action.search .ht-search-btn__icon svg,
.block-search .action.search.ht-search-btn > svg.ht-search-btn__svg,
.header.content .block-search .action.search > svg.ht-search-btn__svg {
    display: block !important;
    width: 18px !important;
    height: 18px !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    flex-shrink: 0 !important;
    /* Circle is above SVG box mid (cy=11 in 24 viewBox) — nudge down optically */
    transform: translateY(1px) !important;
}

.block-search .action.search.ht-search-btn > span.ht-search-btn__label,
.header.content .block-search .action.search > span.ht-search-btn__label {
    border: 0 !important;
    clip: rect(0, 0, 0, 0) !important;
    height: 1px !important;
    margin: -1px !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    width: 1px !important;
}

.block-search .label {
    display: none !important;
}
