@import url("/store/assets/css/fashion-header.css");
/*
|--------------------------------------------------------------------------
| BEAUTY HEADER
|--------------------------------------------------------------------------
*/

html[data-storefront-theme="beauty"] {
    --beauty-primary: #b56f7d;
    --beauty-primary-dark: #8f4f5d;
    --beauty-bg: #fcf7f7;
    --beauty-soft: #f3e4e7;
    --beauty-border: #ead9dd;
    --beauty-text: #332b30;
    --beauty-muted: #75676d;
    --beauty-white: #ffffff;
}

html[data-storefront-theme="beauty"] .store-header {
    background: var(--beauty-bg);
    border-bottom: 1px solid var(--beauty-border);
}

html[data-storefront-theme="beauty"] .store-header-inner {
    background: var(--beauty-bg);
}

html[data-storefront-theme="beauty"] .store-header a {
    color: var(--beauty-text);
}

html[data-storefront-theme="beauty"] .store-header a:hover {
    color: var(--beauty-primary-dark);
}

html[data-storefront-theme="beauty"] .store-search-form {
    background: var(--beauty-white);
    border-color: var(--beauty-border);
    border-radius: 12px;
}

html[data-storefront-theme="beauty"] .store-search-form:focus-within {
    border-color: var(--beauty-primary);
    box-shadow:
        0 8px 24px rgba(181, 111, 125, .10);
}

html[data-storefront-theme="beauty"] .store-search-input {
    color: var(--beauty-text);
}

html[data-storefront-theme="beauty"] .store-search-input::placeholder {
    color: var(--beauty-muted);
}

html[data-storefront-theme="beauty"] .store-search-button {
    background: var(--beauty-primary);
    border-left-color: var(--beauty-border);
    color: var(--beauty-white);
}

html[data-storefront-theme="beauty"] .store-search-button:hover {
    background: var(--beauty-primary-dark);
}

html[data-storefront-theme="beauty"] .store-header-actions a,
html[data-storefront-theme="beauty"] .store-header-actions button {
    color: var(--beauty-text);
}

html[data-storefront-theme="beauty"] .store-header-actions a:hover,
html[data-storefront-theme="beauty"] .store-header-actions button:hover {
    color: var(--beauty-primary-dark);
}

html[data-storefront-theme="beauty"] .store-category-inner {
    background: var(--beauty-bg);
}

html[data-storefront-theme="beauty"] .store-category-inner a {
    color: var(--beauty-text);
}

html[data-storefront-theme="beauty"] .store-category-inner a:hover {
    color: var(--beauty-primary);
}

html[data-storefront-theme="beauty"] .store-category-inner a::after {
    background: var(--beauty-primary);
}

html[data-storefront-theme="beauty"] .store-mobile-menu,
html[data-storefront-theme="beauty"] .store-mobile-menu-panel {
    background: var(--beauty-bg);
}

html[data-storefront-theme="beauty"] .store-mobile-menu a {
    color: var(--beauty-text);
}

html[data-storefront-theme="beauty"] .store-mobile-menu a:hover {
    color: var(--beauty-primary-dark);
}

html[data-storefront-theme="beauty"] .store-mobile-menu-button {
    color: var(--beauty-text);
}

html[data-storefront-theme="beauty"] .store-mobile-menu-button:hover {
    color: var(--beauty-primary);
}
/* --------------------------------------------------------------------------
   BEAUTY / FULL WIDTH CATEGORY BAR
   -------------------------------------------------------------------------- */

html[data-storefront-theme="beauty"] .store-category-bar {
    background:
        var(--beauty-bg);

    border-top:
        1px solid var(--beauty-border);

    border-bottom:
        1px solid var(--beauty-border);
}

html[data-storefront-theme="beauty"] .store-category-inner {
    background:
        var(--beauty-bg);
}

/*
|--------------------------------------------------------------------------
| BEAUTY — MOBILE CLEAN HEADER
|--------------------------------------------------------------------------
*/

@media (max-width: 900px) {

    html[data-storefront-theme="beauty"] .store-header-inner {
        width: calc(100% - 24px);
        min-height: 64px;
        padding: 10px 0;
        display: flex;
        align-items: center;
        flex-wrap: nowrap;
        gap: 7px;
    }

    html[data-storefront-theme="beauty"] .store-logo {
        flex: 1 1 auto;
        min-width: 0;
        width: auto;
        max-width: none;
        overflow: hidden;
        align-items: flex-start;
        justify-content: flex-start;
    }

    html[data-storefront-theme="beauty"] .store-logo-title {
        font-size: 18px;
        line-height: 1.05;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    html[data-storefront-theme="beauty"] .store-logo-subtitle {
        margin-top: 5px;
        font-size: 6px;
        letter-spacing: 0.14em;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    html[data-storefront-theme="beauty"] .store-search {
        display: none;
    }

    html[data-storefront-theme="beauty"] .store-header-actions {
        flex: 0 0 auto;
        width: auto;
        margin-left: auto !important;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 4px;
    }
}