/*
 * Super Ferretería — encabezado compartido 1.7
 * Alcance: únicamente páginas con la clase controladora sf-header-redesign.
 */

.sf-header-redesign {
    --sf-header-primary: #ff6b00;
    --sf-header-primary-hover: #e85f00;
    --sf-header-secondary: #74c043;
    --sf-header-graphite: #202a30;
    --sf-header-muted: #657179;
    --sf-header-surface: #ffffff;
    --sf-header-border: #dfe3e1;
    --sf-header-focus: #176f98;
    --sf-header-shadow: 0 5px 18px rgba(32, 42, 48, 0.09);
}

.sf-header-redesign .masthead {
    position: sticky;
    top: 0;
    z-index: 990;
    background: var(--sf-header-surface);
    box-shadow: var(--sf-header-shadow);
}

@media (min-width: 1101px) {
    .sf-header-redesign.sf-header-scrolled .masthead {
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        width: 100%;
    }

    .admin-bar.sf-header-redesign.sf-header-scrolled .masthead {
        top: 32px;
    }

    .sf-header-redesign.sf-header-scrolled #page {
        padding-top: 72px;
    }

    .sf-header-redesign.sf-header-scrolled .masthead .top-bar {
        display: none;
    }

    .sf-header-redesign.sf-header-scrolled .masthead .header-bar {
        grid-template-rows: 72px;
    }

    .sf-header-redesign.sf-header-scrolled .header-bar .main-nav {
        display: none;
    }
}

.sf-header-redesign .masthead .top-bar {
    min-height: 36px;
    background: var(--sf-header-graphite);
    color: var(--sf-header-surface);
}

.sf-header-redesign .top-bar-bg {
    background: var(--sf-header-graphite);
}

.sf-header-redesign .top-bar .mini-widgets {
    gap: 22px;
}

.sf-header-redesign .top-bar .left-widgets {
    flex: 1;
    flex-wrap: nowrap;
}

.sf-header-redesign .top-bar .right-widgets:empty {
    display: none;
}

.sf-header-redesign .top-bar .mini-contacts {
    color: var(--sf-header-surface);
    font-size: 13px;
    line-height: 1.3;
}

.sf-header-redesign .masthead .header-bar {
    box-sizing: border-box;
    display: grid;
    grid-template-columns: minmax(180px, 230px) minmax(320px, 1fr) auto;
    grid-template-rows: 76px 48px;
    column-gap: 28px;
    width: min(100% - 72px, 1536px);
    max-width: none;
    min-height: 0;
    margin-inline: auto;
    padding: 0;
}

.sf-header-redesign .header-bar .branding {
    grid-column: 1;
    grid-row: 1;
    align-self: center;
    padding: 0;
}

.sf-header-redesign .branding img {
    width: auto;
    max-width: 190px;
    max-height: 58px;
}

.sf-header-redesign .sf-site-header__search {
    grid-column: 2;
    grid-row: 1;
    align-self: center;
    width: 100%;
    min-width: 0;
}

.sf-header-redesign .aws-container {
    width: 100%;
}

.sf-header-redesign .aws-search-form {
    height: 48px;
}

.sf-header-redesign .aws-search-field {
    height: 48px;
    padding-inline: 18px 46px;
    border: 1px solid var(--sf-header-border);
    border-radius: 8px 0 0 8px;
    background: var(--sf-header-surface);
    color: var(--sf-header-graphite);
    font-size: 16px;
}

.sf-header-redesign .aws-search-field::placeholder {
    color: var(--sf-header-muted);
    opacity: 1;
}

.sf-header-redesign .aws-search-btn {
    width: 58px;
    min-width: 58px;
    height: 48px;
    border: 1px solid var(--sf-header-primary);
    border-radius: 0 8px 8px 0;
    background: var(--sf-header-primary);
    color: var(--sf-header-surface);
    transition: background-color 160ms ease, border-color 160ms ease;
}

.sf-header-redesign .aws-search-btn:hover {
    border-color: var(--sf-header-primary-hover);
    background: var(--sf-header-primary-hover);
}

.sf-header-redesign .aws-search-field:focus-visible,
.sf-header-redesign .aws-search-btn:focus-visible {
    outline: 3px solid var(--sf-header-focus);
    outline-offset: 2px;
}

.sf-header-redesign .sf-site-header__search--mobile {
    display: none;
}

