/* Desktop styles. */
.shop-header {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 30;
    background: var(--liuer-accent);
}
 body.mkorg-device-desktop .shop-header { position: sticky; }
 body.mkorg-layout-header-3 { --shop-header-height: 64px; }
 .shop-header__main { display: grid; grid-template-columns: minmax(190px, 190px) minmax(280px, 1fr) max-content max-content max-content; gap: 35px; align-items: center; height: 64px; min-height: 64px; }
 .shop-header__main--without-commerce { grid-template-columns: minmax(170px, 190px) minmax(160px, 440px) 1fr; gap: 36px; }
 .shop-logo { display: inline-flex; align-items: center; gap: 10px; min-width: 0; max-width: 100%; overflow: hidden; color: var(--shop-inverse-color); font-size: 25px; font-weight: 600; letter-spacing: -0.055em; text-transform: uppercase; white-space: nowrap; }
 .shop-logo > span:last-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
 .shop-logo > span:last-child span { margin-left: 2px; font-weight: 600; text-transform: none; opacity: 0.9; }
 .shop-logo--image { width: min(245px, 19vw); letter-spacing: 0; }
.shop-logo__image {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 50px;
    object-fit: contain;
    object-position: left center;
}
 .shop-logo__mark { display: grid; place-items: center; width: 40px; height: 40px; border: 2px solid var(--shop-focus-border-color); border-radius: var(--shop-radius); color: var(--shop-inverse-color); font-size: var(--shop-logo-mark-size); font-weight: 600; letter-spacing: -0.08em; }
.shop-search {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    min-width: 0;
    height: 40px;
    overflow: hidden;
    border: 1px solid transparent;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 2px 8px color-mix(in srgb, var(--liuer-shadow-hex) 9%, transparent);
}
 .shop-search:focus-within { border-color: var(--shop-focus-border-color); box-shadow: 0 0 0 3px color-mix(in srgb, var(--liuer-inverse-border-hex) 18%, transparent); }
 .shop-search__submit { display: inline-flex; grid-column: 1; grid-row: 1; align-items: center; justify-content: center; width: 46px; padding: 0; border: 0; background: transparent; }
 .shop-search__submit:hover { background: color-mix(in srgb, var(--liuer-accent) 12%, var(--liuer-surface)); }
 .shop-search__submit .shop-icon { width: 20px; height: 20px; }
 .shop-search input { grid-column: 2; grid-row: 1; min-width: 0; width: 100%; padding: 0 18px 0 0; border: 0; outline: 0; background: transparent; color: var(--shop-text-color); }
 .shop-search input[type="hidden"] { display: none; }
 .shop-search input::placeholder { color: var(--shop-placeholder-color); }
 .shop-action__icon { display: grid; place-items: center; flex: 0 0 auto; width: 24px; height: 24px; color: var(--shop-inverse-color); }
 .shop-action__icon .shop-icon { width: 22px; height: 22px; }
 .shop-cart-toast { position: fixed; z-index: 9999; top: calc(var(--shop-header-height) + 12px); right: 18px; display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; gap: 10px; align-items: center; width: min(360px, calc(100vw - 28px)); padding: 12px 14px; border: 1px solid var(--liuer-border); border-radius: var(--shop-radius); background: #ffffff; color: var(--shop-text-color); box-shadow: 0 16px 34px color-mix(in srgb, var(--liuer-shadow-hex) 16%, transparent); opacity: 0; pointer-events: none; transform: translateY(-8px); transition: opacity 0.2s ease, transform 0.2s ease; }
 .shop-cart-toast.is-visible { opacity: 1; pointer-events: auto; transform: translateY(0); }
 .shop-cart-toast.has-error { border-color: color-mix(in srgb, var(--shop-danger-color) 22%, transparent); }
 .shop-cart-toast__icon { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: #e9f8ef; color: var(--liuer-accent); }
 .shop-cart-toast__icon::before { content: ""; width: 13px; height: 8px; border-bottom: 2px solid currentColor; border-left: 2px solid currentColor; transform: rotate(-45deg) translate(1px, -1px); }
 .shop-cart-toast.has-error .shop-cart-toast__icon { background: #fff0f0; color: #d9342b; }
 .shop-cart-toast.has-error .shop-cart-toast__icon::before { width: 12px; height: 12px; border: 0; background: linear-gradient(currentColor, currentColor) center / 2px 100% no-repeat, linear-gradient(currentColor, currentColor) center / 100% 2px no-repeat; transform: rotate(45deg); }
 .shop-cart-toast p { margin: 0; font-size: 14px; font-weight: 600; line-height: 1.35; }
 .shop-cart-toast a { color: var(--liuer-accent); font-size: 13px; font-weight: 600; white-space: nowrap; }

/* Header actions: two links split by dividers, then the hotline pill */
.shop-header-3__actions { --header-action-gap: clamp(24px, 3vw, 36px); display: flex; align-items: center; justify-content: flex-end; gap: var(--header-action-gap); }
.shop-header-3__action { display: inline-flex; align-items: center; gap: 8px; height: 32px; color: var(--shop-inverse-color); font-size: 15px; font-weight: 500; white-space: nowrap; }
.shop-header-3__action + .shop-header-3__action, .shop-header-3__hotline { position: relative; }
.shop-header-3__action + .shop-header-3__action::before, .shop-header-3__hotline::before { content: ""; position: absolute; top: 50%; left: calc(var(--header-action-gap) / -2); width: 1px; height: 32px; background: var(--shop-inverse-border-color); transform: translateY(-50%); }
.shop-header-3__action:hover { color: var(--shop-inverse-color); opacity: 0.86; }
.shop-header-3__action .shop-action__icon { width: 26px; height: 26px; }
.shop-header-3__action .shop-icon { width: 24px; height: 24px; }
.shop-header-3__hotline { display: inline-flex; align-items: center; gap: 10px; height: 46px; padding: 0 20px 0 16px; border-radius: 999px; background: rgba(0, 0, 0, 0.16); color: var(--shop-inverse-color); white-space: nowrap; }
.shop-header-3__hotline:hover { background: rgba(0, 0, 0, 0.26); color: var(--shop-inverse-color); }
.shop-header-3__hotline > .shop-icon--phone-call { width: 22px; height: 22px; }
.shop-header-3__hotline span { line-height: 1.2; }
.shop-header-3__hotline small { display: block; font-size: var(--shop-small-size); font-weight: 500; opacity: 0.9; }
.shop-header-3__hotline strong { display: block; font-size: 15px; font-weight: 700; }
