/* TL_ACCOUNT_FLOATING_SECONDARY_SHELL_V1 */
html body.customer-account-body > header.checkout-secondary-header.customer-account-section-header {
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

html body.customer-account-body > header.checkout-secondary-header.customer-account-section-header .customer-account-section-header__inner,
html body.customer-account-body > header.checkout-secondary-header.customer-account-section-header .customer-account-official-header {
    position: relative !important;
    border: 1px solid rgba(18, 63, 109, .17) !important;
    border-radius: 16px !important;
    background: var(--tl-secondary-header-bg) !important;
    box-shadow: 0 8px 22px rgba(15, 42, 68, .10) !important;
    backdrop-filter: blur(18px) saturate(145%) !important;
    -webkit-backdrop-filter: blur(18px) saturate(145%) !important;
}

@media screen and (min-width: 841px) {
    html body.customer-account-body > header.checkout-secondary-header.customer-account-section-header {
        padding-top: 14px !important;
    }

    .tl-account-home-only-button {
        position: absolute;
        top: 50%;
        right: 10px;
        z-index: 7;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 38px;
        padding: 0 12px;
        gap: 7px;
        border: 1px solid rgba(18, 63, 109, .17);
        border-radius: 11px;
        color: #123f6d;
        background: #fff;
        box-shadow: 0 5px 14px rgba(11, 49, 88, .08);
        font-size: 12px;
        font-weight: 800;
        line-height: 1;
        text-decoration: none;
        white-space: nowrap;
        transform: translateY(-50%);
    }

    .tl-account-home-only-button:hover {
        color: #0b3158;
        border-color: rgba(255, 159, 10, .45);
        background: rgba(255, 159, 10, .09);
    }

    .tl-account-home-only-button svg {
        width: 17px;
        height: 17px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.9;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

    body.customer-account-body > .checkout-secondary-header *:has(> .tl-account-home-native) {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    body.customer-account-body > .checkout-secondary-header .tl-account-home-native {
        display: inline-flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }
}

@media screen and (max-width: 840px) {
    html body.customer-account-body > header.checkout-secondary-header.customer-account-section-header {
        padding-top: 10px !important;
    }

    .tl-account-home-only-button {
        display: none !important;
    }
}

html[data-theme="dark"] body.customer-account-body > header.checkout-secondary-header.customer-account-section-header .customer-account-section-header__inner,
html[data-theme="dark"] body.customer-account-body > header.checkout-secondary-header.customer-account-section-header .customer-account-official-header,
body[data-theme="dark"].customer-account-body > header.checkout-secondary-header.customer-account-section-header .customer-account-section-header__inner,
body[data-theme="dark"].customer-account-body > header.checkout-secondary-header.customer-account-section-header .customer-account-official-header {
    border-color: rgba(189, 208, 226, .20) !important;
    background: var(--tl-secondary-header-bg) !important;
    box-shadow: 0 9px 24px rgba(0, 0, 0, .30) !important;
}
/* TL_ACCOUNT_SECONDARY_SINGLE_SHELL_V2_START */
/*
   Canonical shared Account secondary header:
   - the OUTER header is not a visual surface
   - __inner is layout-only and must never draw a shell
   - customer-account-official-header is the ONLY visible shell

   This is intentionally global for all pages using _CustomerAccountLayout.
*/
html body.customer-account-body
> header.checkout-secondary-header.customer-account-section-header,
body.customer-account-body
> header.checkout-secondary-header.customer-account-section-header {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

html body.customer-account-body
> header.checkout-secondary-header.customer-account-section-header
.customer-account-section-header__inner,
body.customer-account-body
> header.checkout-secondary-header.customer-account-section-header
.customer-account-section-header__inner {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;

    border: 0 !important;
    outline: 0 !important;
    border-radius: 0 !important;

    box-shadow: none !important;

    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;

    filter: none !important;
}

/* Remove any decorative layer that could recreate a second shell. */
html body.customer-account-body
> header.checkout-secondary-header.customer-account-section-header
.customer-account-section-header__inner::before,
html body.customer-account-body
> header.checkout-secondary-header.customer-account-section-header
.customer-account-section-header__inner::after,
body.customer-account-body
> header.checkout-secondary-header.customer-account-section-header
.customer-account-section-header__inner::before,
body.customer-account-body
> header.checkout-secondary-header.customer-account-section-header
.customer-account-section-header__inner::after {
    content: none !important;
    display: none !important;
}

/*
   Dark mode must follow the same rule:
   no dark rectangle / panel behind the actual official header.
*/
html[data-theme="dark"] body.customer-account-body
> header.checkout-secondary-header.customer-account-section-header,
body[data-theme="dark"].customer-account-body
> header.checkout-secondary-header.customer-account-section-header,
html[data-theme="dark"] body.customer-account-body
> header.checkout-secondary-header.customer-account-section-header
.customer-account-section-header__inner,
body[data-theme="dark"].customer-account-body
> header.checkout-secondary-header.customer-account-section-header
.customer-account-section-header__inner {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/*
   Do NOT clear .customer-account-official-header.
   That nested element remains the one and only visible secondary-header card.
*/
/* TL_ACCOUNT_SECONDARY_SINGLE_SHELL_V2_END */