/* Resultados predictivos de Advanced Woo Search. */
.sf-header-redesign .aws-search-result {
    overflow: hidden;
    border: 1px solid var(--sf-header-border);
    border-radius: 0 0 12px 12px;
    background-color: #ffffff;
    box-shadow: 0 14px 34px rgba(32, 42, 48, 0.16);
}

.sf-header-redesign .aws-search-result .aws_results .aws_result_item {
    min-height: 92px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--sf-header-border);
    background-color: #ffffff;
    transition: background-color 160ms ease;
}

.sf-header-redesign .aws-search-result .aws_result_item.hovered,
.sf-header-redesign .aws-search-result .aws_result_item:hover,
.sf-header-redesign .aws-search-result .aws_result_item:focus-within {
    background-color: #edf2ef;
}

.sf-header-redesign .aws-search-result .aws_result_image {
    width: 72px;
    height: 68px;
    margin: 0;
    border-radius: 8px;
    background: #f4f6f5;
}

.sf-header-redesign .aws-search-result .aws_result_image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.sf-header-redesign .aws-search-result .aws_result_content {
    min-width: 0;
}

.sf-header-redesign .aws-search-result .aws_result_title {
    color: var(--sf-header-graphite);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
}

.sf-header-redesign .aws-search-result .aws_result_price {
    display: flex;
    gap: 10px;
    align-items: baseline;
    justify-content: flex-end;
    color: var(--sf-header-primary);
    font-size: 18px;
    font-weight: 750;
    white-space: nowrap;
}

.sf-header-redesign .aws-search-result .aws_result_price del {
    color: var(--sf-header-muted);
    font-size: 13px;
    font-weight: 500;
    opacity: 0.85;
}

.sf-header-redesign .aws-search-result .aws_result_price ins {
    color: var(--sf-header-primary);
    font-weight: 750;
    text-decoration: none;
}

.sf-header-redesign .aws-search-result .aws_result_price ins .amount {
    color: var(--sf-header-primary);
    text-decoration: none;
}

.sf-header-redesign .aws-search-result .aws_result_price del .amount {
    color: var(--sf-header-muted);
}

.sf-header-redesign .aws-search-result .aws_search_more {
    display: block;
    padding: 14px 18px;
    color: var(--sf-header-primary);
    font-weight: 700;
    text-align: center;
    text-decoration: none;
}

.sf-header-redesign .aws-search-result .aws_search_more:hover,
.sf-header-redesign .aws-search-result .aws_search_more:focus-visible {
    background: #fff4ec;
    color: var(--sf-header-primary-hover);
}

.sf-header-redesign .header-bar > .mini-widgets {
    grid-column: 3;
    grid-row: 1;
    align-self: center;
    gap: 18px;
    margin: 0;
}

.sf-header-redesign .mini-login .submit {
    color: var(--sf-header-graphite);
    font-weight: 650;
}

.sf-header-redesign .wc-ico-cart {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 44px;
    color: var(--sf-header-graphite);
    font-weight: 650;
}

.sf-header-redesign .wc-ico-cart::before {
    width: 21px;
    height: 21px;
    background: currentColor;
    content: "";
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 18c-1.1 0-1.99.9-1.99 2S5.9 22 7 22s2-.9 2-2-.9-2-2-2ZM1 2v2h2l3.6 7.59-1.35 2.45A2 2 0 0 0 7 17h12v-2H7.42a.25.25 0 0 1-.22-.37L8.1 13h7.45a2 2 0 0 0 1.75-1.03L20.88 5H5.21l-.94-2H1Zm16 16c-1.1 0-1.99.9-1.99 2s.89 2 1.99 2 2-.9 2-2-.9-2-2-2Z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 18c-1.1 0-1.99.9-1.99 2S5.9 22 7 22s2-.9 2-2-.9-2-2-2ZM1 2v2h2l3.6 7.59-1.35 2.45A2 2 0 0 0 7 17h12v-2H7.42a.25.25 0 0 1-.22-.37L8.1 13h7.45a2 2 0 0 0 1.75-1.03L20.88 5H5.21l-.94-2H1Zm16 16c-1.1 0-1.99.9-1.99 2s.89 2 1.99 2 2-.9 2-2-.9-2-2-2Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.sf-header-redesign .shopping-cart .counter {
    background: var(--sf-header-primary);
    color: var(--sf-header-surface);
}

.sf-header-redesign .header-bar .main-nav {
    box-sizing: border-box;
    grid-column: 1 / -1;
    grid-row: 2;
    align-self: stretch;
    justify-self: stretch;
    justify-content: flex-start;
    min-height: 48px;
    margin: 0;
    border-top: 1px solid var(--sf-header-border);
}

.sf-header-redesign .main-nav > li > a {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    min-height: 47px;
    margin: 0;
    padding: 0 20px;
    color: var(--sf-header-graphite);
    font-size: 15px;
    font-weight: 650;
    line-height: 1.25;
}

.sf-header-redesign .main-nav > li {
    margin-inline: 0;
}

.sf-header-redesign .main-nav > li:first-child > a {
    padding-left: 0;
}

.sf-header-redesign .main-nav > li.act > a,
.sf-header-redesign .main-nav > li > a:hover {
    color: var(--sf-header-primary);
}

@media (max-width: 1100px) {
    .sf-header-redesign .masthead .top-bar {
        display: none;
    }

    .sf-header-redesign .masthead .header-bar {
        display: none;
    }

    .sf-header-redesign .mobile-header-bar {
        box-sizing: border-box;
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto auto;
        grid-template-rows: 60px;
        column-gap: 12px;
        width: 100%;
        height: 60px;
        padding-inline: 14px;
        border-bottom: 1px solid var(--sf-header-border);
        background: var(--sf-header-surface);
    }

    .sf-header-redesign .mobile-header-bar .mobile-branding {
        grid-column: 1;
        grid-row: 1;
        align-self: center;
        justify-self: start;
        min-width: 0;
    }

    .sf-header-redesign .mobile-header-bar .mobile-branding img {
        width: auto;
        height: auto;
        max-width: 150px;
        max-height: 48px;
        object-fit: contain;
    }

    .sf-header-redesign .mobile-header-bar .mobile-mini-widgets {
        position: static;
        grid-column: 2;
        grid-row: 1;
        align-self: center;
        justify-self: end;
        min-width: 0;
    }

    .sf-header-redesign .mobile-header-bar .mobile-navigation {
        position: static;
        grid-column: 3;
        grid-row: 1;
        align-self: center;
        justify-self: end;
    }

    .sf-header-redesign .sf-site-header__search {
        box-sizing: border-box;
        display: block;
        width: 100%;
        height: 56px;
        padding: 0 14px 8px;
        background-color: var(--sf-header-surface);
    }

    .sf-header-redesign .aws-search-form,
    .sf-header-redesign .aws-search-field,
    .sf-header-redesign .aws-search-btn {
        height: 46px;
    }

    .sf-header-redesign .aws-search-btn {
        width: 52px;
        min-width: 52px;
    }

    .sf-header-redesign .aws-search-field {
        font-size: 16px;
    }

    .sf-header-redesign .mobile-header-bar .wc-ico-cart .amount {
        display: none;
    }

    .sf-header-redesign .mobile-header-bar a.wc-ico-cart {
        font-size: 0;
    }

    .sf-header-redesign .mobile-header-bar .wc-ico-cart .counter {
        font-size: 10px;
    }

    .sf-header-redesign .mobile-mini-widgets .mini-login {
        display: none;
    }

    .sf-header-redesign .sf-site-header__search--desktop {
        display: none;
    }

    .sf-header-redesign .sf-site-header__search--mobile {
        display: block;
        grid-column: 1 / -1;
        grid-row: auto;
    }

    .sf-header-redesign:not(.sf-header-ready) .sf-site-header__search--mobile {
        visibility: hidden;
    }

    .sf-header-redesign .aws-search-result .aws_results .aws_result_item {
        min-height: 82px;
        padding: 10px 12px;
    }

    .sf-header-redesign .aws-search-result .aws_result_image {
        width: 58px;
        height: 58px;
    }

    .sf-header-redesign .aws-search-result .aws_result_price {
        justify-content: flex-start;
        font-size: 16px;
    }
}

@media (min-width: 1101px) {
    .sf-header-redesign .aws-search-result {
        margin-top: 63px;
    }

    .sf-header-redesign.sf-header-scrolled .aws-search-result {
        margin-top: 7px;
    }
}

@media (max-width: 420px) {
    .sf-header-redesign .mobile-header-bar {
        padding-inline: 10px;
    }

    .sf-header-redesign .mobile-header-bar .mobile-branding img {
        max-width: 132px;
        max-height: 44px;
    }

    .sf-header-redesign .aws-search-field {
        padding-left: 14px;
        font-size: 15px;
    }

    .sf-header-redesign .sf-site-header__search {
        padding-inline: 10px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .sf-header-redesign .aws-search-btn {
        transition: none;
    }
}