/* /Components/Account/AccountPrivacy.razor.rz.scp.css */
.account-privacy-page[b-hipz2tljwu] {
    width: min(980px, calc(100% - 2rem));
    margin: 0 auto;
    padding: 2rem 0 4rem;
    display: grid;
    gap: 1.25rem;
}

.account-privacy-hero[b-hipz2tljwu],
.account-privacy-card[b-hipz2tljwu],
.account-privacy-loading[b-hipz2tljwu] {
    border: 1px solid var(--mud-palette-divider);
    border-radius: 24px;
    background: var(--mud-palette-surface);
    box-shadow: 0 18px 48px color-mix(in srgb, var(--mud-palette-primary) 8%, transparent);
}

.account-privacy-hero[b-hipz2tljwu] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 1rem;
    align-items: center;
    padding: 1.4rem;
}

.account-privacy-hero-icon[b-hipz2tljwu],
.account-privacy-card-icon[b-hipz2tljwu] {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border-radius: 16px;
    color: var(--mud-palette-primary);
    background: color-mix(in srgb, var(--mud-palette-primary) 9%, var(--mud-palette-surface));
}

.account-privacy-eyebrow[b-hipz2tljwu] {
    color: var(--mud-palette-secondary);
    font-weight: 900;
}

.account-privacy-page[b-hipz2tljwu]  .account-privacy-title {
    color: var(--mud-palette-text-primary);
    font-weight: 950;
}

.account-privacy-page[b-hipz2tljwu]  .account-privacy-copy,
.account-privacy-page[b-hipz2tljwu]  .account-privacy-card-copy {
    color: var(--mud-palette-text-secondary);
}

.account-privacy-loading[b-hipz2tljwu] {
    min-height: 180px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: .75rem;
}

.account-privacy-card[b-hipz2tljwu] {
    display: grid;
    gap: 1.1rem;
    padding: 1.4rem;
}

.account-privacy-card-heading[b-hipz2tljwu] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: .9rem;
    align-items: center;
}

.account-privacy-page[b-hipz2tljwu]  .account-privacy-card-title {
    color: var(--mud-palette-text-primary);
    font-weight: 900;
}

.account-privacy-preference-row[b-hipz2tljwu] {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    padding: 1rem;
    border: 1px solid var(--mud-palette-divider);
    border-radius: 18px;
    background: color-mix(in srgb, var(--mud-palette-background) 70%, var(--mud-palette-surface));
}

    .account-privacy-preference-row > div[b-hipz2tljwu] {
        display: grid;
        gap: .25rem;
    }

    .account-privacy-preference-row strong[b-hipz2tljwu] {
        color: var(--mud-palette-text-primary);
    }

    .account-privacy-preference-row span[b-hipz2tljwu] {
        color: var(--mud-palette-text-secondary);
        font-size: .82rem;
    }

.account-privacy-service-notice[b-hipz2tljwu],
.account-privacy-request-status[b-hipz2tljwu] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: .65rem;
    align-items: start;
    padding: .9rem;
    border-radius: 16px;
}

.account-privacy-service-notice[b-hipz2tljwu] {
    color: var(--mud-palette-text-secondary);
    border: 1px solid color-mix(in srgb, var(--mud-palette-info) 24%, var(--mud-palette-divider));
    background: color-mix(in srgb, var(--mud-palette-info) 6%, var(--mud-palette-surface));
}

.account-privacy-danger-card[b-hipz2tljwu] {
    border-color: color-mix(in srgb, var(--mud-palette-error) 28%, var(--mud-palette-divider));
}

.account-privacy-danger-icon[b-hipz2tljwu] {
    color: var(--mud-palette-error);
    background: color-mix(in srgb, var(--mud-palette-error) 8%, var(--mud-palette-surface));
}

.account-privacy-request-status[b-hipz2tljwu] {
    color: var(--mud-palette-text-primary);
    border: 1px solid color-mix(in srgb, var(--mud-palette-warning) 30%, var(--mud-palette-divider));
    background: color-mix(in srgb, var(--mud-palette-warning) 8%, var(--mud-palette-surface));
}

    .account-privacy-request-status div[b-hipz2tljwu] {
        display: grid;
        gap: .25rem;
    }

    .account-privacy-request-status span[b-hipz2tljwu] {
        color: var(--mud-palette-text-secondary);
        font-size: .82rem;
    }

@media (max-width: 700px) {
    .account-privacy-page[b-hipz2tljwu] {
        width: min(100% - 1rem, 980px);
        padding-top: 1rem;
    }

    .account-privacy-hero[b-hipz2tljwu] {
        grid-template-columns: 1fr;
    }

    .account-privacy-preference-row[b-hipz2tljwu] {
        align-items: flex-start;
    }
}
/* /Components/Account/AccountProfile.razor.rz.scp.css */
.account-profile-page[b-ew5p78mq02] {
    display: grid;
    gap: 1.5rem;
    max-width: 900px;
    margin: 0 auto;
    padding: 2rem 0 4rem;
}

.account-profile-hero[b-ew5p78mq02] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 1rem;
    align-items: center;
    padding: 1.6rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 12%, var(--mud-palette-divider));
    border-radius: 26px;
    background: radial-gradient(circle at 88% 12%, color-mix(in srgb, var(--mud-palette-secondary) 18%, transparent), transparent 34%), var(--mud-palette-surface);
    box-shadow: 0 20px 55px color-mix(in srgb, var(--mud-palette-primary) 10%, transparent);
}

.account-profile-hero-icon[b-ew5p78mq02],
.account-profile-card-icon[b-ew5p78mq02] {
    display: grid;
    place-items: center;
    color: var(--mud-palette-primary);
    background: color-mix(in srgb, var(--mud-palette-secondary) 18%, var(--mud-palette-surface));
    border: 1px solid color-mix(in srgb, var(--mud-palette-secondary) 28%, transparent);
}

.account-profile-hero-icon[b-ew5p78mq02] {
    width: 68px;
    height: 68px;
    border-radius: 22px;
}

.account-profile-card-icon[b-ew5p78mq02] {
    width: 52px;
    height: 52px;
    border-radius: 17px;
}

.account-profile-page[b-ew5p78mq02]  .account-profile-eyebrow {
    color: var(--mud-palette-secondary);
    font-weight: 900;
    letter-spacing: 0.08em;
}

.account-profile-page[b-ew5p78mq02]  .account-profile-title {
    color: var(--mud-palette-primary);
    font-weight: 950;
    letter-spacing: -0.04em;
}

.account-profile-page[b-ew5p78mq02]  .account-profile-copy,
.account-profile-page[b-ew5p78mq02]  .account-profile-card-copy {
    color: var(--mud-palette-text-secondary);
    line-height: 1.65;
}

.account-profile-alert[b-ew5p78mq02] {
    border-radius: 16px;
}

.account-profile-loading[b-ew5p78mq02] {
    min-height: 180px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 0.8rem;
    color: var(--mud-palette-text-secondary);
    border: 1px solid var(--mud-palette-divider);
    border-radius: 24px;
    background: var(--mud-palette-surface);
}

.account-profile-card[b-ew5p78mq02] {
    display: grid;
    gap: 1.35rem;
    padding: 1.6rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 10%, var(--mud-palette-divider));
    border-radius: 24px;
    background: var(--mud-palette-surface);
    box-shadow: 0 18px 48px color-mix(in srgb, var(--mud-palette-primary) 8%, transparent);
}

.account-profile-card-heading[b-ew5p78mq02] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.9rem;
    align-items: center;
}

.account-profile-page[b-ew5p78mq02]  .account-profile-card-title {
    color: var(--mud-palette-text-primary);
    font-weight: 900;
}

.account-profile-current-language[b-ew5p78mq02] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.55rem 0.72rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-secondary) 26%, var(--mud-palette-divider));
    border-radius: 12px;
    background: color-mix(in srgb, var(--mud-palette-secondary) 8%, var(--mud-palette-surface));
}

    .account-profile-current-language span[b-ew5p78mq02] {
        color: var(--mud-palette-text-secondary);
        font-size: 0.73rem;
        font-weight: 750;
    }

    .account-profile-current-language strong[b-ew5p78mq02] {
        color: var(--mud-palette-primary);
        font-size: 0.8rem;
        font-weight: 950;
    }

.account-profile-language-form[b-ew5p78mq02],
.account-profile-language-form fieldset[b-ew5p78mq02] {
    min-width: 0;
    display: grid;
    gap: 1rem;
    margin: 0;
    padding: 0;
    border: 0;
}

.account-profile-language-options[b-ew5p78mq02] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.8rem;
}

.account-profile-language-option[b-ew5p78mq02] {
    position: relative;
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.75rem;
    align-items: center;
    padding: 1rem;
    border: 1px solid var(--mud-palette-divider);
    border-radius: 18px;
    background: color-mix(in srgb, var(--mud-palette-background) 72%, var(--mud-palette-surface));
    cursor: pointer;
    transition: transform 150ms ease, border-color 150ms ease, box-shadow 150ms ease;
}

    .account-profile-language-option:hover[b-ew5p78mq02] {
        transform: translateY(-2px);
        border-color: color-mix(in srgb, var(--mud-palette-secondary) 36%, var(--mud-palette-divider));
        box-shadow: 0 14px 30px color-mix(in srgb, var(--mud-palette-primary) 8%, transparent);
    }

    .account-profile-language-option:has(input:checked)[b-ew5p78mq02] {
        border-color: color-mix(in srgb, var(--mud-palette-primary) 52%, var(--mud-palette-divider));
        background: color-mix(in srgb, var(--mud-palette-primary) 7%, var(--mud-palette-surface));
        box-shadow: 0 0 0 2px color-mix(in srgb, var(--mud-palette-primary) 13%, transparent);
    }

    .account-profile-language-option input[b-ew5p78mq02] {
        position: absolute;
        opacity: 0;
        pointer-events: none;
    }

    .account-profile-language-option img[b-ew5p78mq02] {
        width: 38px;
        height: 28px;
        object-fit: cover;
        border-radius: 6px;
        box-shadow: 0 5px 14px color-mix(in srgb, var(--mud-palette-primary) 16%, transparent);
    }

    .account-profile-language-option > span[b-ew5p78mq02] {
        min-width: 0;
        display: grid;
        gap: 0.12rem;
    }

    .account-profile-language-option strong[b-ew5p78mq02] {
        color: var(--mud-palette-text-primary);
        font-size: 0.92rem;
        font-weight: 950;
    }

    .account-profile-language-option small[b-ew5p78mq02] {
        color: var(--mud-palette-secondary);
        font-size: 0.65rem;
        font-weight: 900;
    }

    .account-profile-language-option p[b-ew5p78mq02] {
        margin: 0.22rem 0 0;
        color: var(--mud-palette-text-secondary);
        font-size: 0.72rem;
        line-height: 1.42;
    }

.account-profile-page[b-ew5p78mq02]  .account-profile-language-check {
    color: var(--mud-palette-divider);
}

.account-profile-language-option:has(input:checked)[b-ew5p78mq02]
 .account-profile-language-check {
    color: var(--mud-palette-success);
}

.account-profile-language-notice[b-ew5p78mq02] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.65rem;
    align-items: start;
    padding: 0.85rem;
    color: var(--mud-palette-text-secondary);
    border: 1px solid color-mix(in srgb, var(--mud-palette-info) 20%, var(--mud-palette-divider));
    border-radius: 16px;
    background: color-mix(in srgb, var(--mud-palette-info) 6%, var(--mud-palette-surface));
}

    .account-profile-language-notice > div[b-ew5p78mq02] {
        display: grid;
        gap: 0.12rem;
    }

    .account-profile-language-notice strong[b-ew5p78mq02] {
        color: var(--mud-palette-text-primary);
        font-size: 0.78rem;
        font-weight: 900;
    }

    .account-profile-language-notice span[b-ew5p78mq02] {
        font-size: 0.73rem;
        line-height: 1.45;
    }

.account-profile-page[b-ew5p78mq02]  .account-profile-save-button {
    justify-self: start;
    min-height: 48px;
    border-radius: 14px;
    font-weight: 900;
}

@media (max-width: 650px) {
    .account-profile-page[b-ew5p78mq02] {
        padding: 1rem 0 2.5rem;
    }

    .account-profile-hero[b-ew5p78mq02],
    .account-profile-card[b-ew5p78mq02] {
        padding: 1.2rem;
        border-radius: 20px;
    }

    .account-profile-hero[b-ew5p78mq02],
    .account-profile-card-heading[b-ew5p78mq02],
    .account-profile-language-options[b-ew5p78mq02] {
        grid-template-columns: 1fr;
    }

    .account-profile-page[b-ew5p78mq02]  .account-profile-save-button {
        width: 100%;
    }
}

/* BB-CUSTOMER-FAVORITES-01 */
.account-profile-page[b-ew5p78mq02] {
    max-width: 1120px;
}

.account-favorites-card[b-ew5p78mq02] {
    gap: 1.2rem;
}

.account-favorites-heading[b-ew5p78mq02] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.account-favorites-heading-icon[b-ew5p78mq02] {
    color: var(--mud-palette-error);
    background: color-mix(in srgb, var(--mud-palette-error) 10%, var(--mud-palette-surface));
    border-color: color-mix(in srgb, var(--mud-palette-error) 18%, var(--mud-palette-divider));
}

.account-favorites-loading[b-ew5p78mq02] {
    min-height: 150px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 0.75rem;
    color: var(--mud-palette-text-secondary);
    border: 1px dashed color-mix(in srgb, var(--mud-palette-primary) 18%, var(--mud-palette-divider));
    border-radius: 20px;
    background: color-mix(in srgb, var(--mud-palette-primary) 3%, var(--mud-palette-surface));
}

.account-favorites-empty[b-ew5p78mq02] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
    padding: 1.2rem;
    border: 1px dashed color-mix(in srgb, var(--mud-palette-primary) 20%, var(--mud-palette-divider));
    border-radius: 21px;
    background: radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--mud-palette-secondary) 10%, transparent), transparent 35%), color-mix(in srgb, var(--mud-palette-primary) 4%, var(--mud-palette-surface));
}

.account-favorites-empty-icon[b-ew5p78mq02] {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    color: var(--mud-palette-error);
    border-radius: 18px;
    background: color-mix(in srgb, var(--mud-palette-error) 10%, var(--mud-palette-surface));
}

.account-favorites-empty strong[b-ew5p78mq02] {
    display: block;
    color: var(--mud-palette-text-primary);
    font-size: 1rem;
    font-weight: 950;
}

.account-favorites-empty p[b-ew5p78mq02] {
    margin: 0.25rem 0 0;
    color: var(--mud-palette-text-secondary);
    font-size: 0.84rem;
    line-height: 1.5;
}

.account-favorites-grid[b-ew5p78mq02] {
    display: grid;
    gap: 1rem;
}

.account-favorite-salon-card[b-ew5p78mq02] {
    min-width: 0;
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: stretch;
    padding: 0.75rem;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 10%, var(--mud-palette-divider));
    border-radius: 22px;
    background: radial-gradient(circle at 94% 8%, color-mix(in srgb, var(--mud-palette-secondary) 8%, transparent), transparent 34%), color-mix(in srgb, var(--mud-palette-background) 65%, var(--mud-palette-surface));
    box-shadow: 0 12px 28px color-mix(in srgb, var(--mud-palette-primary) 6%, transparent);
}

.account-favorite-salon-media[b-ew5p78mq02] {
    position: relative;
    min-height: 145px;
    overflow: hidden;
    display: grid;
    place-items: center;
    color: #ffffff;
    font-size: 1.55rem;
    font-weight: 950;
    text-decoration: none;
    border-radius: 17px;
    background: linear-gradient(135deg, var(--mud-palette-primary), color-mix(in srgb, var(--mud-palette-primary) 70%, var(--mud-palette-secondary)));
}

    .account-favorite-salon-media img[b-ew5p78mq02] {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform 180ms ease;
    }

    .account-favorite-salon-media:hover img[b-ew5p78mq02] {
        transform: scale(1.04);
    }

.account-favorite-salon-media-overlay[b-ew5p78mq02] {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.06), rgba(15, 23, 42, 0.42));
    pointer-events: none;
}

.account-favorite-salon-founding[b-ew5p78mq02] {
    position: absolute;
    left: 0.55rem;
    top: 0.55rem;
    z-index: 2;
    max-width: calc(100% - 1.1rem);
}

.account-favorite-salon-copy[b-ew5p78mq02] {
    min-width: 0;
    display: grid;
    align-content: center;
    gap: 0.65rem;
    padding: 0.4rem 0;
}

    .account-favorite-salon-copy > div:first-child[b-ew5p78mq02] {
        min-width: 0;
        display: grid;
        gap: 0.18rem;
    }

    .account-favorite-salon-copy strong[b-ew5p78mq02] {
        color: var(--mud-palette-text-primary);
        font-size: 1.08rem;
        font-weight: 950;
        line-height: 1.2;
        overflow-wrap: anywhere;
    }

    .account-favorite-salon-copy span[b-ew5p78mq02],
    .account-favorite-salon-copy small[b-ew5p78mq02] {
        color: var(--mud-palette-text-secondary);
        font-size: 0.8rem;
        font-weight: 700;
    }

    .account-favorite-salon-copy small[b-ew5p78mq02] {
        color: var(--mud-palette-secondary);
        font-weight: 850;
    }

.account-favorite-salon-highlights[b-ew5p78mq02] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

    .account-favorite-salon-highlights span[b-ew5p78mq02] {
        display: inline-flex;
        align-items: center;
        gap: 0.3rem;
        padding: 0.4rem 0.58rem;
        color: var(--mud-palette-text-primary);
        font-size: 0.72rem;
        font-weight: 850;
        border-radius: 999px;
        background: color-mix(in srgb, var(--mud-palette-primary) 6%, var(--mud-palette-surface));
        border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 10%, var(--mud-palette-divider));
    }

.account-profile-page[b-ew5p78mq02]  .account-favorite-salon-highlights .mud-icon-root {
    color: var(--mud-palette-secondary);
}

.account-favorite-salon-actions[b-ew5p78mq02] {
    min-width: 142px;
    display: grid;
    align-content: center;
    gap: 0.45rem;
}

.account-profile-page[b-ew5p78mq02]  .account-favorite-salon-actions .mud-button-root {
    border-radius: 12px;
    font-weight: 900;
}

@media (max-width: 780px) {
    .account-favorite-salon-card[b-ew5p78mq02] {
        grid-template-columns: 145px minmax(0, 1fr);
    }

    .account-favorite-salon-actions[b-ew5p78mq02] {
        grid-column: 1 / -1;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .account-favorites-heading[b-ew5p78mq02],
    .account-favorites-empty[b-ew5p78mq02] {
        align-items: stretch;
        flex-direction: column;
    }

    .account-favorites-empty[b-ew5p78mq02],
    .account-favorite-salon-card[b-ew5p78mq02] {
        grid-template-columns: 1fr;
    }

    .account-favorite-salon-media[b-ew5p78mq02] {
        min-height: 190px;
    }

    .account-favorite-salon-actions[b-ew5p78mq02] {
        grid-column: auto;
        grid-template-columns: 1fr;
    }
}
/* /Components/Account/AccountSettingsTabs.razor.rz.scp.css */
.account-settings-tabs[b-gvz9oe0cfc] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    padding: 0.45rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 10%, var(--mud-palette-divider));
    border-radius: 16px;
    background: var(--mud-palette-surface);
    box-shadow: 0 10px 30px color-mix(in srgb, var(--mud-palette-primary) 6%, transparent);
}

    .account-settings-tabs[b-gvz9oe0cfc]  .account-settings-tab {
        min-width: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.42rem;
        min-height: 42px;
        padding: 0.58rem 0.84rem;
        color: var(--mud-palette-text-secondary);
        font-size: 0.78rem;
        font-weight: 900;
        text-decoration: none;
        border: 1px solid transparent;
        border-radius: 12px;
        transition: color 150ms ease, background 150ms ease, border-color 150ms ease, transform 150ms ease;
    }

        .account-settings-tabs[b-gvz9oe0cfc]  .account-settings-tab:hover {
            transform: translateY(-1px);
            color: var(--mud-palette-primary);
            border-color: color-mix(in srgb, var(--mud-palette-primary) 16%, var(--mud-palette-divider));
            background: color-mix(in srgb, var(--mud-palette-primary) 6%, var(--mud-palette-surface));
        }

        .account-settings-tabs[b-gvz9oe0cfc]  .account-settings-tab.active {
            color: #fff;
            border-color: var(--mud-palette-primary);
            background: linear-gradient(135deg, var(--mud-palette-primary), color-mix(in srgb, var(--mud-palette-primary) 78%, var(--mud-palette-secondary)));
            box-shadow: 0 10px 24px color-mix(in srgb, var(--mud-palette-primary) 18%, transparent);
        }

        .account-settings-tabs[b-gvz9oe0cfc]  .account-settings-tab .mud-icon-root {
            color: inherit;
        }

@media (max-width: 600px) {
    .account-settings-tabs[b-gvz9oe0cfc] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

        .account-settings-tabs[b-gvz9oe0cfc]  .account-settings-tab {
            padding-inline: 0.55rem;
            text-align: center;
        }
}
/* /Components/Auth/AuthPageShell.razor.rz.scp.css */
.bb-auth-page[b-dyavnv8i42] {
    min-height: calc(100vh - 150px);
    display: grid;
    align-items: center;
    padding: clamp(1.2rem, 4vw, 3.5rem) 0;
}

.bb-auth-shell[b-dyavnv8i42] {
    width: min(1120px, 100%);
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr);
    margin: 0 auto;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 12%, var(--mud-palette-divider));
    border-radius: 34px;
    background: var(--mud-palette-surface);
    box-shadow: 0 34px 90px color-mix(in srgb, var(--mud-palette-primary) 15%, transparent);
}

.bb-auth-story[b-dyavnv8i42] {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
    padding: clamp(2rem, 4vw, 3.4rem);
    color: #fff;
    background: radial-gradient(circle at 12% 10%, rgba(184,155,94,.34), transparent 29%), radial-gradient(circle at 92% 86%, rgba(184,155,94,.22), transparent 28%), linear-gradient(145deg, #10283c, var(--mud-palette-primary));
}

    .bb-auth-story[b-dyavnv8i42]::after {
        content: "";
        position: absolute;
        inset: 0;
        z-index: -1;
        background: repeating-linear-gradient(135deg, rgba(255,255,255,.035) 0 1px, transparent 1px 22px);
    }

.bb-auth-brand[b-dyavnv8i42] {
    width: fit-content;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    gap: 0.72rem;
    color: #fff;
    text-decoration: none;
    white-space: nowrap;
}

    .bb-auth-brand:hover[b-dyavnv8i42],
    .bb-auth-brand:focus-visible[b-dyavnv8i42] {
        color: #fff;
        text-decoration: none;
    }

.bb-auth-brand-logo[b-dyavnv8i42] {
    width: 38px;
    height: 38px;
    display: block;
    flex: 0 0 38px;
    object-fit: contain;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.bb-auth-brand-name[b-dyavnv8i42] {
    display: block;
    flex: 0 0 auto;
    color: #fff;
    font-size: 1.26rem;
    font-weight: 850;
    line-height: 1;
    letter-spacing: -0.025em;
}

.bb-auth-market-pill[b-dyavnv8i42] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    padding: .48rem .72rem;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 999px;
    background: rgba(255,255,255,.09);
    font-size: .7rem;
    font-weight: 900;
    letter-spacing: .07em;
    text-transform: uppercase;
}

    .bb-auth-market-pill img[b-dyavnv8i42] {
        width: 22px;
        height: 16px;
        object-fit: cover;
        border-radius: 3px;
    }

.bb-auth-story[b-dyavnv8i42]  .bb-auth-story-title {
    color: #fff;
    font-weight: 950;
    line-height: 1.05;
    letter-spacing: -.045em;
}

.bb-auth-story[b-dyavnv8i42]  .bb-auth-story-copy {
    color: rgba(255,255,255,.78);
    line-height: 1.7;
    font-weight: 600;
}

.bb-auth-aside-content[b-dyavnv8i42] {
    margin-top: auto;
}

.bb-auth-story[b-dyavnv8i42]  .bb-auth-benefits {
    display: grid;
    gap: .65rem;
}

.bb-auth-story[b-dyavnv8i42]  .bb-auth-benefit {
    display: grid;
    grid-template-columns: 38px 1fr;
    gap: .7rem;
    align-items: center;
    padding: .72rem;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 16px;
    background: rgba(255,255,255,.07);
}

.bb-auth-story[b-dyavnv8i42]  .bb-auth-benefit-icon {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    color: #15324B;
    background: #B89B5E;
}

.bb-auth-story[b-dyavnv8i42]  .bb-auth-benefit strong {
    display: block;
    color: #fff;
    font-size: .84rem;
    font-weight: 900;
}

.bb-auth-story[b-dyavnv8i42]  .bb-auth-benefit small {
    color: rgba(255,255,255,.68);
    font-size: .72rem;
    line-height: 1.35;
}

.bb-auth-card[b-dyavnv8i42] {
    display: grid;
    align-content: center;
    gap: 1.15rem;
    padding: clamp(1.5rem,4vw,3.4rem);
    background: radial-gradient(circle at 92% 8%, color-mix(in srgb, var(--mud-palette-secondary) 10%, transparent), transparent 26%), var(--mud-palette-surface);
}

.bb-auth-card-icon[b-dyavnv8i42] {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    color: var(--mud-palette-primary);
    border-radius: 19px;
    background: #EFE2C6;
    box-shadow: 0 14px 30px color-mix(in srgb, var(--mud-palette-secondary) 18%, transparent);
}

.bb-auth-heading[b-dyavnv8i42] {
    display: grid;
    gap: .35rem;
}

    .bb-auth-heading > span[b-dyavnv8i42] {
        color: var(--mud-palette-secondary);
        font-size: .7rem;
        font-weight: 950;
        letter-spacing: .1em;
        text-transform: uppercase;
    }

.bb-auth-card[b-dyavnv8i42]  .bb-auth-title {
    color: var(--mud-palette-primary);
    font-weight: 950;
    letter-spacing: -.04em;
}

.bb-auth-card[b-dyavnv8i42]  .bb-auth-subtitle {
    color: var(--mud-palette-text-secondary);
    line-height: 1.6;
}

.bb-auth-content[b-dyavnv8i42] {
    min-width: 0;
}

.bb-auth-card[b-dyavnv8i42]  .bb-auth-form {
    display: grid;
    gap: 1rem;
}

.bb-auth-card[b-dyavnv8i42]  .bb-auth-field .mud-input-outlined-border {
    border-radius: 14px;
    border-color: color-mix(in srgb, var(--mud-palette-primary) 13%, var(--mud-palette-divider));
}

.bb-auth-card[b-dyavnv8i42]  .bb-auth-field .mud-input-label {
    font-weight: 750;
}

.bb-auth-card[b-dyavnv8i42]  .bb-auth-primary-button {
    min-height: 50px;
    border-radius: 14px;
    font-weight: 950;
    box-shadow: 0 16px 34px color-mix(in srgb, var(--mud-palette-primary) 20%, transparent);
}

.bb-auth-card[b-dyavnv8i42]  .bb-auth-alert {
    border-radius: 15px;
}

.bb-auth-card[b-dyavnv8i42]  .bb-auth-footer {
    color: var(--mud-palette-text-secondary);
    text-align: center;
    font-size: .85rem;
}

@media (max-width: 900px) {
    .bb-auth-shell[b-dyavnv8i42] {
        grid-template-columns: 1fr;
    }

    .bb-auth-story[b-dyavnv8i42] {
        padding: 1.5rem;
    }

    .bb-auth-aside-content[b-dyavnv8i42] {
        margin-top: .35rem;
    }
}

@media (max-width: 600px) {
    .bb-auth-page[b-dyavnv8i42] {
        padding: .7rem 0 2rem;
    }

    .bb-auth-shell[b-dyavnv8i42] {
        border-radius: 22px;
    }

    .bb-auth-card[b-dyavnv8i42] {
        padding: 1.25rem;
    }
}

/* ========================================================================== */
/* AUTH STORY VISUALS                                                         */
/* ========================================================================== */

.bb-auth-visual[b-dyavnv8i42] {
    position: relative;
    isolation: isolate;
    min-height: 220px;
    display: grid;
    place-items: center;
    margin: 0.15rem 0 0.3rem;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 26px;
    background: radial-gradient(circle at 50% 48%, rgba(255,255,255,.1), transparent 54%), rgba(255,255,255,.035);
}

    .bb-auth-visual[b-dyavnv8i42]::before,
    .bb-auth-visual[b-dyavnv8i42]::after {
        content: "";
        position: absolute;
        z-index: -1;
        border-radius: 999px;
        pointer-events: none;
    }

    .bb-auth-visual[b-dyavnv8i42]::before {
        top: -72px;
        right: -62px;
        width: 180px;
        height: 180px;
        background: rgba(184,155,94,.14);
        filter: blur(2px);
    }

    .bb-auth-visual[b-dyavnv8i42]::after {
        left: -70px;
        bottom: -90px;
        width: 210px;
        height: 210px;
        background: rgba(255,255,255,.055);
    }

.bb-auth-visual-spark[b-dyavnv8i42] {
    position: absolute;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(255,255,255,.82);
    box-shadow: 0 0 14px rgba(255,255,255,.5);
    animation: bb-auth-spark-pulse-b-dyavnv8i42 3.4s ease-in-out infinite;
}

.bb-auth-visual-spark-one[b-dyavnv8i42] {
    top: 22%;
    left: 18%;
}

.bb-auth-visual-spark-two[b-dyavnv8i42] {
    top: 28%;
    right: 17%;
    width: 4px;
    height: 4px;
    animation-delay: -1.1s;
}

.bb-auth-visual-spark-three[b-dyavnv8i42] {
    right: 24%;
    bottom: 17%;
    width: 8px;
    height: 8px;
    background: #B89B5E;
    box-shadow: 0 0 18px rgba(184,155,94,.7);
    animation-delay: -2.2s;
}

/* LOGIN — SECURE ACCOUNT GATEWAY */

.bb-auth-login-visual[b-dyavnv8i42] {
    min-height: 232px;
}

.bb-auth-login-card[b-dyavnv8i42] {
    position: relative;
    z-index: 4;
    width: min(230px, calc(100% - 72px));
    display: grid;
    gap: 0.85rem;
    padding: 1rem;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 22px;
    background: linear-gradient(145deg, rgba(255,255,255,.17), rgba(255,255,255,.075));
    box-shadow: 0 24px 50px rgba(0,0,0,.22);
    backdrop-filter: blur(16px);
    animation: bb-auth-card-float-b-dyavnv8i42 5.4s ease-in-out infinite;
}

.bb-auth-login-scan[b-dyavnv8i42] {
    position: absolute;
    top: -38%;
    left: -55%;
    width: 42%;
    height: 180%;
    opacity: .55;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.32), transparent);
    transform: rotate(16deg);
    animation: bb-auth-login-scan-b-dyavnv8i42 5.8s ease-in-out infinite;
}

.bb-auth-login-card-heading[b-dyavnv8i42],
.bb-auth-login-access-row[b-dyavnv8i42] {
    position: relative;
    z-index: 2;
    display: grid;
    align-items: center;
}

.bb-auth-login-card-heading[b-dyavnv8i42] {
    grid-template-columns: 42px minmax(0,1fr) auto;
    gap: 0.65rem;
}

.bb-auth-login-avatar[b-dyavnv8i42],
.bb-auth-login-lock[b-dyavnv8i42] {
    display: grid;
    place-items: center;
    color: #15324B;
    background: #EFE2C6;
}

.bb-auth-login-avatar[b-dyavnv8i42] {
    width: 42px;
    height: 42px;
    border-radius: 14px;
}

.bb-auth-login-lock[b-dyavnv8i42] {
    width: 38px;
    height: 38px;
    border-radius: 13px;
    background: #B89B5E;
}

.bb-auth-login-card-heading div[b-dyavnv8i42],
.bb-auth-login-access-row div[b-dyavnv8i42] {
    min-width: 0;
    display: grid;
    gap: 0.12rem;
}

.bb-auth-login-card small[b-dyavnv8i42] {
    color: rgba(255,255,255,.64);
    font-size: .62rem;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: .055em;
    text-transform: uppercase;
}

.bb-auth-login-card strong[b-dyavnv8i42] {
    color: #fff;
    font-size: .78rem;
    font-weight: 950;
    line-height: 1.2;
}

.bb-auth-login-status[b-dyavnv8i42] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #62D09B;
    box-shadow: 0 0 0 5px rgba(98,208,155,.14), 0 0 16px rgba(98,208,155,.58);
    animation: bb-auth-status-pulse-b-dyavnv8i42 2.2s ease-in-out infinite;
}

.bb-auth-login-access-row[b-dyavnv8i42] {
    grid-template-columns: 38px minmax(0,1fr);
    gap: .65rem;
    padding: .68rem;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 15px;
    background: rgba(9,29,45,.26);
}

.bb-auth-login-orbit[b-dyavnv8i42] {
    position: absolute;
    z-index: 2;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 50%;
    pointer-events: none;
}

.bb-auth-login-orbit-outer[b-dyavnv8i42] {
    width: 286px;
    height: 188px;
    transform: rotate(-11deg);
    animation: bb-auth-login-orbit-b-dyavnv8i42 16s linear infinite;
}

.bb-auth-login-orbit-inner[b-dyavnv8i42] {
    width: 214px;
    height: 146px;
    border-style: dashed;
    opacity: .78;
    transform: rotate(12deg);
    animation: bb-auth-login-orbit-b-dyavnv8i42 11s linear infinite reverse;
}

.bb-auth-login-orbit-chip[b-dyavnv8i42] {
    position: absolute;
    display: grid;
    place-items: center;
    color: #15324B;
    border: 1px solid rgba(255,255,255,.3);
    background: #EFE2C6;
    box-shadow: 0 12px 26px rgba(0,0,0,.2);
}

.bb-auth-login-calendar-chip[b-dyavnv8i42] {
    top: 19px;
    right: 16px;
    width: 34px;
    height: 34px;
    border-radius: 12px;
}

.bb-auth-login-shield-chip[b-dyavnv8i42] {
    left: -12px;
    bottom: 27px;
    width: 30px;
    height: 30px;
    border-radius: 10px;
    background: #B89B5E;
}

.bb-auth-login-visual[b-dyavnv8i42]  .mud-icon-root {
    color: currentColor !important;
    font-size: 1.05rem;
}

/* CUSTOMER REGISTRATION — BOOKING JOURNEY */

.bb-auth-customer-visual[b-dyavnv8i42] {
    min-height: 238px;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: .45rem;
    padding: 1.4rem 1rem;
}

.bb-auth-journey-track[b-dyavnv8i42] {
    position: absolute;
    top: 50%;
    left: 13%;
    right: 13%;
    height: 4px;
    transform: translateY(-50%);
}

.bb-auth-journey-line[b-dyavnv8i42],
.bb-auth-journey-progress[b-dyavnv8i42] {
    position: absolute;
    inset: 0;
    border-radius: 999px;
}

.bb-auth-journey-line[b-dyavnv8i42] {
    background: rgba(255,255,255,.14);
}

.bb-auth-journey-progress[b-dyavnv8i42] {
    right: auto;
    width: 100%;
    transform: scaleX(0);
    transform-origin: left center;
    background: linear-gradient(90deg, rgba(184,155,94,.5), #B89B5E);
    box-shadow: 0 0 16px rgba(184,155,94,.48);
    will-change: transform, opacity;
    backface-visibility: hidden;
    animation: bb-auth-journey-progress-b-dyavnv8i42 10.8s linear infinite;
}

.bb-auth-journey-traveller[b-dyavnv8i42] {
    position: absolute;
    top: 50%;
    left: 0;
    width: 11px;
    height: 11px;
    border: 2px solid rgba(255,255,255,.72);
    border-radius: 50%;
    background: #B89B5E;
    box-shadow: 0 0 0 6px rgba(184,155,94,.14), 0 0 18px rgba(184,155,94,.66);
    transform: translate(-50%,-50%) translateZ(0);
    will-change: left, opacity, transform;
    backface-visibility: hidden;
    animation: bb-auth-journey-travel-b-dyavnv8i42 10.8s linear infinite;
}

.bb-auth-journey-node[b-dyavnv8i42] {
    position: relative;
    z-index: 2;
    min-width: 0;
    min-height: 118px;
    display: grid;
    justify-items: center;
    align-content: center;
    gap: .36rem;
    padding: .72rem .45rem;
    text-align: center;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 18px;
    background: linear-gradient(145deg, rgba(255,255,255,.15), rgba(255,255,255,.065));
    box-shadow: 0 18px 38px rgba(0,0,0,.15);
    backdrop-filter: blur(12px);
    transform: translateZ(0);
    will-change: transform, border-color, box-shadow, background;
    backface-visibility: hidden;
}

.bb-auth-journey-salon[b-dyavnv8i42] {
    animation: bb-auth-journey-salon-node-b-dyavnv8i42 10.8s linear infinite;
}

.bb-auth-journey-calendar[b-dyavnv8i42] {
    animation: bb-auth-journey-calendar-node-b-dyavnv8i42 10.8s linear infinite;
}

.bb-auth-journey-confirmed[b-dyavnv8i42] {
    animation: bb-auth-journey-confirmed-node-b-dyavnv8i42 10.8s linear infinite;
}

.bb-auth-journey-node-icon[b-dyavnv8i42] {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    color: #15324B;
    border-radius: 13px;
    background: #EFE2C6;
}

.bb-auth-journey-confirmed .bb-auth-journey-node-icon[b-dyavnv8i42] {
    color: #0E6848;
    background: #CFF4E3;
}

.bb-auth-journey-node strong[b-dyavnv8i42] {
    color: #fff;
    font-size: .7rem;
    font-weight: 950;
    line-height: 1.2;
}

.bb-auth-journey-node small[b-dyavnv8i42] {
    color: rgba(255,255,255,.66);
    font-size: .62rem;
    font-weight: 750;
    line-height: 1.2;
}

.bb-auth-journey-date[b-dyavnv8i42] {
    min-width: 28px;
    min-height: 23px;
    display: grid;
    place-items: center;
    color: #15324B;
    font-size: .7rem;
    font-weight: 950;
    border-radius: 8px;
    background: #B89B5E;
    will-change: transform, box-shadow;
    animation: bb-auth-date-pulse-b-dyavnv8i42 3.6s cubic-bezier(.4,0,.2,1) infinite;
}

.bb-auth-customer-visual[b-dyavnv8i42]  .mud-icon-root {
    color: currentColor !important;
    font-size: 1.1rem;
}

/* SALON OWNER REGISTRATION — BUILD THE PROFILE */

.bb-auth-owner-visual[b-dyavnv8i42] {
    min-height: 250px;
}

.bb-auth-owner-profile-card[b-dyavnv8i42] {
    position: relative;
    z-index: 3;
    width: min(294px, calc(100% - 54px));
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 22px;
    background: linear-gradient(145deg, rgba(255,255,255,.16), rgba(255,255,255,.07));
    box-shadow: 0 24px 52px rgba(0,0,0,.22);
    backdrop-filter: blur(15px);
    animation: bb-auth-owner-card-reveal-b-dyavnv8i42 7s ease-in-out infinite;
}

.bb-auth-owner-cover[b-dyavnv8i42] {
    position: relative;
    height: 66px;
    overflow: hidden;
    background: linear-gradient(135deg, rgba(184,155,94,.72), rgba(255,255,255,.11)), linear-gradient(145deg, #183D59, #10283C);
}

    .bb-auth-owner-cover[b-dyavnv8i42]::before,
    .bb-auth-owner-cover[b-dyavnv8i42]::after {
        content: "";
        position: absolute;
        bottom: -15px;
        width: 76px;
        height: 48px;
        border-radius: 50% 50% 0 0;
        background: rgba(255,255,255,.12);
    }

    .bb-auth-owner-cover[b-dyavnv8i42]::before {
        left: 22px;
    }

    .bb-auth-owner-cover[b-dyavnv8i42]::after {
        right: 28px;
        width: 58px;
        height: 39px;
    }

.bb-auth-owner-cover-glow[b-dyavnv8i42] {
    position: absolute;
    top: -62px;
    left: -30%;
    width: 34%;
    height: 180px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.28), transparent);
    transform: rotate(18deg);
    animation: bb-auth-owner-cover-shine-b-dyavnv8i42 6.8s ease-in-out infinite;
}

.bb-auth-owner-profile-heading[b-dyavnv8i42] {
    display: grid;
    grid-template-columns: 46px minmax(0,1fr) auto;
    gap: .62rem;
    align-items: center;
    padding: .78rem .86rem .62rem;
}

.bb-auth-owner-avatar[b-dyavnv8i42] {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    margin-top: -29px;
    color: #15324B;
    border: 3px solid rgba(255,255,255,.84);
    border-radius: 50%;
    background: #EFE2C6;
    box-shadow: 0 8px 18px rgba(0,0,0,.2);
    animation: bb-auth-owner-part-arrive-b-dyavnv8i42 7s ease-in-out infinite;
}

.bb-auth-owner-profile-heading div[b-dyavnv8i42] {
    min-width: 0;
    display: grid;
    gap: .1rem;
}

.bb-auth-owner-profile-heading small[b-dyavnv8i42] {
    color: rgba(255,255,255,.62);
    font-size: .58rem;
    font-weight: 850;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.bb-auth-owner-profile-heading strong[b-dyavnv8i42] {
    overflow: hidden;
    color: #fff;
    font-size: .76rem;
    font-weight: 950;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bb-auth-owner-live-badge[b-dyavnv8i42] {
    padding: .34rem .46rem;
    color: #15324B;
    font-size: .55rem;
    font-weight: 950;
    line-height: 1;
    border-radius: 999px;
    background: #B89B5E;
    animation: bb-auth-owner-badge-pop-b-dyavnv8i42 7s ease-in-out infinite;
}

.bb-auth-owner-service-row[b-dyavnv8i42] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: .4rem;
    padding: 0 .72rem .78rem;
}

    .bb-auth-owner-service-row span[b-dyavnv8i42] {
        min-width: 0;
        display: grid;
        justify-items: center;
        gap: .25rem;
        padding: .5rem .25rem;
        color: rgba(255,255,255,.76);
        font-size: .56rem;
        font-weight: 850;
        line-height: 1.15;
        text-align: center;
        border: 1px solid rgba(255,255,255,.1);
        border-radius: 11px;
        background: rgba(5,24,38,.22);
        animation: bb-auth-owner-service-arrive-b-dyavnv8i42 7s ease-in-out infinite;
    }

        .bb-auth-owner-service-row span:nth-child(2)[b-dyavnv8i42] {
            animation-delay: .18s;
        }

        .bb-auth-owner-service-row span:nth-child(3)[b-dyavnv8i42] {
            animation-delay: .36s;
        }

.bb-auth-owner-build-step[b-dyavnv8i42] {
    position: absolute;
    z-index: 5;
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    color: #15324B;
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 12px;
    background: #EFE2C6;
    box-shadow: 0 14px 28px rgba(0,0,0,.2);
    animation: bb-auth-owner-step-float-b-dyavnv8i42 4.5s ease-in-out infinite;
}

.bb-auth-owner-build-step-one[b-dyavnv8i42] {
    top: 25px;
    left: 22px;
}

.bb-auth-owner-build-step-two[b-dyavnv8i42] {
    right: 20px;
    bottom: 28px;
    animation-delay: -1.5s;
}

.bb-auth-owner-build-step-three[b-dyavnv8i42] {
    top: 33px;
    right: 25px;
    color: #0E6848;
    background: #CFF4E3;
    animation-delay: -3s;
}

.bb-auth-owner-visual[b-dyavnv8i42]  .mud-icon-root {
    color: currentColor !important;
    font-size: 1rem;
}

.bb-auth-owner-service-row[b-dyavnv8i42]  .mud-icon-root {
    color: #B89B5E !important;
    font-size: .95rem;
}

/* BECOME OWNER — ONE ACCOUNT, TWO ROLES */

.bb-auth-role-visual[b-dyavnv8i42] {
    min-height: 232px;
    grid-template-columns: minmax(0,1fr) auto minmax(0,1fr);
    gap: .55rem;
    padding: 1.35rem 1rem 3.75rem;
}

.bb-auth-role-card[b-dyavnv8i42] {
    position: relative;
    z-index: 2;
    width: 100%;
    min-height: 116px;
    display: grid;
    justify-items: center;
    align-content: center;
    gap: .3rem;
    padding: .72rem .45rem;
    text-align: center;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 19px;
    background: linear-gradient(145deg, rgba(255,255,255,.15), rgba(255,255,255,.065));
    box-shadow: 0 18px 38px rgba(0,0,0,.16);
    backdrop-filter: blur(12px);
}

.bb-auth-role-customer-card[b-dyavnv8i42] {
    animation: bb-auth-role-customer-b-dyavnv8i42 6s ease-in-out infinite;
}

.bb-auth-role-owner-card[b-dyavnv8i42] {
    animation: bb-auth-role-owner-b-dyavnv8i42 6s ease-in-out infinite;
}

.bb-auth-role-card-icon[b-dyavnv8i42] {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    color: #15324B;
    border-radius: 14px;
    background: #EFE2C6;
}

.bb-auth-role-owner-card .bb-auth-role-card-icon[b-dyavnv8i42] {
    background: #B89B5E;
}

.bb-auth-role-card small[b-dyavnv8i42] {
    color: rgba(255,255,255,.62);
    font-size: .58rem;
    font-weight: 850;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.bb-auth-role-card strong[b-dyavnv8i42] {
    color: #fff;
    font-size: .7rem;
    font-weight: 950;
    line-height: 1.25;
}

.bb-auth-role-link[b-dyavnv8i42] {
    position: relative;
    z-index: 4;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    color: #15324B;
    border-radius: 50%;
    background: #B89B5E;
    box-shadow: 0 0 0 7px rgba(184,155,94,.14), 0 14px 28px rgba(0,0,0,.18);
    animation: bb-auth-role-link-pulse-b-dyavnv8i42 2.6s ease-in-out infinite;
}

.bb-auth-role-account-pill[b-dyavnv8i42] {
    position: absolute;
    z-index: 5;
    left: 50%;
    bottom: 18px;
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .58rem .72rem;
    color: #15324B;
    font-size: .65rem;
    font-weight: 950;
    line-height: 1;
    white-space: nowrap;
    border: 1px solid rgba(255,255,255,.42);
    border-radius: 999px;
    background: #EFE2C6;
    box-shadow: 0 14px 30px rgba(0,0,0,.18);
    transform: translateX(-50%);
    animation: bb-auth-role-pill-arrive-b-dyavnv8i42 6s ease-in-out infinite;
}

.bb-auth-role-visual[b-dyavnv8i42]  .mud-icon-root {
    color: currentColor !important;
    font-size: 1.08rem;
}

/* ========================================================================== */
/* AUTH STORY VISUAL ANIMATIONS                                               */
/* ========================================================================== */

@keyframes bb-auth-card-float-b-dyavnv8i42 {
    0%, 100% {
        transform: translateY(0) rotate(-1deg);
    }

    50% {
        transform: translateY(-7px) rotate(1deg);
    }
}

@keyframes bb-auth-login-scan-b-dyavnv8i42 {
    0%, 20% {
        left: -55%;
        opacity: 0;
    }

    38% {
        opacity: .55;
    }

    58%, 100% {
        left: 125%;
        opacity: 0;
    }
}

@keyframes bb-auth-status-pulse-b-dyavnv8i42 {
    0%, 100% {
        transform: scale(1);
        opacity: .85;
    }

    50% {
        transform: scale(1.18);
        opacity: 1;
    }
}

@keyframes bb-auth-login-orbit-b-dyavnv8i42 {
    from {
        rotate: 0deg;
    }

    to {
        rotate: 360deg;
    }
}

@keyframes bb-auth-spark-pulse-b-dyavnv8i42 {
    0%, 100% {
        opacity: .28;
        transform: scale(.75);
    }

    50% {
        opacity: 1;
        transform: scale(1.22);
    }
}

@keyframes bb-auth-journey-progress-b-dyavnv8i42 {
    0%, 20% {
        opacity: .72;
        transform: scaleX(0);
    }

    38%, 52% {
        opacity: 1;
        transform: scaleX(.5);
    }

    70%, 92% {
        opacity: 1;
        transform: scaleX(1);
    }

    97%, 100% {
        opacity: 0;
        transform: scaleX(1);
    }
}

@keyframes bb-auth-journey-travel-b-dyavnv8i42 {
    0% {
        left: 0;
        opacity: 0;
        transform: translate(-50%,-50%) scale(.82) translateZ(0);
    }

    5%, 20% {
        left: 0;
        opacity: 1;
        transform: translate(-50%,-50%) scale(1) translateZ(0);
    }

    38%, 52% {
        left: 50%;
        opacity: 1;
        transform: translate(-50%,-50%) scale(1) translateZ(0);
    }

    70%, 92% {
        left: 100%;
        opacity: 1;
        transform: translate(-50%,-50%) scale(1) translateZ(0);
    }

    97% {
        left: 100%;
        opacity: 0;
        transform: translate(-50%,-50%) scale(.82) translateZ(0);
    }

    100% {
        left: 0;
        opacity: 0;
        transform: translate(-50%,-50%) scale(.82) translateZ(0);
    }
}

@keyframes bb-auth-journey-salon-node-b-dyavnv8i42 {
    0%, 4%, 20% {
        transform: translateY(-5px) scale(1.018) translateZ(0);
        border-color: rgba(184,155,94,.56);
        background: linear-gradient(145deg, rgba(255,255,255,.19), rgba(255,255,255,.085));
        box-shadow: 0 22px 44px rgba(0,0,0,.2), 0 0 0 1px rgba(184,155,94,.08);
    }

    29%, 100% {
        transform: translateY(0) scale(1) translateZ(0);
        border-color: rgba(255,255,255,.14);
        background: linear-gradient(145deg, rgba(255,255,255,.15), rgba(255,255,255,.065));
        box-shadow: 0 18px 38px rgba(0,0,0,.15);
    }
}

@keyframes bb-auth-journey-calendar-node-b-dyavnv8i42 {
    0%, 27% {
        transform: translateY(0) scale(1) translateZ(0);
        border-color: rgba(255,255,255,.14);
        background: linear-gradient(145deg, rgba(255,255,255,.15), rgba(255,255,255,.065));
        box-shadow: 0 18px 38px rgba(0,0,0,.15);
    }

    37%, 52% {
        transform: translateY(-5px) scale(1.018) translateZ(0);
        border-color: rgba(184,155,94,.56);
        background: linear-gradient(145deg, rgba(255,255,255,.19), rgba(255,255,255,.085));
        box-shadow: 0 22px 44px rgba(0,0,0,.2), 0 0 0 1px rgba(184,155,94,.08);
    }

    61%, 100% {
        transform: translateY(0) scale(1) translateZ(0);
        border-color: rgba(255,255,255,.14);
        background: linear-gradient(145deg, rgba(255,255,255,.15), rgba(255,255,255,.065));
        box-shadow: 0 18px 38px rgba(0,0,0,.15);
    }
}

@keyframes bb-auth-journey-confirmed-node-b-dyavnv8i42 {
    0%, 59% {
        transform: translateY(0) scale(1) translateZ(0);
        border-color: rgba(255,255,255,.14);
        background: linear-gradient(145deg, rgba(255,255,255,.15), rgba(255,255,255,.065));
        box-shadow: 0 18px 38px rgba(0,0,0,.15);
    }

    69%, 90% {
        transform: translateY(-5px) scale(1.018) translateZ(0);
        border-color: rgba(207,244,227,.5);
        background: linear-gradient(145deg, rgba(207,244,227,.18), rgba(255,255,255,.08));
        box-shadow: 0 22px 44px rgba(0,0,0,.2), 0 0 24px rgba(207,244,227,.08);
    }

    98%, 100% {
        transform: translateY(0) scale(1) translateZ(0);
        border-color: rgba(255,255,255,.14);
        background: linear-gradient(145deg, rgba(255,255,255,.15), rgba(255,255,255,.065));
        box-shadow: 0 18px 38px rgba(0,0,0,.15);
    }
}

@keyframes bb-auth-date-pulse-b-dyavnv8i42 {
    0%, 100% {
        transform: scale(1) translateZ(0);
        box-shadow: 0 0 0 0 rgba(184,155,94,0);
    }

    50% {
        transform: scale(1.045) translateZ(0);
        box-shadow: 0 0 0 4px rgba(184,155,94,.09);
    }
}

@keyframes bb-auth-owner-card-reveal-b-dyavnv8i42 {
    0%, 8% {
        transform: translateY(9px) scale(.975);
        opacity: .78;
    }

    22%, 82% {
        transform: translateY(0) scale(1);
        opacity: 1;
    }

    100% {
        transform: translateY(9px) scale(.975);
        opacity: .78;
    }
}

@keyframes bb-auth-owner-cover-shine-b-dyavnv8i42 {
    0%, 18% {
        left: -30%;
        opacity: 0;
    }

    36% {
        opacity: .65;
    }

    54%, 100% {
        left: 125%;
        opacity: 0;
    }
}

@keyframes bb-auth-owner-part-arrive-b-dyavnv8i42 {
    0%, 12% {
        transform: scale(.72);
        opacity: .2;
    }

    28%, 88% {
        transform: scale(1);
        opacity: 1;
    }

    100% {
        transform: scale(.72);
        opacity: .2;
    }
}

@keyframes bb-auth-owner-badge-pop-b-dyavnv8i42 {
    0%, 40% {
        transform: scale(.7);
        opacity: 0;
    }

    54%, 88% {
        transform: scale(1);
        opacity: 1;
    }

    100% {
        transform: scale(.7);
        opacity: 0;
    }
}

@keyframes bb-auth-owner-service-arrive-b-dyavnv8i42 {
    0%, 26% {
        transform: translateY(8px);
        opacity: .1;
    }

    44%, 88% {
        transform: translateY(0);
        opacity: 1;
    }

    100% {
        transform: translateY(8px);
        opacity: .1;
    }
}

@keyframes bb-auth-owner-step-float-b-dyavnv8i42 {
    0%, 100% {
        transform: translateY(0) rotate(-4deg);
    }

    50% {
        transform: translateY(-8px) rotate(4deg);
    }
}

@keyframes bb-auth-role-customer-b-dyavnv8i42 {
    0%, 100% {
        transform: translateX(0) rotate(-1deg);
    }

    50% {
        transform: translateX(6px) rotate(1deg);
    }
}

@keyframes bb-auth-role-owner-b-dyavnv8i42 {
    0%, 100% {
        transform: translateX(0) rotate(1deg);
    }

    50% {
        transform: translateX(-6px) rotate(-1deg);
    }
}

@keyframes bb-auth-role-link-pulse-b-dyavnv8i42 {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 0 0 7px rgba(184,155,94,.14), 0 14px 28px rgba(0,0,0,.18);
    }

    50% {
        transform: scale(1.12);
        box-shadow: 0 0 0 12px rgba(184,155,94,.07), 0 16px 32px rgba(0,0,0,.2);
    }
}

@keyframes bb-auth-role-pill-arrive-b-dyavnv8i42 {
    0%, 24% {
        transform: translate(-50%,9px) scale(.88);
        opacity: 0;
    }

    42%, 88% {
        transform: translate(-50%,0) scale(1);
        opacity: 1;
    }

    100% {
        transform: translate(-50%,9px) scale(.88);
        opacity: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .bb-auth-visual *[b-dyavnv8i42],
    .bb-auth-visual *[b-dyavnv8i42]::before,
    .bb-auth-visual *[b-dyavnv8i42]::after {
        animation: none !important;
        transition: none !important;
    }
}

@media (max-width: 900px) {
    .bb-auth-visual[b-dyavnv8i42] {
        min-height: 205px;
    }

    .bb-auth-login-visual[b-dyavnv8i42],
    .bb-auth-role-visual[b-dyavnv8i42] {
        min-height: 215px;
    }

    .bb-auth-owner-visual[b-dyavnv8i42] {
        min-height: 230px;
    }
}

@media (max-width: 600px) {
    .bb-auth-visual[b-dyavnv8i42] {
        min-height: 190px;
        margin-top: 0;
        border-radius: 20px;
    }

    .bb-auth-login-visual[b-dyavnv8i42] {
        min-height: 205px;
    }

    .bb-auth-login-card[b-dyavnv8i42] {
        width: min(210px, calc(100% - 54px));
    }

    .bb-auth-login-orbit-outer[b-dyavnv8i42] {
        width: 250px;
        height: 166px;
    }

    .bb-auth-login-orbit-inner[b-dyavnv8i42] {
        width: 190px;
        height: 128px;
    }

    .bb-auth-customer-visual[b-dyavnv8i42] {
        min-height: 210px;
        gap: .32rem;
        padding-inline: .65rem;
    }

    .bb-auth-journey-node[b-dyavnv8i42] {
        min-height: 106px;
        padding-inline: .25rem;
        border-radius: 15px;
    }

        .bb-auth-journey-node strong[b-dyavnv8i42] {
            font-size: .62rem;
        }

        .bb-auth-journey-node small[b-dyavnv8i42] {
            font-size: .55rem;
        }

    .bb-auth-owner-visual[b-dyavnv8i42] {
        min-height: 220px;
    }

    .bb-auth-owner-profile-card[b-dyavnv8i42] {
        width: min(270px, calc(100% - 34px));
    }

    .bb-auth-owner-build-step-one[b-dyavnv8i42] {
        left: 8px;
    }

    .bb-auth-owner-build-step-two[b-dyavnv8i42] {
        right: 8px;
    }

    .bb-auth-owner-build-step-three[b-dyavnv8i42] {
        right: 12px;
    }

    .bb-auth-role-visual[b-dyavnv8i42] {
        min-height: 205px;
        gap: .35rem;
        padding-inline: .65rem;
    }

    .bb-auth-role-card[b-dyavnv8i42] {
        min-height: 105px;
    }

        .bb-auth-role-card strong[b-dyavnv8i42] {
            font-size: .62rem;
        }

    .bb-auth-role-link[b-dyavnv8i42] {
        width: 34px;
        height: 34px;
    }
}

@media (max-width: 390px) {
    .bb-auth-login-card[b-dyavnv8i42] {
        width: min(198px, calc(100% - 44px));
        padding: .82rem;
    }

    .bb-auth-login-orbit-outer[b-dyavnv8i42] {
        width: 226px;
    }

    .bb-auth-customer-visual[b-dyavnv8i42] {
        padding-inline: .4rem;
    }

    .bb-auth-journey-node-icon[b-dyavnv8i42] {
        width: 35px;
        height: 35px;
    }

    .bb-auth-owner-service-row span[b-dyavnv8i42] {
        font-size: .5rem;
    }

    .bb-auth-role-card[b-dyavnv8i42] {
        padding-inline: .22rem;
    }
}
/* /Components/Auth/BecomeSalonOwner.razor.rz.scp.css */
.bb-become-owner-loading[b-s3h3mz8ohx] {
    min-height: calc(100vh - 160px);
    display: grid;
    place-items: center;
    align-content: center;
    gap: 1rem;
    color: var(--mud-palette-primary);
}

.bb-become-owner-content[b-s3h3mz8ohx] {
    display: grid;
    gap: 1rem;
}

.bb-become-owner-info[b-s3h3mz8ohx] {
    border-radius: 16px;
}

.bb-become-owner-info-copy[b-s3h3mz8ohx] {
    display: grid;
    gap: 0.22rem;
}

    .bb-become-owner-info-copy strong[b-s3h3mz8ohx] {
        color: var(--mud-palette-primary);
        font-size: 0.88rem;
        font-weight: 950;
    }

    .bb-become-owner-info-copy span[b-s3h3mz8ohx] {
        color: var(--mud-palette-text-secondary);
        font-size: 0.8rem;
        line-height: 1.55;
    }

.bb-become-owner-meaning[b-s3h3mz8ohx] {
    display: grid;
    gap: 0.65rem;
    padding: 1rem;
    border: 1px solid color-mix( in srgb, var(--mud-palette-primary) 11%, var(--mud-palette-divider));
    border-radius: 18px;
    background: radial-gradient( circle at 94% 8%, color-mix( in srgb, var(--mud-palette-secondary) 11%, transparent), transparent 34%), color-mix( in srgb, var(--mud-palette-primary) 4%, var(--mud-palette-surface));
}

.bb-become-owner-section-heading[b-s3h3mz8ohx] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    margin-bottom: 0.15rem;
}

.bb-become-owner-section-icon[b-s3h3mz8ohx] {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    flex: 0 0 38px;
    color: #ffffff;
    border-radius: 13px;
    background: linear-gradient( 135deg, var(--mud-palette-primary), var(--mud-palette-secondary));
}

    .bb-become-owner-section-icon[b-s3h3mz8ohx]  .mud-icon-root {
        color: #ffffff !important;
        font-size: 1.05rem;
    }

.bb-become-owner-section-heading strong[b-s3h3mz8ohx] {
    color: var(--mud-palette-primary);
    font-size: 0.94rem;
    font-weight: 950;
}

.bb-become-owner-point[b-s3h3mz8ohx] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.55rem;
    align-items: flex-start;
    color: var(--mud-palette-text-secondary);
    font-size: 0.8rem;
    line-height: 1.5;
}

    .bb-become-owner-point[b-s3h3mz8ohx]  .mud-icon-root {
        margin-top: 0.12rem;
        color: var(--mud-palette-success);
        font-size: 1rem;
    }

.bb-become-owner-form[b-s3h3mz8ohx] {
    width: 100%;
}

@media (max-width: 600px) {
    .bb-become-owner-meaning[b-s3h3mz8ohx] {
        padding: 0.85rem;
        border-radius: 16px;
    }

    .bb-become-owner-info-copy span[b-s3h3mz8ohx],
    .bb-become-owner-point[b-s3h3mz8ohx] {
        font-size: 0.76rem;
    }
}


.bb-become-owner-consent[b-s3h3mz8ohx] {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    align-items: start;
    gap: 11px;
    padding: 15px 16px;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 18%, var(--mud-palette-lines-default));
    border-radius: 14px;
    background: color-mix(in srgb, var(--mud-palette-primary) 4%, var(--mud-palette-surface));
    color: var(--mud-palette-text-primary);
    font-size: .9rem;
    line-height: 1.55;
    cursor: pointer;
}

    .bb-become-owner-consent input[b-s3h3mz8ohx] {
        width: 18px;
        height: 18px;
        margin-top: 2px;
        accent-color: var(--mud-palette-primary);
    }

    .bb-become-owner-consent[b-s3h3mz8ohx]  .mud-link {
        font-weight: 850;
    }
/* /Components/Booking/SalonAppointmentCard.razor.rz.scp.css */
.salon-appointment-card-shell[b-idz3rw2ryp] {
    width: 100%;
    height: 100%;
    display: flex;
}

.salon-appointment-card-shell[b-idz3rw2ryp]  .salon-appointment-card {
    width: 100%;
    height: 100%;
    min-height: 330px;
    padding: 1.25rem;
    border: 1px solid rgba(203, 213, 225, 0.95);
    background: #ffffff;
    display: flex;
    flex-direction: column;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.065);
    transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

    .salon-appointment-card-shell[b-idz3rw2ryp]  .salon-appointment-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 18px 44px rgba(15, 23, 42, 0.11);
        border-color: rgba(91, 75, 255, 0.3);
    }

.salon-appointment-card-shell[b-idz3rw2ryp]  .salon-appointment-card-content {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.salon-appointment-card-shell[b-idz3rw2ryp]  .dashboard-muted {
    color: #64748b;
}

.salon-appointment-card-shell[b-idz3rw2ryp]  .salon-appointment-card-header {
    gap: 1rem;
}

.salon-appointment-card-shell[b-idz3rw2ryp]  .salon-appointment-notes {
    margin-top: 0.25rem;
}

.salon-appointment-card-shell[b-idz3rw2ryp]  .salon-appointment-note {
    padding: 0.85rem;
    border-radius: 12px;
    background-color: rgba(91, 75, 255, 0.06);
    border: 1px solid rgba(91, 75, 255, 0.12);
}

.salon-appointment-card-shell[b-idz3rw2ryp]  .salon-appointment-cancel-panel {
    padding: 1rem;
    border: 1px solid rgba(239, 68, 68, 0.22);
    background-color: rgba(239, 68, 68, 0.04);
}

.salon-appointment-card-shell[b-idz3rw2ryp]  .salon-appointment-cancel-actions {
    flex-wrap: wrap;
}

    .salon-appointment-card-shell[b-idz3rw2ryp]  .salon-appointment-cancel-actions .mud-button-root {
        flex: 1;
        min-width: 160px;
    }

.salon-appointment-card-shell[b-idz3rw2ryp]  .salon-appointment-card-footer {
    margin-top: auto;
    padding-top: 0.85rem;
}

.salon-appointment-card-shell[b-idz3rw2ryp]  .salon-appointment-card-footer .mud-button-root {
    width: 100%;
}

.salon-appointment-card-shell[b-idz3rw2ryp]  .salon-appointment-action-hint {
    padding: 0.85rem;
    border: 1px solid rgba(14, 165, 233, 0.18);
    background-color: rgba(14, 165, 233, 0.045);
}

@media (max-width: 600px) {
    .salon-appointment-card-shell[b-idz3rw2ryp]  .salon-appointment-card {
        min-height: 0;
        padding: 1rem;
    }

    .salon-appointment-card-shell[b-idz3rw2ryp]  .salon-appointment-card-header {
        flex-direction: column;
        align-items: flex-start !important;
    }

    .salon-appointment-card-shell[b-idz3rw2ryp]  .salon-appointment-cancel-actions {
        flex-direction: column;
    }

        .salon-appointment-card-shell[b-idz3rw2ryp]  .salon-appointment-cancel-actions .mud-button-root {
            width: 100%;
        }
}
/* /Components/Booking/SalonBookingWidget.razor.rz.scp.css */
.salon-booking-widget[b-aoidohav1z] {
    --booking-primary: var(--mud-palette-primary);
    --booking-secondary: var(--mud-palette-secondary);
    --booking-surface: var(--mud-palette-surface);
    --booking-background: var(--mud-palette-background);
    --booking-text-primary: var(--mud-palette-text-primary);
    --booking-text-secondary: var(--mud-palette-text-secondary);
    --booking-divider: var(--mud-palette-divider);
    width: 100%;
}

    .salon-booking-widget[b-aoidohav1z]  .booking-panel {
        position: relative;
        overflow: hidden;
        padding: 1.35rem;
        border-radius: 30px;
        background: radial-gradient(circle at 90% 12%, color-mix(in srgb, var(--booking-secondary) 12%, transparent), transparent 30%), radial-gradient(circle at 10% 92%, color-mix(in srgb, var(--booking-primary) 9%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--booking-surface) 98%, var(--booking-primary)), var(--booking-surface));
        border: 1px solid color-mix(in srgb, var(--booking-primary) 11%, var(--booking-divider));
        box-shadow: 0 18px 46px color-mix(in srgb, var(--booking-text-primary) 7%, transparent);
    }

        .salon-booking-widget[b-aoidohav1z]  .booking-panel::before {
            content: "";
            position: absolute;
            left: 1.1rem;
            right: 1.1rem;
            top: 0;
            height: 4px;
            border-radius: 0 0 999px 999px;
            background: linear-gradient(90deg, var(--booking-primary), var(--booking-secondary));
            pointer-events: none;
        }

.booking-widget-header[b-aoidohav1z] {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.85rem;
    align-items: center;
}

.booking-widget-icon[b-aoidohav1z] {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border-radius: 20px;
    background: linear-gradient(135deg, var(--booking-primary), var(--booking-secondary));
    box-shadow: 0 14px 30px color-mix(in srgb, var(--booking-primary) 18%, transparent);
}

.salon-booking-widget[b-aoidohav1z]  .booking-widget-icon .mud-icon-root {
    color: #ffffff;
    font-size: 1.5rem;
}

.salon-booking-widget[b-aoidohav1z]  .booking-widget-title {
    color: var(--booking-text-primary);
    font-weight: 950;
    line-height: 1.1;
    letter-spacing: -0.035em;
}

.salon-booking-widget[b-aoidohav1z]  .booking-widget-subtitle {
    color: var(--booking-text-secondary);
    font-weight: 600;
    line-height: 1.45;
}

.booking-widget-flow-note[b-aoidohav1z] {
    position: relative;
    z-index: 2;
    display: grid;
    gap: 0.65rem;
    padding: 0.8rem;
    border-radius: 22px;
    background: radial-gradient(circle at 92% 12%, color-mix(in srgb, var(--booking-secondary) 8%, transparent), transparent 32%), color-mix(in srgb, var(--booking-primary) 5%, var(--booking-surface));
    border: 1px solid color-mix(in srgb, var(--booking-primary) 9%, var(--booking-divider));
}

.booking-widget-flow-label[b-aoidohav1z] {
    width: fit-content;
    padding: 0.32rem 0.6rem;
    color: var(--booking-primary);
    font-size: 0.66rem;
    font-weight: 950;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    border-radius: 999px;
    background: color-mix(in srgb, var(--booking-primary) 9%, var(--booking-surface));
    border: 1px solid color-mix(in srgb, var(--booking-primary) 10%, var(--booking-divider));
}

.booking-widget-flow-items[b-aoidohav1z] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.55rem;
}

    .booking-widget-flow-items div[b-aoidohav1z] {
        min-width: 0;
        display: grid;
        gap: 0.35rem;
        padding: 0.72rem 0.55rem;
        border-radius: 18px;
        background: color-mix(in srgb, var(--booking-surface) 90%, transparent);
        border: 1px solid color-mix(in srgb, var(--booking-primary) 8%, var(--booking-divider));
    }

    .booking-widget-flow-items span[b-aoidohav1z] {
        width: 24px;
        height: 24px;
        display: grid;
        place-items: center;
        color: #ffffff;
        font-size: 0.72rem;
        font-weight: 950;
        line-height: 1;
        border-radius: 999px;
        background: linear-gradient(135deg, var(--booking-primary), var(--booking-secondary));
    }

    .booking-widget-flow-items strong[b-aoidohav1z] {
        color: var(--booking-text-primary);
        font-size: 0.76rem;
        font-weight: 900;
        line-height: 1.18;
    }

.salon-booking-widget[b-aoidohav1z]  .mud-input-control {
    position: relative;
    z-index: 2;
    margin: 0;
}

.salon-booking-widget[b-aoidohav1z]  .mud-input-outlined {
    background: color-mix(in srgb, white 60%, var(--booking-surface));
    border-radius: 18px;
}

.salon-booking-widget[b-aoidohav1z]  .mud-input-outlined-border {
    border-color: color-mix(in srgb, var(--booking-primary) 13%, var(--booking-divider)) !important;
}

.salon-booking-widget[b-aoidohav1z]  .booking-widget-primary-button,
.salon-booking-widget[b-aoidohav1z]  .booking-widget-confirm-button {
    position: relative;
    z-index: 2;
    min-height: 50px;
    border-radius: 999px;
    font-weight: 950;
    letter-spacing: 0.02em;
    box-shadow: 0 14px 30px color-mix(in srgb, var(--booking-primary) 20%, transparent);
}

.salon-booking-widget[b-aoidohav1z]  .booking-widget-confirm-button {
    box-shadow: 0 14px 30px color-mix(in srgb, var(--booking-secondary) 20%, transparent);
}

.salon-booking-widget[b-aoidohav1z]  .booking-widget-section-title {
    color: var(--booking-text-primary);
    font-weight: 950;
    letter-spacing: -0.025em;
}

.salon-booking-widget[b-aoidohav1z]  .slot-button {
    min-height: 42px;
    border-radius: 999px;
    font-weight: 850;
}

.salon-booking-widget[b-aoidohav1z]  .booking-widget-alert {
    position: relative;
    z-index: 2;
    border-radius: 18px;
}

.booking-widget-empty[b-aoidohav1z] {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.85rem;
    align-items: center;
    padding: 1rem;
    border-radius: 24px;
    background: color-mix(in srgb, var(--booking-primary) 6%, var(--booking-surface));
    border: 1px solid color-mix(in srgb, var(--booking-primary) 9%, var(--booking-divider));
}

.booking-widget-empty-icon[b-aoidohav1z] {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border-radius: 19px;
    background: linear-gradient(135deg, var(--booking-primary), var(--booking-secondary));
    box-shadow: 0 14px 30px color-mix(in srgb, var(--booking-primary) 18%, transparent);
}

.salon-booking-widget[b-aoidohav1z]  .booking-widget-empty-icon .mud-icon-root {
    color: #ffffff;
    font-size: 1.42rem;
}

.salon-booking-widget[b-aoidohav1z]  .booking-widget-empty-title {
    color: var(--booking-text-primary);
    font-weight: 950;
    line-height: 1.15;
}

.salon-booking-widget[b-aoidohav1z]  .booking-widget-empty-text {
    color: var(--booking-text-secondary);
    line-height: 1.5;
    font-weight: 560;
}

@media (max-width: 600px) {
    .salon-booking-widget[b-aoidohav1z]  .booking-panel {
        padding: 1rem;
        border-radius: 24px;
    }

    .booking-widget-header[b-aoidohav1z],
    .booking-widget-empty[b-aoidohav1z] {
        grid-template-columns: 1fr;
    }

    .booking-widget-icon[b-aoidohav1z],
    .booking-widget-empty-icon[b-aoidohav1z] {
        width: 48px;
        height: 48px;
        border-radius: 17px;
    }

    .booking-widget-flow-items[b-aoidohav1z] {
        grid-template-columns: 1fr;
    }
}

/* BB-AVAILABILITY-02 premium booking state and slot picker polish */
.salon-booking-widget[b-aoidohav1z]  .booking-widget-readiness-alert {
    position: relative;
    z-index: 2;
    border-radius: 18px;
    color: var(--booking-text-primary);
    font-weight: 760;
    background: linear-gradient(135deg, color-mix(in srgb, var(--booking-primary) 7%, var(--booking-surface)), color-mix(in srgb, var(--booking-secondary) 7%, var(--booking-surface)));
    border: 1px solid color-mix(in srgb, var(--booking-primary) 12%, var(--booking-divider));
}

    .salon-booking-widget[b-aoidohav1z]  .booking-widget-readiness-alert .mud-icon-root {
        color: var(--booking-secondary);
    }

.booking-widget-flow-items .booking-widget-flow-item-active[b-aoidohav1z] {
    border-color: color-mix(in srgb, var(--booking-secondary) 22%, var(--booking-divider));
    background: linear-gradient(135deg, color-mix(in srgb, var(--booking-secondary) 10%, var(--booking-surface)), color-mix(in srgb, var(--booking-primary) 6%, var(--booking-surface)));
    box-shadow: 0 10px 22px color-mix(in srgb, var(--booking-secondary) 8%, transparent);
}

.booking-widget-summary-card[b-aoidohav1z] {
    position: relative;
    z-index: 2;
    display: grid;
    gap: 0.65rem;
    padding: 0.92rem;
    border-radius: 22px;
    background: linear-gradient(135deg, color-mix(in srgb, white 58%, var(--booking-surface)), color-mix(in srgb, var(--booking-secondary) 6%, var(--booking-surface)));
    border: 1px solid color-mix(in srgb, var(--booking-primary) 10%, var(--booking-divider));
    box-shadow: 0 12px 28px color-mix(in srgb, var(--booking-text-primary) 5%, transparent);
}

    .booking-widget-summary-card div[b-aoidohav1z] {
        display: grid;
        gap: 0.15rem;
        min-width: 0;
    }

    .booking-widget-summary-card span[b-aoidohav1z] {
        color: var(--booking-secondary);
        font-size: 0.66rem;
        font-weight: 950;
        line-height: 1;
        text-transform: uppercase;
        letter-spacing: 0.075em;
    }

    .booking-widget-summary-card strong[b-aoidohav1z] {
        overflow: hidden;
        color: var(--booking-text-primary);
        font-size: 0.88rem;
        font-weight: 950;
        line-height: 1.25;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.booking-slot-grid[b-aoidohav1z] {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
}

.booking-slot-card[b-aoidohav1z] {
    min-width: 0;
    min-height: 54px;
    display: grid;
    gap: 0.15rem;
    align-content: center;
    padding: 0.72rem 0.82rem;
    color: var(--booking-text-primary);
    font-family: inherit;
    text-align: left;
    border-radius: 18px;
    background: linear-gradient(135deg, color-mix(in srgb, white 62%, var(--booking-surface)), color-mix(in srgb, var(--booking-primary) 5%, var(--booking-surface)));
    border: 1px solid color-mix(in srgb, var(--booking-primary) 12%, var(--booking-divider));
    box-shadow: 0 10px 22px color-mix(in srgb, var(--booking-text-primary) 4%, transparent);
    cursor: pointer;
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

    .booking-slot-card:hover[b-aoidohav1z],
    .booking-slot-card:focus-visible[b-aoidohav1z] {
        transform: translateY(-2px);
        border-color: color-mix(in srgb, var(--booking-primary) 34%, var(--booking-divider));
        box-shadow: 0 16px 32px color-mix(in srgb, var(--booking-primary) 10%, transparent);
        outline: none;
    }

    .booking-slot-card:disabled[b-aoidohav1z] {
        cursor: not-allowed;
        opacity: 0.58;
        transform: none;
    }

    .booking-slot-card span[b-aoidohav1z] {
        color: var(--booking-text-primary);
        font-size: 0.88rem;
        font-weight: 950;
        line-height: 1.15;
    }

    .booking-slot-card small[b-aoidohav1z] {
        overflow: hidden;
        color: var(--booking-text-secondary);
        font-size: 0.72rem;
        font-weight: 750;
        line-height: 1.2;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.booking-slot-card-selected[b-aoidohav1z] {
    color: #ffffff;
    background: linear-gradient(135deg, var(--booking-primary), color-mix(in srgb, var(--booking-primary) 78%, var(--booking-secondary)));
    border-color: color-mix(in srgb, var(--booking-primary) 60%, var(--booking-secondary));
    box-shadow: 0 18px 38px color-mix(in srgb, var(--booking-primary) 20%, transparent);
}

    .booking-slot-card-selected span[b-aoidohav1z],
    .booking-slot-card-selected small[b-aoidohav1z] {
        color: #ffffff;
    }

.booking-widget-selected-slot[b-aoidohav1z] {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.72rem;
    align-items: center;
    padding: 0.85rem;
    border-radius: 20px;
    color: var(--booking-text-primary);
    background: linear-gradient(135deg, color-mix(in srgb, var(--mud-palette-success) 11%, var(--booking-surface)), color-mix(in srgb, white 62%, var(--booking-surface)));
    border: 1px solid color-mix(in srgb, var(--mud-palette-success) 22%, var(--booking-divider));
}

    .booking-widget-selected-slot .mud-icon-root[b-aoidohav1z] {
        color: var(--mud-palette-success);
        font-size: 1.45rem;
    }

    .booking-widget-selected-slot div[b-aoidohav1z] {
        display: grid;
        gap: 0.1rem;
        min-width: 0;
    }

    .booking-widget-selected-slot span[b-aoidohav1z] {
        color: var(--booking-text-secondary);
        font-size: 0.7rem;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 0.06em;
    }

    .booking-widget-selected-slot strong[b-aoidohav1z] {
        color: var(--booking-text-primary);
        font-size: 0.92rem;
        font-weight: 950;
        line-height: 1.22;
    }

@media (max-width: 600px) {
    .booking-slot-grid[b-aoidohav1z] {
        grid-template-columns: 1fr;
    }

    .booking-widget-summary-card strong[b-aoidohav1z] {
        white-space: normal;
    }
}


/* BB-BOOKING-UX-01 booking widget refinement */
.salon-booking-widget[b-aoidohav1z]  .booking-panel {
    border-radius: 26px;
}

.booking-widget-flow-heading[b-aoidohav1z] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

    .booking-widget-flow-heading strong[b-aoidohav1z] {
        color: var(--booking-text-primary);
        font-size: 0.78rem;
        font-weight: 900;
        line-height: 1.2;
    }

.booking-widget-flow-items[b-aoidohav1z] {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

    .booking-widget-flow-items div[b-aoidohav1z] {
        min-height: 78px;
        align-content: start;
    }

    .booking-widget-flow-items small[b-aoidohav1z] {
        overflow: hidden;
        color: var(--booking-text-secondary);
        font-size: 0.66rem;
        font-weight: 750;
        line-height: 1.15;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .booking-widget-flow-items .booking-widget-flow-item-active small[b-aoidohav1z] {
        color: var(--booking-primary);
    }

.booking-widget-date-shortcuts[b-aoidohav1z] {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.55rem;
}

.booking-widget-date-shortcut[b-aoidohav1z] {
    min-width: 0;
    display: grid;
    gap: 0.16rem;
    padding: 0.68rem 0.75rem;
    color: var(--booking-text-primary);
    font-family: inherit;
    text-align: left;
    border-radius: 16px;
    background: color-mix(in srgb, var(--booking-surface) 92%, transparent);
    border: 1px solid color-mix(in srgb, var(--booking-primary) 10%, var(--booking-divider));
    cursor: pointer;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--booking-text-primary) 4%, transparent);
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

    .booking-widget-date-shortcut:hover[b-aoidohav1z],
    .booking-widget-date-shortcut:focus-visible[b-aoidohav1z] {
        transform: translateY(-1px);
        border-color: color-mix(in srgb, var(--booking-primary) 30%, var(--booking-divider));
        box-shadow: 0 14px 26px color-mix(in srgb, var(--booking-primary) 8%, transparent);
        outline: none;
    }

    .booking-widget-date-shortcut strong[b-aoidohav1z] {
        overflow: hidden;
        color: var(--booking-text-primary);
        font-size: 0.78rem;
        font-weight: 950;
        line-height: 1.12;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .booking-widget-date-shortcut span[b-aoidohav1z] {
        color: var(--booking-text-secondary);
        font-size: 0.68rem;
        font-weight: 800;
        line-height: 1.1;
    }

.booking-widget-date-shortcut-active[b-aoidohav1z] {
    color: #ffffff;
    background: linear-gradient(135deg, var(--booking-primary), color-mix(in srgb, var(--booking-primary) 84%, var(--booking-secondary)));
    border-color: color-mix(in srgb, var(--booking-primary) 56%, var(--booking-secondary));
    box-shadow: 0 16px 30px color-mix(in srgb, var(--booking-primary) 16%, transparent);
}

    .booking-widget-date-shortcut-active strong[b-aoidohav1z],
    .booking-widget-date-shortcut-active span[b-aoidohav1z] {
        color: #ffffff;
    }

.booking-widget-final-review[b-aoidohav1z] {
    position: relative;
    z-index: 2;
    display: grid;
    gap: 0.55rem;
    padding: 0.85rem;
    border-radius: 20px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--booking-primary) 6%, var(--booking-surface)), color-mix(in srgb, var(--booking-secondary) 5%, var(--booking-surface)));
    border: 1px solid color-mix(in srgb, var(--booking-primary) 12%, var(--booking-divider));
}

    .booking-widget-final-review div[b-aoidohav1z] {
        display: grid;
        gap: 0.1rem;
        min-width: 0;
    }

    .booking-widget-final-review span[b-aoidohav1z] {
        color: var(--booking-secondary);
        font-size: 0.66rem;
        font-weight: 950;
        line-height: 1;
        text-transform: uppercase;
        letter-spacing: 0.07em;
    }

    .booking-widget-final-review strong[b-aoidohav1z] {
        overflow: hidden;
        color: var(--booking-text-primary);
        font-size: 0.84rem;
        font-weight: 900;
        line-height: 1.25;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.booking-widget-no-slots[b-aoidohav1z] {
    position: relative;
    z-index: 2;
    display: grid;
    gap: 0.65rem;
}

.booking-widget-empty-actions[b-aoidohav1z] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.salon-booking-widget[b-aoidohav1z]  .booking-widget-empty-actions .mud-button-root {
    min-height: 38px;
    border-radius: 999px;
    font-weight: 900;
    letter-spacing: 0.02em;
}

.salon-booking-widget[b-aoidohav1z]  .mud-picker-input-button .mud-icon-root {
    color: var(--booking-primary);
}

.salon-booking-widget[b-aoidohav1z]  .booking-widget-primary-button .mud-button-label,
.salon-booking-widget[b-aoidohav1z]  .booking-widget-primary-button .mud-icon-root,
.salon-booking-widget[b-aoidohav1z]  .booking-widget-confirm-button .mud-button-label,
.salon-booking-widget[b-aoidohav1z]  .booking-widget-confirm-button .mud-icon-root {
    color: #ffffff;
}

@media (max-width: 600px) {
    .booking-widget-flow-heading[b-aoidohav1z] {
        align-items: flex-start;
        flex-direction: column;
    }

    .booking-widget-flow-items[b-aoidohav1z],
    .booking-widget-date-shortcuts[b-aoidohav1z] {
        grid-template-columns: 1fr;
    }

        .booking-widget-flow-items div[b-aoidohav1z] {
            min-height: 0;
        }

    .booking-widget-final-review strong[b-aoidohav1z] {
        white-space: normal;
    }

    .booking-widget-empty-actions[b-aoidohav1z] {
        display: grid;
    }

    .salon-booking-widget[b-aoidohav1z]  .booking-widget-empty-actions .mud-button-root {
        width: 100%;
    }
}


/* BB-BOOKING-UX-01 v02 compact 2x2 booking flow cards */
.salon-booking-widget[b-aoidohav1z]  .booking-widget-flow-note {
    padding: 0.78rem !important;
}

.booking-widget-flow-heading[b-aoidohav1z] {
    align-items: flex-start !important;
}

    .booking-widget-flow-heading strong[b-aoidohav1z] {
        max-width: 100% !important;
        font-size: 0.74rem !important;
        line-height: 1.25 !important;
        overflow-wrap: anywhere !important;
    }

.booking-widget-flow-items[b-aoidohav1z] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.55rem !important;
}

    .booking-widget-flow-items div[b-aoidohav1z],
    .booking-widget-flow-items .booking-widget-flow-item[b-aoidohav1z] {
        min-width: 0 !important;
        min-height: 64px !important;
        display: grid !important;
        grid-template-columns: auto minmax(0, 1fr) !important;
        grid-template-rows: auto auto !important;
        column-gap: 0.55rem !important;
        row-gap: 0.12rem !important;
        align-content: center !important;
        align-items: center !important;
        padding: 0.58rem !important;
    }

    .booking-widget-flow-items span[b-aoidohav1z] {
        grid-row: 1 / span 2 !important;
        width: 28px !important;
        height: 28px !important;
        font-size: 0.72rem !important;
    }

    .booking-widget-flow-items strong[b-aoidohav1z] {
        min-width: 0 !important;
        overflow: hidden !important;
        color: var(--booking-text-primary) !important;
        font-size: 0.74rem !important;
        line-height: 1.08 !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .booking-widget-flow-items small[b-aoidohav1z] {
        min-width: 0 !important;
        overflow: hidden !important;
        font-size: 0.64rem !important;
        line-height: 1.15 !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .booking-widget-flow-items .booking-widget-flow-item-active strong[b-aoidohav1z],
    .booking-widget-flow-items .booking-widget-flow-item-active small[b-aoidohav1z] {
        color: #ffffff !important;
    }

@media (max-width: 360px) {
    .booking-widget-flow-items[b-aoidohav1z] {
        grid-template-columns: 1fr !important;
    }
}


/* BB-BOOKING-UX-01 v05 pro polish + stable 2x2 flow, no page/service scroll override */
.salon-booking-widget[b-aoidohav1z] {
    --booking-focus-shadow: color-mix(in srgb, var(--booking-primary) 16%, transparent);
}

    .salon-booking-widget[b-aoidohav1z]  .booking-panel {
        padding: 1.15rem !important;
        border-radius: 24px !important;
        background: radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--booking-secondary) 9%, transparent), transparent 28%), radial-gradient(circle at 8% 94%, color-mix(in srgb, var(--booking-primary) 7%, transparent), transparent 30%), linear-gradient(135deg, color-mix(in srgb, var(--booking-surface) 98%, var(--booking-primary)), var(--booking-surface)) !important;
        border-color: color-mix(in srgb, var(--booking-primary) 12%, var(--booking-divider)) !important;
        box-shadow: 0 18px 44px color-mix(in srgb, var(--booking-text-primary) 7%, transparent) !important;
    }

        .salon-booking-widget[b-aoidohav1z]  .booking-panel::before {
            left: 1rem !important;
            right: 1rem !important;
            height: 3px !important;
            background: linear-gradient(90deg, var(--booking-primary), var(--booking-secondary)) !important;
        }

.booking-widget-header[b-aoidohav1z] {
    gap: 0.72rem !important;
}

.booking-widget-icon[b-aoidohav1z] {
    width: 46px !important;
    height: 46px !important;
    border-radius: 16px !important;
}

.salon-booking-widget[b-aoidohav1z]  .booking-widget-icon .mud-icon-root {
    font-size: 1.28rem !important;
}

.salon-booking-widget[b-aoidohav1z]  .booking-widget-title {
    font-size: 1.05rem !important;
    letter-spacing: -0.025em !important;
}

.salon-booking-widget[b-aoidohav1z]  .booking-widget-subtitle {
    font-size: 0.78rem !important;
    line-height: 1.34 !important;
}

.salon-booking-widget[b-aoidohav1z]  .booking-widget-readiness-alert {
    padding: 0.48rem 0.58rem !important;
    border-radius: 14px !important;
    font-size: 0.74rem !important;
    line-height: 1.25 !important;
}

.booking-widget-flow-note[b-aoidohav1z] {
    gap: 0.55rem !important;
    padding: 0.68rem !important;
    border-radius: 18px !important;
    background: linear-gradient(135deg, color-mix(in srgb, var(--booking-primary) 5%, var(--booking-surface)), color-mix(in srgb, var(--booking-secondary) 5%, var(--booking-surface))) !important;
}

.booking-widget-flow-heading[b-aoidohav1z] {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 0.55rem !important;
}

.booking-widget-flow-label[b-aoidohav1z] {
    padding: 0.26rem 0.54rem !important;
    font-size: 0.58rem !important;
    letter-spacing: 0.065em !important;
}

.booking-widget-flow-heading strong[b-aoidohav1z] {
    min-width: 0 !important;
    overflow: hidden !important;
    color: var(--booking-text-primary) !important;
    font-size: 0.72rem !important;
    font-weight: 950 !important;
    line-height: 1.16 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.booking-widget-flow-items[b-aoidohav1z] {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.48rem !important;
}

    .booking-widget-flow-items div[b-aoidohav1z],
    .booking-widget-flow-items .booking-widget-flow-item[b-aoidohav1z] {
        min-width: 0 !important;
        min-height: 58px !important;
        display: grid !important;
        grid-template-columns: 26px minmax(0, 1fr) !important;
        grid-template-rows: auto auto !important;
        align-items: center !important;
        align-content: center !important;
        column-gap: 0.48rem !important;
        row-gap: 0.06rem !important;
        padding: 0.52rem !important;
        border-radius: 14px !important;
        background: color-mix(in srgb, var(--booking-surface) 92%, transparent) !important;
        border: 1px solid color-mix(in srgb, var(--booking-primary) 9%, var(--booking-divider)) !important;
    }

    .booking-widget-flow-items span[b-aoidohav1z] {
        grid-row: 1 / span 2 !important;
        width: 26px !important;
        height: 26px !important;
        font-size: 0.68rem !important;
        background: linear-gradient(135deg, var(--booking-primary), color-mix(in srgb, var(--booking-primary) 78%, var(--booking-secondary))) !important;
    }

    .booking-widget-flow-items strong[b-aoidohav1z] {
        min-width: 0 !important;
        overflow: hidden !important;
        color: var(--booking-text-primary) !important;
        font-size: 0.72rem !important;
        font-weight: 950 !important;
        line-height: 1.05 !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .booking-widget-flow-items small[b-aoidohav1z] {
        min-width: 0 !important;
        overflow: hidden !important;
        color: var(--booking-text-secondary) !important;
        font-size: 0.61rem !important;
        font-weight: 800 !important;
        line-height: 1.1 !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .booking-widget-flow-items .booking-widget-flow-item-active[b-aoidohav1z] {
        color: #ffffff !important;
        background: linear-gradient(135deg, var(--booking-primary), color-mix(in srgb, var(--booking-primary) 78%, var(--booking-secondary))) !important;
        border-color: color-mix(in srgb, var(--booking-primary) 48%, var(--booking-secondary)) !important;
        box-shadow: 0 12px 26px var(--booking-focus-shadow) !important;
    }

        .booking-widget-flow-items .booking-widget-flow-item-active span[b-aoidohav1z] {
            background: rgba(255,255,255,0.18) !important;
            border: 1px solid rgba(255,255,255,0.18) !important;
        }

        .booking-widget-flow-items .booking-widget-flow-item-active strong[b-aoidohav1z],
        .booking-widget-flow-items .booking-widget-flow-item-active small[b-aoidohav1z] {
            color: #ffffff !important;
        }

.booking-widget-summary-card[b-aoidohav1z],
.booking-widget-final-review[b-aoidohav1z] {
    gap: 0.52rem !important;
    padding: 0.78rem !important;
    border-radius: 18px !important;
    background: linear-gradient(135deg, color-mix(in srgb, var(--booking-primary) 5%, var(--booking-surface)), color-mix(in srgb, var(--booking-secondary) 5%, var(--booking-surface))) !important;
}

    .booking-widget-summary-card span[b-aoidohav1z],
    .booking-widget-final-review span[b-aoidohav1z] {
        font-size: 0.58rem !important;
        letter-spacing: 0.065em !important;
    }

    .booking-widget-summary-card strong[b-aoidohav1z],
    .booking-widget-final-review strong[b-aoidohav1z] {
        font-size: 0.78rem !important;
        line-height: 1.2 !important;
    }

.salon-booking-widget[b-aoidohav1z]  .mud-input-control {
    margin: 0 !important;
}

.salon-booking-widget[b-aoidohav1z]  .mud-input-outlined {
    border-radius: 14px !important;
}

.booking-widget-date-shortcuts[b-aoidohav1z] {
    gap: 0.48rem !important;
}

.booking-widget-date-shortcut[b-aoidohav1z] {
    padding: 0.58rem 0.64rem !important;
    border-radius: 14px !important;
}

    .booking-widget-date-shortcut strong[b-aoidohav1z] {
        font-size: 0.74rem !important;
    }

    .booking-widget-date-shortcut span[b-aoidohav1z] {
        font-size: 0.62rem !important;
    }

.salon-booking-widget[b-aoidohav1z]  .booking-widget-primary-button,
.salon-booking-widget[b-aoidohav1z]  .booking-widget-confirm-button {
    min-height: 46px !important;
    border-radius: 14px !important;
    font-size: 0.78rem !important;
    font-weight: 950 !important;
}

.booking-slot-grid[b-aoidohav1z] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.52rem !important;
}

.booking-slot-card[b-aoidohav1z] {
    min-height: 48px !important;
    padding: 0.62rem 0.68rem !important;
    border-radius: 14px !important;
}

    .booking-slot-card span[b-aoidohav1z] {
        font-size: 0.82rem !important;
    }

    .booking-slot-card small[b-aoidohav1z] {
        font-size: 0.66rem !important;
    }

.booking-widget-selected-slot[b-aoidohav1z] {
    padding: 0.72rem !important;
    border-radius: 16px !important;
}

.booking-widget-empty-actions[b-aoidohav1z] {
    gap: 0.45rem !important;
}

@media (max-width: 600px) {
    .booking-widget-flow-heading[b-aoidohav1z],
    .booking-widget-header[b-aoidohav1z],
    .booking-widget-empty[b-aoidohav1z] {
        grid-template-columns: 1fr !important;
    }

        .booking-widget-flow-heading strong[b-aoidohav1z] {
            white-space: normal !important;
        }

    .booking-widget-flow-items[b-aoidohav1z],
    .booking-widget-date-shortcuts[b-aoidohav1z],
    .booking-slot-grid[b-aoidohav1z] {
        grid-template-columns: 1fr !important;
    }

        .booking-widget-flow-items div[b-aoidohav1z],
        .booking-widget-flow-items .booking-widget-flow-item[b-aoidohav1z] {
            min-height: 0 !important;
        }
}

/* BB-OWNER-READY-EMPLOYEE-01 professional photo option */
.booking-professional-option[b-aoidohav1z] {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

    .booking-professional-option > span[b-aoidohav1z] {
        min-width: 0;
        overflow: hidden;
        color: var(--booking-text-primary);
        font-weight: 850;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.booking-professional-option-avatar[b-aoidohav1z] {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    overflow: hidden;
    display: grid;
    place-items: center;
    color: #ffffff;
    font-size: 0.62rem;
    font-weight: 950;
    border-radius: 11px;
    background: linear-gradient(135deg, var(--booking-primary), var(--booking-secondary));
}

    .booking-professional-option-avatar img[b-aoidohav1z] {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
    }

.booking-professional-option-avatar-image[b-aoidohav1z] {
    border: 1px solid color-mix(in srgb, var(--booking-primary) 16%, var(--booking-divider));
    background: var(--booking-surface);
}


/* BB-CUSTOMER-LIVE-BOOKING-SOON-01 */
.booking-launch-state[b-aoidohav1z] {
    position: relative;
    z-index: 2;
    display: grid;
    gap: 1rem;
}

.booking-launch-heading[b-aoidohav1z] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.9rem;
    align-items: start;
}

.booking-launch-icon[b-aoidohav1z] {
    width: 56px;
    height: 56px;
    display: grid;
    place-items: center;
    color: #ffffff;
    border-radius: 18px;
    background: linear-gradient(135deg, var(--booking-primary), var(--booking-secondary));
    box-shadow: 0 16px 34px color-mix(in srgb, var(--booking-primary) 20%, transparent);
}

.salon-booking-widget[b-aoidohav1z]  .booking-launch-icon .mud-icon-root {
    color: #ffffff !important;
    font-size: 1.45rem;
}

.booking-launch-pill[b-aoidohav1z] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 0.34rem 0.6rem;
    margin-bottom: 0.5rem;
    color: var(--booking-primary);
    font-size: 0.64rem;
    font-weight: 950;
    line-height: 1;
    letter-spacing: 0.075em;
    text-transform: uppercase;
    border-radius: 999px;
    background: color-mix(in srgb, var(--booking-secondary) 14%, var(--booking-surface));
    border: 1px solid color-mix(in srgb, var(--booking-secondary) 24%, var(--booking-divider));
}

.salon-booking-widget[b-aoidohav1z]  .booking-launch-title {
    color: var(--booking-text-primary);
    font-weight: 950;
    line-height: 1.12;
    letter-spacing: -0.03em;
}

.salon-booking-widget[b-aoidohav1z]  .booking-launch-text {
    max-width: 690px;
    margin-top: 0.38rem;
    color: var(--booking-text-secondary);
    font-weight: 620;
    line-height: 1.55;
}

.booking-launch-benefits[b-aoidohav1z] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.65rem;
}

.booking-launch-benefit-row[b-aoidohav1z] {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.72rem;
    align-items: center;
    min-height: 72px;
    padding: 0.8rem;
    color: var(--booking-text-primary);
    border-radius: 17px;
    background: linear-gradient( 135deg, color-mix(in srgb, var(--booking-primary) 5%, var(--booking-surface)), color-mix(in srgb, var(--booking-secondary) 6%, var(--booking-surface)));
    border: 1px solid color-mix(in srgb, var(--booking-primary) 10%, var(--booking-divider));
    box-shadow: 0 10px 24px color-mix(in srgb, var(--booking-text-primary) 4%, transparent);
}

.booking-launch-benefit-icon[b-aoidohav1z] {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    color: #ffffff;
    border-radius: 14px;
    background: linear-gradient(135deg, var(--booking-primary), var(--booking-secondary));
    box-shadow: 0 11px 24px color-mix(in srgb, var(--booking-primary) 17%, transparent);
}

.booking-launch-benefit-row > div[b-aoidohav1z] {
    min-width: 0;
    display: grid;
    gap: 0.16rem;
}

.booking-launch-benefit-row strong[b-aoidohav1z] {
    color: var(--booking-text-primary);
    font-size: 0.8rem;
    font-weight: 950;
    line-height: 1.25;
}

.booking-launch-benefit-row small[b-aoidohav1z] {
    color: var(--booking-text-secondary);
    font-size: 0.72rem;
    font-weight: 680;
    line-height: 1.42;
}

.salon-booking-widget[b-aoidohav1z]  .booking-launch-benefit-icon .mud-icon-root {
    color: #ffffff !important;
    font-size: 1.18rem;
}

.booking-launch-account-ready[b-aoidohav1z] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.7rem;
    align-items: center;
    padding: 0.85rem;
    color: var(--booking-text-primary);
    border-radius: 18px;
    background: linear-gradient( 135deg, color-mix(in srgb, var(--mud-palette-success) 10%, var(--booking-surface)), color-mix(in srgb, white 64%, var(--booking-surface)));
    border: 1px solid color-mix(in srgb, var(--mud-palette-success) 22%, var(--booking-divider));
}

.salon-booking-widget[b-aoidohav1z]  .booking-launch-account-ready .mud-icon-root {
    color: var(--mud-palette-success);
    font-size: 1.35rem;
}

.booking-launch-account-ready div[b-aoidohav1z] {
    display: grid;
    gap: 0.12rem;
}

.booking-launch-account-ready strong[b-aoidohav1z] {
    color: var(--booking-text-primary);
    font-size: 0.84rem;
    font-weight: 950;
}

.booking-launch-account-ready span[b-aoidohav1z] {
    color: var(--booking-text-secondary);
    font-size: 0.74rem;
    font-weight: 680;
    line-height: 1.35;
}

.booking-launch-actions[b-aoidohav1z] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.salon-booking-widget[b-aoidohav1z]  .booking-launch-actions .mud-button-root {
    min-height: 44px;
    border-radius: 12px !important;
    font-size: 0.76rem;
    font-weight: 950;
}

.booking-launch-footnote[b-aoidohav1z] {
    display: flex;
    align-items: flex-start;
    gap: 0.45rem;
    color: var(--booking-text-secondary);
    font-size: 0.7rem;
    font-weight: 720;
    line-height: 1.4;
}

.salon-booking-widget[b-aoidohav1z]  .booking-launch-footnote .mud-icon-root {
    flex: 0 0 auto;
    color: var(--booking-primary);
    margin-top: 0.04rem;
}

@media (max-width: 760px) {
    .booking-launch-benefits[b-aoidohav1z] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .booking-launch-heading[b-aoidohav1z],
    .booking-launch-account-ready[b-aoidohav1z] {
        grid-template-columns: 1fr;
    }

    .booking-launch-icon[b-aoidohav1z] {
        width: 50px;
        height: 50px;
        border-radius: 16px;
    }

    .booking-launch-actions[b-aoidohav1z] {
        display: grid;
    }

    .salon-booking-widget[b-aoidohav1z]  .booking-launch-actions .mud-button-root {
        width: 100%;
    }
}


/* BB-CUSTOMER-EARLY-ACCESS-MARKETING-02 */
.booking-launch-marketing[b-aoidohav1z] {
    position: relative;
    overflow: hidden;
    display: grid;
    gap: 0.28rem;
    padding: 0.9rem 1rem;
    border-radius: 18px;
    background: radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--booking-secondary) 16%, transparent), transparent 30%), linear-gradient( 135deg, color-mix(in srgb, var(--booking-primary) 7%, var(--booking-surface)), color-mix(in srgb, var(--booking-secondary) 9%, var(--booking-surface)));
    border: 1px solid color-mix(in srgb, var(--booking-secondary) 26%, var(--booking-divider));
    box-shadow: 0 14px 32px color-mix(in srgb, var(--booking-primary) 7%, transparent);
}

    .booking-launch-marketing[b-aoidohav1z]::after {
        content: "";
        position: absolute;
        right: -48px;
        bottom: -72px;
        width: 150px;
        height: 150px;
        border-radius: 999px;
        background: color-mix(in srgb, var(--booking-secondary) 10%, transparent);
        pointer-events: none;
    }

    .booking-launch-marketing > *[b-aoidohav1z] {
        position: relative;
        z-index: 2;
    }

    .booking-launch-marketing > span[b-aoidohav1z] {
        color: var(--booking-secondary);
        font-size: 0.66rem;
        font-weight: 950;
        line-height: 1;
        letter-spacing: 0.085em;
        text-transform: uppercase;
    }

    .booking-launch-marketing > strong[b-aoidohav1z] {
        color: var(--booking-text-primary);
        font-size: 0.98rem;
        font-weight: 950;
        line-height: 1.24;
        letter-spacing: -0.018em;
    }

    .booking-launch-marketing > p[b-aoidohav1z] {
        max-width: 760px;
        margin: 0;
        color: var(--booking-text-secondary);
        font-size: 0.76rem;
        font-weight: 650;
        line-height: 1.5;
    }

@media (max-width: 600px) {
    .booking-launch-benefit-row[b-aoidohav1z] {
        align-items: start;
    }

    .booking-launch-benefit-icon[b-aoidohav1z] {
        width: 38px;
        height: 38px;
        border-radius: 13px;
    }
}
/* /Components/Dialogs/LogoutAllDevicesDialog.razor.rz.scp.css */
.logout-all-dialog-content[b-026t8t0cov] {
    display: grid;
    justify-items: center;
    gap: 1.1rem;
    width: 100%;
    padding: 0.65rem 0 0.35rem;
    text-align: center;
}

    .logout-all-dialog-content[b-026t8t0cov],
    .logout-all-dialog-content *[b-026t8t0cov],
    .logout-all-dialog-actions[b-026t8t0cov],
    .logout-all-dialog-actions *[b-026t8t0cov] {
        box-sizing: border-box;
    }

        .logout-all-dialog-content[b-026t8t0cov]  .mud-typography,
        .logout-all-dialog-content[b-026t8t0cov]  .mud-button-root,
        .logout-all-dialog-actions[b-026t8t0cov]  .mud-button-root,
        .logout-all-dialog-actions[b-026t8t0cov]  .mud-button-label {
            font-family: inherit !important;
        }

.logout-all-dialog-icon[b-026t8t0cov] {
    position: relative;
    width: 76px;
    height: 76px;
    display: grid;
    place-items: center;
    color: var(--mud-palette-error);
    border: 1px solid color-mix( in srgb, var(--mud-palette-error) 20%, var(--mud-palette-divider));
    border-radius: 24px;
    background: radial-gradient( circle at 30% 20%, color-mix( in srgb, var(--mud-palette-error) 14%, transparent), transparent 55%), color-mix( in srgb, var(--mud-palette-error) 7%, var(--mud-palette-surface));
    box-shadow: 0 16px 34px color-mix( in srgb, var(--mud-palette-error) 13%, transparent);
}

    .logout-all-dialog-icon[b-026t8t0cov]::after {
        content: "";
        position: absolute;
        inset: -7px;
        pointer-events: none;
        border: 1px solid color-mix( in srgb, var(--mud-palette-error) 10%, transparent);
        border-radius: 29px;
    }

    .logout-all-dialog-icon[b-026t8t0cov]  .mud-icon-root {
        color: var(--mud-palette-error) !important;
        font-size: 2.15rem;
    }

.logout-all-dialog-copy-container[b-026t8t0cov] {
    width: 100%;
    max-width: 430px;
    display: grid;
    gap: 0.55rem;
}

.logout-all-dialog-content[b-026t8t0cov]  .logout-all-dialog-title {
    margin: 0;
    color: var(--mud-palette-primary) !important;
    font-size: 1.38rem !important;
    font-weight: 950 !important;
    line-height: 1.18 !important;
    letter-spacing: -0.025em !important;
}

.logout-all-dialog-content[b-026t8t0cov]  .logout-all-dialog-copy {
    margin: 0;
    color: var(--mud-palette-text-secondary) !important;
    font-size: 0.9rem !important;
    font-weight: 500 !important;
    line-height: 1.68 !important;
}

.logout-all-dialog-warning[b-026t8t0cov] {
    width: 100%;
    max-width: 430px;
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    gap: 0.55rem;
    align-items: flex-start;
    padding: 0.78rem 0.85rem;
    color: var(--mud-palette-text-secondary);
    font-size: 0.74rem;
    font-weight: 650;
    line-height: 1.5;
    text-align: left;
    border: 1px solid color-mix( in srgb, var(--mud-palette-secondary) 22%, var(--mud-palette-divider));
    border-radius: 14px;
    background: color-mix( in srgb, var(--mud-palette-secondary) 8%, var(--mud-palette-surface));
}

    .logout-all-dialog-warning[b-026t8t0cov]  .mud-icon-root {
        margin-top: 0.04rem;
        color: var(--mud-palette-secondary) !important;
    }

.logout-all-dialog-actions[b-026t8t0cov] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.65rem;
}

    .logout-all-dialog-actions[b-026t8t0cov]  .mud-button-root {
        min-height: 46px;
        padding-inline: 1rem;
        font-size: 0.79rem;
        font-weight: 900;
        line-height: 1;
        text-transform: none;
        border-radius: 13px !important;
        transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease;
    }

        .logout-all-dialog-actions[b-026t8t0cov]  .mud-button-root:hover {
            transform: translateY(-1px);
        }

    .logout-all-dialog-actions[b-026t8t0cov]  .logout-all-dialog-cancel-button {
        color: var(--mud-palette-primary);
    }

        .logout-all-dialog-actions[b-026t8t0cov]  .logout-all-dialog-cancel-button:hover {
            background: color-mix( in srgb, var(--mud-palette-primary) 7%, transparent);
        }

    .logout-all-dialog-actions[b-026t8t0cov]  .logout-all-dialog-confirm-button {
        box-shadow: 0 13px 28px color-mix( in srgb, var(--mud-palette-error) 20%, transparent);
    }

        .logout-all-dialog-actions[b-026t8t0cov]  .logout-all-dialog-confirm-button:hover {
            box-shadow: 0 17px 34px color-mix( in srgb, var(--mud-palette-error) 27%, transparent);
        }

    .logout-all-dialog-actions[b-026t8t0cov]  .mud-button-icon-start,
    .logout-all-dialog-actions[b-026t8t0cov]  .mud-button-start-icon {
        margin-inline-start: 0;
        margin-inline-end: 0.45rem;
    }

    .logout-all-dialog-actions[b-026t8t0cov]  .mud-button-root:focus-visible {
        outline: 3px solid color-mix( in srgb, var(--mud-palette-secondary) 34%, transparent);
        outline-offset: 3px;
    }

@media (max-width: 600px) {
    .logout-all-dialog-content[b-026t8t0cov] {
        gap: 0.95rem;
        padding-top: 0.3rem;
    }

    .logout-all-dialog-icon[b-026t8t0cov] {
        width: 68px;
        height: 68px;
        border-radius: 21px;
    }

        .logout-all-dialog-icon[b-026t8t0cov]::after {
            border-radius: 26px;
        }

    .logout-all-dialog-content[b-026t8t0cov]  .logout-all-dialog-title {
        font-size: 1.22rem !important;
    }

    .logout-all-dialog-content[b-026t8t0cov]  .logout-all-dialog-copy {
        font-size: 0.84rem !important;
        line-height: 1.62 !important;
    }

    .logout-all-dialog-actions[b-026t8t0cov] {
        display: grid;
        grid-template-columns: 1fr;
    }

        .logout-all-dialog-actions[b-026t8t0cov]  .mud-button-root {
            width: 100%;
        }

        .logout-all-dialog-actions[b-026t8t0cov]
         .logout-all-dialog-confirm-button {
            order: 1;
        }

        .logout-all-dialog-actions[b-026t8t0cov]
         .logout-all-dialog-cancel-button {
            order: 2;
        }
}

@media (prefers-reduced-motion: reduce) {
    .logout-all-dialog-actions[b-026t8t0cov]  .mud-button-root {
        transition: none;
    }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.bb-layout-root[b-7yzd69kl9i] {
    min-height: 100vh;
    background: var(--mud-palette-background);
}

    .bb-layout-root[b-7yzd69kl9i]  .mud-button-root {
        border-radius: 10px !important;
    }

        .bb-layout-root[b-7yzd69kl9i]  .mud-button-root .mud-ripple {
            border-radius: inherit !important;
        }

    .bb-layout-root[b-7yzd69kl9i]  .bb-main-appbar {
        position: sticky;
        top: 0;
        z-index: 1200;
        min-height: 76px;
        color: var(--mud-palette-text-primary);
        background: radial-gradient(circle at 18% 50%, color-mix(in srgb, var(--mud-palette-primary) 11%, transparent), transparent 28%), radial-gradient(circle at 86% 50%, color-mix(in srgb, var(--mud-palette-secondary) 13%, transparent), transparent 30%), linear-gradient(90deg, color-mix(in srgb, var(--mud-palette-surface) 96%, var(--mud-palette-primary)) 0%, var(--mud-palette-surface) 44%, color-mix(in srgb, var(--mud-palette-surface) 92%, var(--mud-palette-secondary)) 100%) !important;
        border-bottom: 1px solid color-mix(in srgb, var(--mud-palette-primary) 10%, var(--mud-palette-divider));
        backdrop-filter: blur(18px);
        box-shadow: 0 14px 38px color-mix(in srgb, var(--mud-palette-primary) 9%, transparent);
    }

        .bb-layout-root[b-7yzd69kl9i]  .bb-main-appbar::after {
            content: "";
            position: absolute;
            left: 0;
            right: 0;
            bottom: 0;
            height: 2px;
            background: linear-gradient(90deg, color-mix(in srgb, var(--mud-palette-primary) 0%, transparent) 0%, color-mix(in srgb, var(--mud-palette-primary) 42%, transparent) 24%, color-mix(in srgb, var(--mud-palette-secondary) 42%, transparent) 76%, color-mix(in srgb, var(--mud-palette-secondary) 0%, transparent) 100%);
            pointer-events: none;
        }

.bb-main-appbar-container[b-7yzd69kl9i] {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1280px;
    min-height: 76px;
    margin: 0 auto;
    padding: 0 24px;
    display: flex;
    align-items: center;
    gap: 0.65rem;
}

.bb-layout-root[b-7yzd69kl9i]  .bb-navbar-brand {
    display: inline-flex;
    align-items: center;
    min-width: 0;
    border-radius: 18px;
}

.bb-layout-root[b-7yzd69kl9i]  .bb-navbar-logo,
.bb-navbar-logo[b-7yzd69kl9i] {
    display: block;
    width: 190px;
    max-width: 48vw;
    height: auto;
    object-fit: contain;
    background: transparent;
}

.bb-layout-root[b-7yzd69kl9i]  .bb-navbar-links {
    align-items: center;
}

.bb-layout-root[b-7yzd69kl9i]  .bb-navbar-link {
    min-height: 42px;
    padding-inline: 14px;
    color: var(--mud-palette-text-primary) !important;
    font-size: 0.8rem;
    font-weight: 900;
    letter-spacing: 0.045em;
    text-transform: uppercase;
    border-radius: 10px;
    transition: background 180ms ease, color 180ms ease, transform 180ms ease;
}

    .bb-layout-root[b-7yzd69kl9i]  .bb-navbar-link:hover {
        transform: translateY(-1px);
        color: var(--mud-palette-primary) !important;
        background: color-mix(in srgb, var(--mud-palette-primary) 8%, transparent);
    }

    .bb-layout-root[b-7yzd69kl9i]  .bb-navbar-link .mud-button-label {
        color: inherit !important;
    }

.bb-layout-root[b-7yzd69kl9i]  .bb-navbar-private-link {
    color: var(--mud-palette-text-primary) !important;
}

.bb-layout-root[b-7yzd69kl9i]  .bb-navbar-contact {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    min-height: 44px;
    padding-inline: 22px;
    color: var(--mud-palette-secondary-contrast-text) !important;
    font-size: 0.8rem;
    font-weight: 950;
    letter-spacing: 0.045em;
    text-transform: uppercase;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--mud-palette-secondary), color-mix(in srgb, var(--mud-palette-secondary) 72%, var(--mud-palette-surface))) !important;
    box-shadow: 0 14px 30px color-mix(in srgb, var(--mud-palette-secondary) 24%, transparent), inset 0 1px 0 color-mix(in srgb, var(--mud-palette-surface) 26%, transparent);
    transition: transform 180ms ease, box-shadow 180ms ease;
}

    .bb-layout-root[b-7yzd69kl9i]  .bb-navbar-contact::after {
        content: "";
        position: absolute;
        top: -60%;
        bottom: -60%;
        left: -88%;
        width: 54%;
        z-index: 1;
        pointer-events: none;
        opacity: 0;
        transform: translateX(-20%) rotate(18deg);
        background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.00) 14%, rgba(255, 255, 255, 0.16) 34%, rgba(255, 255, 255, 0.58) 50%, rgba(255, 255, 255, 0.20) 66%, rgba(255, 255, 255, 0.00) 86%, transparent 100%);
        filter: blur(1px);
        mix-blend-mode: screen;
        animation: bb-navbar-cta-shine-b-7yzd69kl9i 4.4s ease-in-out infinite;
    }

    .bb-layout-root[b-7yzd69kl9i]  .bb-navbar-contact:hover {
        transform: translateY(-2px);
        box-shadow: 0 18px 38px color-mix(in srgb, var(--mud-palette-secondary) 32%, transparent), inset 0 1px 0 color-mix(in srgb, var(--mud-palette-surface) 30%, transparent);
    }

        .bb-layout-root[b-7yzd69kl9i]  .bb-navbar-contact:hover::after {
            animation-duration: 2.8s;
        }

    .bb-layout-root[b-7yzd69kl9i]  .bb-navbar-contact .mud-button-label,
    .bb-layout-root[b-7yzd69kl9i]  .bb-navbar-contact .mud-icon-root {
        position: relative;
        z-index: 2;
        color: var(--mud-palette-secondary-contrast-text) !important;
    }

.bb-navbar-separator[b-7yzd69kl9i] {
    width: 1px;
    height: 28px;
    margin-inline: 8px;
    background: color-mix(in srgb, var(--mud-palette-text-secondary) 20%, transparent);
}

.bb-account-area[b-7yzd69kl9i] {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.bb-layout-root[b-7yzd69kl9i]  .bb-account-button {
    min-height: 48px;
    max-width: 240px;
    padding: 5px 8px 5px 6px;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 10%, transparent);
    background: color-mix(in srgb, var(--mud-palette-surface) 78%, transparent);
    box-shadow: 0 10px 24px color-mix(in srgb, var(--mud-palette-primary) 7%, transparent);
    text-transform: none;
}

    .bb-layout-root[b-7yzd69kl9i]  .bb-account-button:hover {
        background: color-mix(in srgb, var(--mud-palette-secondary) 12%, var(--mud-palette-surface));
        border-color: color-mix(in srgb, var(--mud-palette-secondary) 28%, transparent);
        transform: translateY(-1px);
    }

.bb-layout-root[b-7yzd69kl9i]  .bb-account-button-inner {
    min-width: 0;
}

.bb-layout-root[b-7yzd69kl9i]  .bb-account-avatar,
.bb-account-menu-avatar[b-7yzd69kl9i] {
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
    color: #ffffff !important;
    font-family: inherit !important;
    font-size: 0.84rem;
    font-weight: 500;
    letter-spacing: 0;
    box-shadow: 0 10px 24px color-mix(in srgb, var(--mud-palette-secondary) 22%, transparent);
}

    .bb-layout-root[b-7yzd69kl9i]  .bb-account-avatar .mud-avatar-text,
    .bb-account-menu-avatar .mud-avatar-text[b-7yzd69kl9i] {
        color: #ffffff !important;
        font-family: inherit !important;
        font-size: 0.84rem;
        font-weight: 500;
        letter-spacing: 0;
        line-height: 1;
    }

.bb-layout-root[b-7yzd69kl9i]  .bb-account-button-text {
    min-width: 0;
    max-width: 150px;
    align-items: flex-start;
}

.bb-layout-root[b-7yzd69kl9i]  .bb-account-eyebrow {
    color: color-mix(in srgb, var(--mud-palette-text-secondary) 88%, transparent) !important;
    font-family: inherit !important;
    font-size: 0.66rem;
    font-weight: 750;
    line-height: 1;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.bb-layout-root[b-7yzd69kl9i]  .bb-account-label {
    max-width: 150px;
    overflow: hidden;
    color: var(--mud-palette-text-primary) !important;
    font-family: inherit !important;
    font-size: 0.84rem;
    font-weight: 500;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bb-layout-root[b-7yzd69kl9i]  .bb-account-chevron {
    flex: 0 0 auto;
    color: color-mix(in srgb, var(--mud-palette-text-secondary) 82%, transparent) !important;
    font-size: 1.1rem;
}

.bb-account-dropdown[b-7yzd69kl9i] {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    z-index: 1400;
}

.bb-account-popover-panel[b-7yzd69kl9i],
.bb-layout-root[b-7yzd69kl9i]  .bb-account-popover-panel {
    width: 330px;
    max-width: calc(100vw - 32px);
    overflow: hidden;
    font-family: inherit !important;
    text-align: left;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 10%, transparent);
    background: var(--mud-palette-surface);
    border-radius: 8px;
    box-shadow: 0 24px 58px color-mix(in srgb, var(--mud-palette-primary) 16%, transparent);
}

    .bb-account-popover-panel *[b-7yzd69kl9i],
    .bb-layout-root[b-7yzd69kl9i]  .bb-account-popover-panel *,
    .bb-layout-root[b-7yzd69kl9i]  .bb-account-popover-panel .mud-typography,
    .bb-layout-root[b-7yzd69kl9i]  .bb-account-popover-panel .mud-avatar,
    .bb-layout-root[b-7yzd69kl9i]  .bb-account-popover-panel .mud-avatar-text {
        font-family: inherit !important;
    }

.bb-account-menu-header[b-7yzd69kl9i] {
    display: flex;
    gap: 0.85rem;
    align-items: flex-start;
    padding: 1rem;
    text-align: left;
    background: radial-gradient(circle at 12% 18%, color-mix(in srgb, var(--mud-palette-secondary) 24%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--mud-palette-primary) 8%, var(--mud-palette-surface)), color-mix(in srgb, var(--mud-palette-secondary) 10%, var(--mud-palette-surface)));
    border-bottom: 1px solid color-mix(in srgb, var(--mud-palette-primary) 10%, transparent);
}

.bb-account-menu-avatar[b-7yzd69kl9i] {
    width: 44px;
    height: 44px;
    font-size: 0.84rem;
}

    .bb-account-menu-avatar .mud-avatar-text[b-7yzd69kl9i] {
        font-family: inherit !important;
        font-size: 0.84rem;
        font-weight: 950;
        letter-spacing: 0;
        line-height: 1;
    }

.bb-account-menu-identity[b-7yzd69kl9i] {
    min-width: 0;
    flex: 1;
    text-align: left;
}

.bb-account-menu-name[b-7yzd69kl9i],
.bb-layout-root[b-7yzd69kl9i]  .bb-account-menu-name,
.bb-layout-root[b-7yzd69kl9i]  .bb-account-menu-name.mud-typography {
    overflow: hidden;
    color: var(--mud-palette-text-primary) !important;
    font-family: inherit !important;
    font-size: 0.84rem !important;
    font-weight: 950 !important;
    letter-spacing: 0 !important;
    line-height: 1.2 !important;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bb-account-menu-email[b-7yzd69kl9i],
.bb-layout-root[b-7yzd69kl9i]  .bb-account-menu-email,
.bb-layout-root[b-7yzd69kl9i]  .bb-account-menu-email.mud-typography {
    display: block;
    overflow: hidden;
    margin-top: 0.22rem;
    color: color-mix(in srgb, var(--mud-palette-text-secondary) 92%, transparent) !important;
    font-family: inherit !important;
    font-size: 0.70rem !important;
    font-weight: 950 !important;
    letter-spacing: 0 !important;
    line-height: 1.2 !important;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bb-account-access-label[b-7yzd69kl9i] {
    margin-top: 0.55rem;
    color: color-mix(in srgb, var(--mud-palette-text-secondary) 90%, transparent);
    font-family: inherit !important;
    font-size: 0.62rem;
    font-weight: 650;
    line-height: 1;
    letter-spacing: 0.02em;
    text-align: left;
    text-transform: uppercase;
    white-space: nowrap;
}

.bb-account-role-row[b-7yzd69kl9i] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    justify-content: flex-start;
    margin-top: 0.42rem;
    text-align: left;
}

.bb-account-role-badge[b-7yzd69kl9i] {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 0.12rem 0.48rem;
    color: var(--mud-palette-primary);
    font-family: inherit !important;
    font-size: 0.62rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.025em;
    text-align: left;
    text-transform: uppercase;
    background: color-mix(in srgb, var(--mud-palette-secondary) 16%, var(--mud-palette-surface));
    border: 1px solid color-mix(in srgb, var(--mud-palette-secondary) 26%, transparent);
    border-radius: 999px;
    white-space: nowrap;
}

.bb-account-menu-section[b-7yzd69kl9i] {
    padding: 0.5rem;
    text-align: left;
    border-top: 1px solid color-mix(in srgb, var(--mud-palette-divider) 78%, transparent);
}

    .bb-account-menu-section:first-of-type[b-7yzd69kl9i] {
        border-top: 0;
    }

.bb-account-section-title[b-7yzd69kl9i] {
    padding: 0.25rem 0.55rem 0.38rem;
    color: color-mix(in srgb, var(--mud-palette-text-secondary) 86%, transparent);
    font-family: inherit !important;
    font-size: 0.66rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.035em;
    text-align: left;
    text-transform: uppercase;
    white-space: nowrap;
}

.bb-account-menu-link[b-7yzd69kl9i] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    min-height: 44px;
    padding: 0 0.55rem;
    color: var(--mud-palette-text-primary);
    font-family: inherit !important;
    font-size: 0.84rem;
    font-weight: 500;
    line-height: 1.2;
    text-align: left;
    text-decoration: none;
    text-transform: none;
    background: transparent;
    border: 0;
    border-radius: 10px;
    box-sizing: border-box;
    cursor: pointer;
    white-space: nowrap;
}

    .bb-account-menu-link:hover[b-7yzd69kl9i] {
        color: var(--mud-palette-primary);
        background: color-mix(in srgb, var(--mud-palette-primary) 6%, transparent);
        text-decoration: none;
    }

.bb-account-menu-link-security[b-7yzd69kl9i] {
    color: var(--mud-palette-primary);
    background: color-mix( in srgb, var(--mud-palette-secondary) 12%, var(--mud-palette-surface));
    border: 1px solid color-mix( in srgb, var(--mud-palette-secondary) 22%, transparent);
}

    .bb-account-menu-link-security:hover[b-7yzd69kl9i] {
        background: color-mix( in srgb, var(--mud-palette-secondary) 20%, var(--mud-palette-surface));
        border-color: color-mix( in srgb, var(--mud-palette-secondary) 34%, transparent);
    }


.bb-account-menu-link-text[b-7yzd69kl9i] {
    display: block;
    flex: 1;
    min-width: 0;
    color: inherit;
    font-family: inherit !important;
    font-size: 0.84rem;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.2;
    text-align: left;
    text-transform: none;
    white-space: nowrap;
}

.bb-account-menu-icon-shell[b-7yzd69kl9i] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    margin-right: 0.72rem;
    color: var(--mud-palette-primary);
    background: color-mix(in srgb, var(--mud-palette-secondary) 12%, var(--mud-palette-surface));
    border: 1px solid color-mix(in srgb, var(--mud-palette-secondary) 20%, transparent);
    border-radius: 10px;
}

.bb-account-menu-link:hover .bb-account-menu-icon-shell[b-7yzd69kl9i] {
    background: color-mix(in srgb, var(--mud-palette-secondary) 18%, var(--mud-palette-surface));
    border-color: color-mix(in srgb, var(--mud-palette-secondary) 30%, transparent);
}

.bb-layout-root[b-7yzd69kl9i]  .bb-account-menu-link-icon,
.bb-account-menu-link-icon[b-7yzd69kl9i] {
    width: 18px;
    height: 18px;
    color: var(--mud-palette-primary) !important;
    font-size: 1.05rem;
}

.bb-account-menu-section-danger[b-7yzd69kl9i] {
    padding-top: 0.42rem;
}

.bb-account-menu-logout-form[b-7yzd69kl9i] {
    margin: 0;
}

.bb-account-menu-logout-button[b-7yzd69kl9i] {
    color: var(--mud-palette-error);
}

    .bb-account-menu-logout-button:hover[b-7yzd69kl9i] {
        color: var(--mud-palette-error);
        background: color-mix(in srgb, var(--mud-palette-error) 6%, transparent);
    }

    .bb-account-menu-logout-button .bb-account-menu-icon-shell[b-7yzd69kl9i] {
        color: var(--mud-palette-error);
        background: color-mix(in srgb, var(--mud-palette-error) 8%, var(--mud-palette-surface));
        border-color: color-mix(in srgb, var(--mud-palette-error) 16%, transparent);
    }

    .bb-account-menu-logout-button .bb-account-menu-link-icon[b-7yzd69kl9i] {
        color: var(--mud-palette-error) !important;
    }

.bb-layout-root[b-7yzd69kl9i]  .bb-navbar-mobile-toggle {
    display: none;
    color: var(--mud-palette-text-primary) !important;
    border-radius: 10px;
    background: color-mix(in srgb, var(--mud-palette-primary) 8%, transparent);
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 12%, transparent);
}

    .bb-layout-root[b-7yzd69kl9i]  .bb-navbar-mobile-toggle:hover {
        background: color-mix(in srgb, var(--mud-palette-primary) 14%, transparent);
    }

.bb-layout-root[b-7yzd69kl9i]  .bb-main-content {
    min-height: calc(100vh - 76px);
    background: var(--mud-palette-background);
}

.bb-layout-root[b-7yzd69kl9i]  .bb-page-container {
    padding-top: 20px;
    padding-bottom: 32px;
}

.bb-layout-root[b-7yzd69kl9i]  .bb-mobile-drawer,
.bb-layout-root[b-7yzd69kl9i]  .bb-mobile-drawer *,
.bb-layout-root[b-7yzd69kl9i]  .bb-mobile-drawer-content,
.bb-layout-root[b-7yzd69kl9i]  .bb-mobile-drawer-content * {
    font-family: inherit !important;
}

.bb-layout-root[b-7yzd69kl9i]  .bb-mobile-drawer {
    background: var(--mud-palette-surface);
}

    .bb-layout-root[b-7yzd69kl9i]  .bb-mobile-drawer .mud-drawer-content {
        background: radial-gradient(circle at 20% 8%, color-mix(in srgb, var(--mud-palette-primary) 10%, transparent), transparent 24%), radial-gradient(circle at 88% 18%, color-mix(in srgb, var(--mud-palette-secondary) 11%, transparent), transparent 28%), var(--mud-palette-surface);
    }

.bb-layout-root[b-7yzd69kl9i]  .bb-mobile-drawer-content {
    width: min(292px, calc(100vw - 52px)) !important;
    min-width: 0;
    max-width: calc(100vw - 52px) !important;
    padding: 24px 18px;
    box-sizing: border-box;
    overflow-x: hidden;
    text-align: left;
}

.bb-layout-root[b-7yzd69kl9i]  .bb-mobile-drawer-logo,
.bb-mobile-drawer-logo[b-7yzd69kl9i] {
    width: 166px;
    height: auto;
    object-fit: contain;
    background: transparent;
    margin-bottom: 10px;
}

.bb-layout-root[b-7yzd69kl9i]  .bb-mobile-drawer-content .mud-button-root {
    width: 100%;
    max-width: 100%;
    justify-content: flex-start !important;
    min-height: 46px;
    border-radius: 10px;
    font-size: 0.86rem;
    font-weight: 750;
    line-height: 1.2;
    text-align: left !important;
    text-transform: none !important;
    box-sizing: border-box;
    white-space: nowrap;
}

.bb-layout-root[b-7yzd69kl9i]  .bb-mobile-drawer-content .mud-button-label {
    width: 100%;
    display: inline-flex;
    justify-content: flex-start !important;
    align-items: center;
    font-size: 0.86rem;
    font-weight: 750;
    line-height: 1.2;
    text-align: left !important;
    text-transform: none !important;
}

.bb-layout-root[b-7yzd69kl9i]  .bb-mobile-drawer-content .mud-button-start-icon {
    margin-left: 0 !important;
    margin-right: 0.72rem !important;
}

.bb-layout-root[b-7yzd69kl9i]  .bb-mobile-drawer-link {
    padding-inline: 14px !important;
}

.bb-layout-root[b-7yzd69kl9i]  .bb-mobile-drawer-security-link {
    color: var(--mud-palette-primary) !important;
    background: color-mix( in srgb, var(--mud-palette-secondary) 14%, var(--mud-palette-surface));
    border: 1px solid color-mix( in srgb, var(--mud-palette-secondary) 24%, transparent);
}

    .bb-layout-root[b-7yzd69kl9i]  .bb-mobile-drawer-security-link:hover {
        background: color-mix( in srgb, var(--mud-palette-secondary) 21%, var(--mud-palette-surface));
    }


.bb-layout-root[b-7yzd69kl9i]  .bb-mobile-drawer-section-title {
    padding-inline: 0.5rem;
    color: var(--mud-palette-secondary) !important;
    font-size: 0.68rem;
    font-weight: 850;
    line-height: 1;
    letter-spacing: 0.04em;
    text-align: left;
    text-transform: uppercase;
    white-space: nowrap;
}

.bb-layout-root[b-7yzd69kl9i]  .bb-mobile-drawer-contact {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    width: 80% !important;
    max-width: 100% !important;
    margin: 0;
    justify-content: flex-start !important;
    padding-inline: 14px !important;
    box-sizing: border-box;
    text-align: left;
    white-space: nowrap;
}

    .bb-layout-root[b-7yzd69kl9i]  .bb-mobile-drawer-contact::after {
        content: "";
        position: absolute;
        top: -60%;
        bottom: -60%;
        left: -88%;
        width: 54%;
        z-index: 1;
        pointer-events: none;
        opacity: 0;
        transform: translateX(-20%) rotate(18deg);
        background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.00) 14%, rgba(255, 255, 255, 0.16) 34%, rgba(255, 255, 255, 0.58) 50%, rgba(255, 255, 255, 0.20) 66%, rgba(255, 255, 255, 0.00) 86%, transparent 100%);
        filter: blur(1px);
        mix-blend-mode: screen;
        animation: bb-navbar-cta-shine-b-7yzd69kl9i 4.4s ease-in-out infinite;
    }

    .bb-layout-root[b-7yzd69kl9i]  .bb-mobile-drawer-contact .mud-button-label,
    .bb-layout-root[b-7yzd69kl9i]  .bb-mobile-drawer-contact .mud-icon-root {
        position: relative;
        z-index: 2;
    }

.bb-layout-root[b-7yzd69kl9i]  .bb-mobile-drawer-content .mud-button-filled {
    border-radius: 10px;
    justify-content: flex-start;
    font-weight: 850;
    box-shadow: 0 14px 30px color-mix(in srgb, var(--mud-palette-secondary) 20%, transparent);
}

.bb-mobile-logout-form[b-7yzd69kl9i] {
    margin: 0;
}

.bb-footer[b-7yzd69kl9i] {
    --bb-footer-text: #ffffff;
    --bb-footer-text-strong: rgba(255, 255, 255, 0.98);
    --bb-footer-text-muted: rgba(255, 255, 255, 0.82);
    --bb-footer-text-subtle: rgba(255, 255, 255, 0.68);
    --bb-footer-accent: #e5c986;
    --bb-footer-border: rgba(255, 255, 255, 0.16);
    position: relative;
    overflow: hidden;
    width: 100%;
    margin-top: 76px;
    color: var(--bb-footer-text);
    background: radial-gradient(circle at 12% 0%, rgba(184, 155, 94, 0.2), transparent 27%), radial-gradient(circle at 88% 88%, rgba(184, 155, 94, 0.14), transparent 28%), linear-gradient(145deg, #17252f 0%, #15324b 62%, #294453 100%);
    border-top: 1px solid var(--bb-footer-border);
    box-shadow: 0 -18px 60px rgba(21, 50, 75, 0.13);
}

    .bb-footer[b-7yzd69kl9i]::before {
        content: "";
        position: absolute;
        inset: 0;
        background-image: linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
        background-size: 42px 42px;
        mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.65), transparent 88%);
        pointer-events: none;
    }

.bb-footer-inner[b-7yzd69kl9i] {
    position: relative;
    z-index: 1;
    width: min(1280px, 100%);
    margin: 0 auto;
    padding: 54px 24px 22px;
}

.bb-footer-main[b-7yzd69kl9i] {
    display: grid;
    grid-template-columns: minmax(260px, 1.5fr) repeat(3, minmax(150px, 0.65fr));
    gap: clamp(28px, 4vw, 58px);
    padding-bottom: 42px;
}

.bb-footer-brand-column[b-7yzd69kl9i] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.bb-layout-root[b-7yzd69kl9i]  .bb-footer-logo-link {
    display: inline-flex;
    margin-bottom: 18px;
}

.bb-footer-logo[b-7yzd69kl9i] {
    display: block;
    width: 188px;
    max-width: 100%;
    filter: brightness(0) invert(1);
}

.bb-footer-description[b-7yzd69kl9i] {
    max-width: 390px;
    margin: 0;
    color: var(--bb-footer-text-muted) !important;
    font-size: 0.91rem;
    font-weight: 500;
    line-height: 1.7;
}

.bb-footer-trust-pill[b-7yzd69kl9i] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 20px;
    padding: 9px 12px;
    color: var(--bb-footer-text-strong) !important;
    background: rgba(184, 155, 94, 0.14);
    border: 1px solid rgba(229, 201, 134, 0.45);
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 850;
}

.bb-layout-root[b-7yzd69kl9i]  .bb-footer-trust-pill .mud-icon-root {
    color: var(--bb-footer-accent) !important;
}

.bb-footer-column[b-7yzd69kl9i] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
}

    .bb-footer-column > strong[b-7yzd69kl9i] {
        margin-bottom: 6px;
        color: var(--bb-footer-text-strong) !important;
        font-size: 0.76rem;
        font-weight: 950;
        letter-spacing: 0.105em;
        text-transform: uppercase;
    }

    .bb-layout-root[b-7yzd69kl9i]  .bb-footer-column .mud-link,
    .bb-layout-root[b-7yzd69kl9i]  .bb-footer-column .mud-link .mud-typography,
    .bb-footer-column > a[b-7yzd69kl9i],
    .bb-footer-column > a span[b-7yzd69kl9i] {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        max-width: 100%;
        color: var(--bb-footer-text-muted) !important;
        font-size: 0.84rem;
        font-weight: 650;
        line-height: 1.45;
        text-decoration: none;
        overflow-wrap: anywhere;
        transition: color 150ms ease, transform 150ms ease;
    }

        .bb-layout-root[b-7yzd69kl9i]  .bb-footer-column .mud-link:hover,
        .bb-layout-root[b-7yzd69kl9i]  .bb-footer-column .mud-link:hover .mud-typography,
        .bb-footer-column > a:hover[b-7yzd69kl9i],
        .bb-footer-column > a:hover span[b-7yzd69kl9i] {
            color: var(--bb-footer-accent) !important;
            transform: translateX(3px);
        }

.bb-layout-root[b-7yzd69kl9i]  .bb-footer-contact-column .mud-icon-root,
.bb-footer-contact-column > a .mud-icon-root[b-7yzd69kl9i] {
    flex: 0 0 auto;
    color: var(--bb-footer-text-subtle) !important;
    opacity: 1;
}

.bb-layout-root[b-7yzd69kl9i]  .bb-footer-contact-column .mud-link:hover .mud-icon-root,
.bb-footer-contact-column > a:hover .mud-icon-root[b-7yzd69kl9i] {
    color: var(--bb-footer-accent) !important;
}

.bb-footer-bottom[b-7yzd69kl9i] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding-top: 20px;
    color: var(--bb-footer-text-subtle) !important;
    border-top: 1px solid var(--bb-footer-border);
    font-size: 0.75rem;
    font-weight: 650;
}

    .bb-footer-bottom > div:first-child[b-7yzd69kl9i] {
        display: flex;
        flex-wrap: wrap;
        gap: 7px 16px;
    }

    .bb-footer-bottom span[b-7yzd69kl9i] {
        color: inherit !important;
    }

.bb-footer-operator[b-7yzd69kl9i] {
    color: var(--bb-footer-text-muted) !important;
}

.bb-footer-version[b-7yzd69kl9i] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--bb-footer-text-muted) !important;
    white-space: nowrap;
}

.bb-layout-root[b-7yzd69kl9i]  .bb-footer-version .mud-icon-root {
    color: var(--bb-footer-accent) !important;
}

@media (max-width: 980px) {
    .bb-footer-main[b-7yzd69kl9i] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .bb-footer-brand-column[b-7yzd69kl9i] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 600px) {
    .bb-footer[b-7yzd69kl9i] {
        margin-top: 50px;
    }

    .bb-footer-inner[b-7yzd69kl9i] {
        padding: 40px 18px 20px;
    }

    .bb-footer-main[b-7yzd69kl9i] {
        grid-template-columns: 1fr;
        gap: 30px;
        padding-bottom: 32px;
    }

    .bb-footer-brand-column[b-7yzd69kl9i] {
        grid-column: auto;
    }

    .bb-footer-bottom[b-7yzd69kl9i] {
        align-items: flex-start;
        flex-direction: column;
    }
}

@keyframes bb-navbar-cta-shine-b-7yzd69kl9i {
    0% {
        left: -88%;
        opacity: 0;
        transform: translateX(-20%) rotate(18deg);
    }

    14% {
        opacity: 0.38;
    }

    42% {
        opacity: 0.72;
    }

    58% {
        left: 132%;
        opacity: 0;
        transform: translateX(24%) rotate(18deg);
    }

    100% {
        left: 132%;
        opacity: 0;
        transform: translateX(24%) rotate(18deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .bb-layout-root[b-7yzd69kl9i]  .bb-navbar-contact::after,
    .bb-layout-root[b-7yzd69kl9i]  .bb-mobile-drawer-contact::after {
        animation: none;
        opacity: 0;
    }
}

@media (max-width: 768px) {
    .bb-main-appbar-container[b-7yzd69kl9i] {
        min-height: 68px;
        padding: 0 16px;
    }

    .bb-layout-root[b-7yzd69kl9i]  .bb-main-appbar {
        min-height: 68px;
    }

    .bb-layout-root[b-7yzd69kl9i]  .bb-navbar-logo,
    .bb-navbar-logo[b-7yzd69kl9i] {
        width: 166px;
        max-width: 58vw;
    }

    .bb-layout-root[b-7yzd69kl9i]  .bb-navbar-links {
        display: none !important;
    }

    .bb-account-area[b-7yzd69kl9i] {
        display: none !important;
    }

    .bb-layout-root[b-7yzd69kl9i]  .bb-navbar-mobile-toggle {
        display: inline-flex;
    }

    .bb-layout-root[b-7yzd69kl9i]  .bb-main-content {
        min-height: calc(100vh - 68px);
    }

    .bb-layout-root[b-7yzd69kl9i]  .bb-page-container {
        padding-top: 14px;
    }
}

@media (min-width: 1025px) {
    .bb-layout-root[b-7yzd69kl9i]  .bb-mobile-drawer {
        display: none !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
}

@media (max-width: 1024px) {
    .bb-layout-root[b-7yzd69kl9i]  .bb-navbar-links {
        display: none !important;
    }

    .bb-account-area[b-7yzd69kl9i] {
        display: none !important;
    }

    .bb-layout-root[b-7yzd69kl9i]  .bb-navbar-mobile-toggle {
        display: inline-flex;
    }
}


/* BB-SALON-OWNER-WORKSPACE-NAV-01 */
.bb-layout-root[b-7yzd69kl9i]  .bb-navbar-owner-link {
    color: var(--mud-palette-primary) !important;
    background: color-mix(in srgb, var(--mud-palette-secondary) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--mud-palette-secondary) 18%, transparent);
}

    .bb-layout-root[b-7yzd69kl9i]  .bb-navbar-owner-link:hover {
        background: color-mix(in srgb, var(--mud-palette-secondary) 17%, var(--mud-palette-surface));
        border-color: color-mix(in srgb, var(--mud-palette-secondary) 30%, transparent);
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.bb-navmenu[b-00rlbuegbz] {
    display: grid;
    gap: 0.55rem;
    padding: 1rem;
}

.bb-navmenu-link[b-00rlbuegbz] {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    min-height: 46px;
    padding: 0.7rem 0.9rem;
    color: var(--mud-palette-text-primary);
    text-decoration: none;
    border-radius: 16px;
    background: color-mix(in srgb, var(--mud-palette-surface) 94%, transparent);
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 8%, var(--mud-palette-divider));
    font-size: 0.9rem;
    font-weight: 850;
    transition: transform 160ms ease, background 160ms ease, border-color 160ms ease, color 160ms ease;
}

    .bb-navmenu-link:hover[b-00rlbuegbz] {
        transform: translateY(-1px);
        color: var(--mud-palette-primary);
        background: color-mix(in srgb, var(--mud-palette-primary) 7%, var(--mud-palette-surface));
        border-color: color-mix(in srgb, var(--mud-palette-primary) 20%, var(--mud-palette-divider));
    }

    .bb-navmenu-link.active[b-00rlbuegbz] {
        color: var(--mud-palette-primary);
        background: color-mix(in srgb, var(--mud-palette-primary) 10%, var(--mud-palette-surface));
        border-color: color-mix(in srgb, var(--mud-palette-primary) 28%, var(--mud-palette-divider));
    }

.bb-navmenu-icon[b-00rlbuegbz] {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    color: var(--mud-palette-primary);
    border-radius: 11px;
    background: color-mix(in srgb, var(--mud-palette-primary) 9%, var(--mud-palette-surface));
    font-size: 0.9rem;
    font-weight: 950;
}

.bb-navmenu-link-cta[b-00rlbuegbz] {
    color: var(--mud-palette-secondary-contrast-text);
    background: linear-gradient(135deg, var(--mud-palette-secondary), color-mix(in srgb, var(--mud-palette-secondary) 78%, var(--mud-palette-info)));
    border-color: color-mix(in srgb, var(--mud-palette-secondary) 34%, transparent);
    box-shadow: 0 14px 28px color-mix(in srgb, var(--mud-palette-secondary) 20%, transparent);
}

    .bb-navmenu-link-cta:hover[b-00rlbuegbz],
    .bb-navmenu-link-cta.active[b-00rlbuegbz] {
        color: var(--mud-palette-secondary-contrast-text);
        background: linear-gradient(135deg, var(--mud-palette-secondary), color-mix(in srgb, var(--mud-palette-secondary) 70%, var(--mud-palette-primary)));
        border-color: color-mix(in srgb, var(--mud-palette-secondary) 42%, transparent);
    }

    .bb-navmenu-link-cta .bb-navmenu-icon[b-00rlbuegbz] {
        color: var(--mud-palette-secondary);
        background: color-mix(in srgb, var(--mud-palette-surface) 92%, transparent);
    }
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-t126c4w332],
.components-reconnect-repeated-attempt-visible[b-t126c4w332],
.components-reconnect-failed-visible[b-t126c4w332],
.components-pause-visible[b-t126c4w332],
.components-resume-failed-visible[b-t126c4w332],
.components-rejoining-animation[b-t126c4w332] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-t126c4w332],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-t126c4w332],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-t126c4w332],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-t126c4w332],
#components-reconnect-modal.components-reconnect-retrying[b-t126c4w332],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-t126c4w332],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-t126c4w332],
#components-reconnect-modal.components-reconnect-failed[b-t126c4w332],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-t126c4w332] {
    display: block;
}


#components-reconnect-modal[b-t126c4w332] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-t126c4w332 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-t126c4w332 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-t126c4w332 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-t126c4w332]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-t126c4w332 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-t126c4w332 {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-t126c4w332 {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-t126c4w332 {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-t126c4w332] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-t126c4w332] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-t126c4w332] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-t126c4w332] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-t126c4w332] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-t126c4w332] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-t126c4w332] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-t126c4w332 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-t126c4w332] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-t126c4w332 {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Localization/CultureSelector.razor.rz.scp.css */
.bb-culture-selector[b-sz15vp70xb] {
    display: inline-flex;
    align-items: center;
    gap: 0.22rem;
    padding: 0.22rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 12%, var(--mud-palette-divider));
    border-radius: 999px;
    background: color-mix(in srgb, var(--mud-palette-primary) 7%, var(--mud-palette-surface));
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--mud-palette-surface) 72%, transparent);
}

.bb-culture-selector-button[b-sz15vp70xb] {
    min-width: 58px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.38rem;
    padding: 0 0.58rem;
    color: var(--mud-palette-text-secondary);
    font-family: inherit;
    font-size: 0.68rem;
    font-weight: 950;
    line-height: 1;
    letter-spacing: 0.055em;
    border: 0;
    border-radius: 999px;
    background: transparent;
    cursor: pointer;
    transition: color 160ms ease, background 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

    .bb-culture-selector-button img[b-sz15vp70xb] {
        flex: 0 0 18px;
        width: 18px;
        min-width: 18px;
        max-width: 18px;
        height: 14px;
        min-height: 14px;
        max-height: 14px;
        display: block;
        object-fit: cover;
        object-position: center;
        border-radius: 3px;
        box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.12), 0 2px 5px rgba(15, 23, 42, 0.12);
        image-rendering: -webkit-optimize-contrast;
    }

    .bb-culture-selector-button span[b-sz15vp70xb] {
        line-height: 1;
    }

    .bb-culture-selector-button:hover[b-sz15vp70xb] {
        color: var(--mud-palette-primary);
        background: color-mix(in srgb, var(--mud-palette-primary) 9%, transparent);
        transform: translateY(-1px);
    }

    .bb-culture-selector-button:focus-visible[b-sz15vp70xb] {
        outline: 2px solid color-mix(in srgb, var(--mud-palette-secondary) 72%, #ffffff);
        outline-offset: 2px;
    }

.bb-culture-selector-button-selected[b-sz15vp70xb] {
    color: var(--mud-palette-secondary-contrast-text);
    background: linear-gradient( 135deg, var(--mud-palette-secondary), color-mix(in srgb, var(--mud-palette-secondary) 76%, #ffffff));
    box-shadow: 0 8px 18px color-mix(in srgb, var(--mud-palette-secondary) 24%, transparent);
}

    .bb-culture-selector-button-selected:hover[b-sz15vp70xb] {
        color: var(--mud-palette-secondary-contrast-text);
        background: linear-gradient( 135deg, var(--mud-palette-secondary), color-mix(in srgb, var(--mud-palette-secondary) 82%, #ffffff));
    }

.bb-navbar-culture-selector[b-sz15vp70xb] {
    margin-left: 0.2rem;
}

.bb-mobile-culture-selector[b-sz15vp70xb] {
    align-self: flex-start;
    margin-bottom: 0.25rem;
}

@media (max-width: 600px) {
    .bb-culture-selector-button[b-sz15vp70xb] {
        min-width: 56px;
        height: 32px;
        padding-inline: 0.52rem;
    }
}
/* /Components/Media/ImageLightboxDialog.razor.rz.scp.css */
.image-lightbox-dialog[b-eti6whzqmp] {
    display: grid;
    gap: 1rem;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    box-sizing: border-box;
    outline: none;
}

    .image-lightbox-dialog *[b-eti6whzqmp],
    .image-lightbox-dialog *[b-eti6whzqmp]::before,
    .image-lightbox-dialog *[b-eti6whzqmp]::after {
        box-sizing: border-box;
    }

.image-lightbox-stage[b-eti6whzqmp] {
    position: relative;
    overflow: hidden;
    display: grid;
    place-items: center;
    min-height: min(72vh, 760px);
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 12%, var(--mud-palette-divider));
    background: radial-gradient(circle at 12% 16%, color-mix(in srgb, var(--mud-palette-secondary) 12%, transparent), transparent 32%), linear-gradient(135deg, color-mix(in srgb, var(--mud-palette-surface) 96%, var(--mud-palette-primary)), var(--mud-palette-surface));
    border-radius: 22px;
    box-shadow: 0 24px 64px color-mix(in srgb, var(--mud-palette-primary) 13%, transparent);
}

.image-lightbox-image[b-eti6whzqmp] {
    width: 100%;
    max-width: 100%;
    max-height: min(72vh, 760px);
    display: block;
    object-fit: contain;
}

.image-lightbox-empty[b-eti6whzqmp] {
    display: grid;
    justify-items: center;
    gap: 0.65rem;
    padding: 2rem;
    color: var(--mud-palette-text-secondary);
    font-weight: 750;
    text-align: center;
}

    .image-lightbox-empty[b-eti6whzqmp]  .mud-icon-root {
        color: var(--mud-palette-secondary);
        font-size: 3rem;
    }

.image-lightbox-nav-button[b-eti6whzqmp] {
    position: absolute;
    top: 50%;
    z-index: 3;
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 999px;
    background: color-mix(in srgb, var(--mud-palette-primary) 82%, transparent);
    box-shadow: 0 16px 32px rgba(15, 23, 42, 0.24);
    backdrop-filter: blur(12px);
    cursor: pointer;
    transform: translateY(-50%);
    transition: transform 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

    .image-lightbox-nav-button:hover[b-eti6whzqmp],
    .image-lightbox-nav-button:focus-visible[b-eti6whzqmp] {
        background: linear-gradient(135deg, var(--mud-palette-primary), var(--mud-palette-secondary));
        box-shadow: 0 20px 40px rgba(15, 23, 42, 0.3);
        outline: none;
    }

    .image-lightbox-nav-button[b-eti6whzqmp]  .mud-icon-root {
        color: #ffffff !important;
        font-size: 1.85rem;
    }

.image-lightbox-nav-button-previous[b-eti6whzqmp] {
    left: 1rem;
}

    .image-lightbox-nav-button-previous:hover[b-eti6whzqmp],
    .image-lightbox-nav-button-previous:focus-visible[b-eti6whzqmp] {
        transform: translateY(-50%) translateX(-2px);
    }

.image-lightbox-nav-button-next[b-eti6whzqmp] {
    right: 1rem;
}

    .image-lightbox-nav-button-next:hover[b-eti6whzqmp],
    .image-lightbox-nav-button-next:focus-visible[b-eti6whzqmp] {
        transform: translateY(-50%) translateX(2px);
    }

.image-lightbox-meta[b-eti6whzqmp] {
    min-width: 0;
    max-width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.95rem 1rem;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 9%, var(--mud-palette-divider));
    background: color-mix(in srgb, var(--mud-palette-primary) 4%, var(--mud-palette-surface));
    border-radius: 18px;
}

.image-lightbox-copy[b-eti6whzqmp] {
    min-width: 0;
    display: grid;
    gap: 0.12rem;
}

.image-lightbox-kicker[b-eti6whzqmp] {
    color: var(--mud-palette-secondary);
    font-weight: 950;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.image-lightbox-title[b-eti6whzqmp] {
    overflow-wrap: anywhere;
    color: var(--mud-palette-primary);
    font-weight: 950;
    line-height: 1.2;
}

.image-lightbox-counter[b-eti6whzqmp] {
    color: var(--mud-palette-text-secondary);
    font-weight: 780;
}

.image-lightbox-actions[b-eti6whzqmp] {
    min-width: 0;
    flex: 0 1 auto;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.image-lightbox-action-button[b-eti6whzqmp],
.image-lightbox-close-button[b-eti6whzqmp] {
    min-width: 0;
    min-height: 40px;
    border-radius: 10px !important;
    font-family: inherit;
    font-weight: 900;
    text-transform: none;
}

    .image-lightbox-close-button[b-eti6whzqmp]  .mud-button-label,
    .image-lightbox-close-button[b-eti6whzqmp]  .mud-icon-root {
        color: #ffffff !important;
    }

@media (max-width: 760px) {
    .image-lightbox-dialog[b-eti6whzqmp] {
        gap: 0.75rem;
        overflow-x: hidden;
    }

    .image-lightbox-stage[b-eti6whzqmp] {
        min-height: min(58vh, 560px);
        border-radius: 18px;
    }

    .image-lightbox-image[b-eti6whzqmp] {
        max-height: min(58vh, 560px);
    }

    .image-lightbox-nav-button[b-eti6whzqmp] {
        width: 42px;
        height: 42px;
    }

    .image-lightbox-nav-button-previous[b-eti6whzqmp] {
        left: 0.6rem;
    }

    .image-lightbox-nav-button-next[b-eti6whzqmp] {
        right: 0.6rem;
    }

    .image-lightbox-meta[b-eti6whzqmp] {
        align-items: stretch;
        flex-direction: column;
        gap: 0.75rem;
        padding: 0.8rem;
        overflow-x: hidden;
    }

    .image-lightbox-actions[b-eti6whzqmp] {
        display: grid !important;
        grid-template-columns: 1fr;
        gap: 0.55rem !important;
        width: 100%;
        max-width: 100%;
    }

    .image-lightbox-action-button[b-eti6whzqmp],
    .image-lightbox-close-button[b-eti6whzqmp] {
        width: 100%;
        max-width: 100%;
    }
}

@media (max-width: 420px) {
    .image-lightbox-stage[b-eti6whzqmp] {
        min-height: min(54vh, 500px);
    }

    .image-lightbox-image[b-eti6whzqmp] {
        max-height: min(54vh, 500px);
    }

    .image-lightbox-nav-button[b-eti6whzqmp] {
        width: 38px;
        height: 38px;
    }
}
/* /Components/Notifications/NotificationMenu.razor.rz.scp.css */
.bb-notification-menu[b-wo8oqf8yu7],
.bb-notification-menu *[b-wo8oqf8yu7],
.bb-notification-menu[b-wo8oqf8yu7]  *,
.bb-notification-panel[b-wo8oqf8yu7],
.bb-notification-panel *[b-wo8oqf8yu7],
.bb-notification-panel[b-wo8oqf8yu7]  * {
    box-sizing: border-box;
    font-family: inherit !important;
}

    .bb-notification-menu button[b-wo8oqf8yu7],
    .bb-notification-panel button[b-wo8oqf8yu7] {
        font-family: inherit !important;
    }

.bb-notification-menu[b-wo8oqf8yu7] {
    position: relative;
    display: inline-flex;
    align-items: center;
    margin-left: 10px;
}

.bb-notification-badge[b-wo8oqf8yu7] {
    display: inline-flex;
}

.bb-notification-menu[b-wo8oqf8yu7]  .bb-notification-trigger {
    width: 42px;
    height: 42px;
    color: var(--mud-palette-text-primary) !important;
    border: 1px solid color-mix( in srgb, var(--mud-palette-primary) 12%, transparent);
    border-radius: 10px !important;
    background: color-mix( in srgb, var(--mud-palette-primary) 7%, transparent);
    transition: background 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}

    .bb-notification-menu[b-wo8oqf8yu7]  .bb-notification-trigger:hover {
        transform: translateY(-1px);
        background: color-mix( in srgb, var(--mud-palette-primary) 12%, transparent);
        box-shadow: 0 12px 24px color-mix( in srgb, var(--mud-palette-primary) 12%, transparent);
    }

.bb-notification-menu[b-wo8oqf8yu7]  .bb-notification-trigger-unread {
    color: var(--mud-palette-primary) !important;
    border-color: color-mix( in srgb, var(--mud-palette-secondary) 28%, transparent);
    background: linear-gradient( 135deg, color-mix( in srgb, var(--mud-palette-primary) 12%, transparent), color-mix( in srgb, var(--mud-palette-secondary) 12%, transparent));
}

.bb-notification-panel[b-wo8oqf8yu7] {
    position: absolute;
    top: calc(100% + 34px);
    right: 0;
    z-index: 1400;
    width: min( 390px, calc(100vw - 28px));
    max-height: min( 560px, calc(100vh - 126px));
    overflow: hidden;
    border: 1px solid color-mix( in srgb, var(--mud-palette-primary) 12%, var(--mud-palette-divider));
    border-radius: 24px;
    background: radial-gradient( circle at 18% 0%, color-mix( in srgb, var(--mud-palette-primary) 10%, transparent), transparent 30%), radial-gradient( circle at 90% 8%, color-mix( in srgb, var(--mud-palette-secondary) 12%, transparent), transparent 32%), var(--mud-palette-surface);
    box-shadow: 0 28px 70px color-mix( in srgb, var(--mud-palette-primary) 18%, transparent), 0 12px 28px rgba(15, 23, 42, 0.12);
}

.bb-notification-panel-header[b-wo8oqf8yu7] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 18px 14px;
    border-bottom: 1px solid color-mix( in srgb, var(--mud-palette-divider) 74%, transparent);
}

    .bb-notification-panel-header > div[b-wo8oqf8yu7] {
        min-width: 0;
    }

.bb-notification-panel[b-wo8oqf8yu7]  .bb-notification-title {
    color: var(--mud-palette-text-primary) !important;
    font-weight: 950;
    letter-spacing: -0.02em;
}

.bb-notification-panel[b-wo8oqf8yu7]  .bb-notification-subtitle {
    display: block;
    margin-top: 2px;
    color: var(--mud-palette-text-secondary) !important;
    font-weight: 700;
}

.bb-notification-panel[b-wo8oqf8yu7]  .bb-notification-close {
    flex: 0 0 auto;
    margin-top: -4px;
    border-radius: 10px !important;
}

    .bb-notification-panel[b-wo8oqf8yu7]
     .bb-notification-close
    .mud-icon-root {
        color: var(--mud-palette-text-secondary) !important;
    }

.bb-notification-state[b-wo8oqf8yu7],
.bb-notification-empty[b-wo8oqf8yu7] {
    min-height: 190px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 30px 22px;
    text-align: center;
}

    .bb-notification-state[b-wo8oqf8yu7]  .mud-button-root {
        min-height: 40px;
        font-weight: 850;
        text-transform: none;
        border-radius: 11px !important;
    }

.bb-notification-empty-icon[b-wo8oqf8yu7] {
    width: 58px;
    height: 58px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--mud-palette-primary);
    border: 1px solid color-mix( in srgb, var(--mud-palette-primary) 12%, transparent);
    border-radius: 20px;
    background: color-mix( in srgb, var(--mud-palette-primary) 9%, transparent);
}

    .bb-notification-empty-icon[b-wo8oqf8yu7]  .mud-icon-root {
        color: var(--mud-palette-primary) !important;
    }

.bb-notification-panel[b-wo8oqf8yu7]  .bb-notification-empty-title {
    color: var(--mud-palette-text-primary) !important;
    font-weight: 900;
}

.bb-notification-panel[b-wo8oqf8yu7]  .bb-notification-empty-text {
    max-width: 250px;
    color: var(--mud-palette-text-secondary) !important;
    line-height: 1.5;
}

.bb-notification-list[b-wo8oqf8yu7] {
    max-height: 388px;
    overflow-y: auto;
    padding: 8px;
    scrollbar-width: thin;
    scrollbar-color: color-mix( in srgb, var(--mud-palette-primary) 24%, transparent) transparent;
}

.bb-notification-item[b-wo8oqf8yu7] {
    position: relative;
    width: 100%;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 42px 14px 14px;
    color: var(--mud-palette-text-primary);
    font-family: inherit;
    text-align: left;
    border: 0;
    border-radius: 14px;
    background: transparent;
    cursor: pointer;
    transition: background 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}

    .bb-notification-item:hover[b-wo8oqf8yu7] {
        transform: translateY(-1px);
        background: color-mix( in srgb, var(--mud-palette-primary) 7%, transparent);
    }

    .bb-notification-item:focus-visible[b-wo8oqf8yu7] {
        outline: 3px solid color-mix( in srgb, var(--mud-palette-secondary) 34%, transparent);
        outline-offset: 2px;
    }

.bb-notification-item-unread[b-wo8oqf8yu7] {
    background: linear-gradient( 135deg, color-mix( in srgb, var(--mud-palette-primary) 8%, transparent), color-mix( in srgb, var(--mud-palette-secondary) 6%, transparent));
}

.bb-notification-item-main[b-wo8oqf8yu7] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.bb-notification-item-title[b-wo8oqf8yu7] {
    color: var(--mud-palette-text-primary);
    font-size: 0.9rem;
    font-weight: 950;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.bb-notification-item-message[b-wo8oqf8yu7] {
    color: var(--mud-palette-text-secondary);
    font-size: 0.82rem;
    font-weight: 650;
    line-height: 1.42;
    overflow-wrap: anywhere;
}

.bb-notification-item-time[b-wo8oqf8yu7] {
    margin-top: 2px;
    color: color-mix( in srgb, var(--mud-palette-text-secondary) 78%, transparent);
    font-size: 0.74rem;
    font-weight: 750;
    letter-spacing: 0.01em;
}

.bb-notification-unread-dot[b-wo8oqf8yu7] {
    position: absolute;
    top: 18px;
    right: 18px;
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: var(--mud-palette-secondary);
    box-shadow: 0 0 0 5px color-mix( in srgb, var(--mud-palette-secondary) 14%, transparent);
}

.bb-notification-footer[b-wo8oqf8yu7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px 14px;
    border-top: 1px solid color-mix( in srgb, var(--mud-palette-divider) 72%, transparent);
}

    .bb-notification-footer[b-wo8oqf8yu7]  .mud-button-root {
        min-height: 40px;
        padding-inline: 12px;
        color: var(--mud-palette-primary) !important;
        font-size: 0.74rem;
        font-weight: 900;
        line-height: 1.15;
        letter-spacing: 0.01em;
        text-transform: none;
        border-radius: 10px !important;
    }

        .bb-notification-footer[b-wo8oqf8yu7]  .mud-button-root:hover {
            background: color-mix( in srgb, var(--mud-palette-primary) 7%, transparent);
        }

    .bb-notification-footer[b-wo8oqf8yu7]  .mud-button-label {
        color: inherit !important;
        font-family: inherit !important;
    }

    .bb-notification-footer[b-wo8oqf8yu7]
     .mud-button-start-icon,
    .bb-notification-footer[b-wo8oqf8yu7]
     .mud-button-icon-start {
        margin-inline-start: 0;
        margin-inline-end: 0.42rem;
    }

.bb-notification-footer-progress[b-wo8oqf8yu7] {
    margin-right: 0.45rem;
}

.bb-notification-footer[b-wo8oqf8yu7]
 .bb-notification-footer-progress
.mud-progress-circular-svg {
    width: 18px;
    height: 18px;
}

.bb-notification-footer[b-wo8oqf8yu7]
 .bb-notification-view-all-button {
    justify-content: flex-start;
}

.bb-notification-footer[b-wo8oqf8yu7]
 .bb-notification-mark-all-button {
    justify-content: flex-end;
}

@media (max-width: 768px) {
    .bb-notification-footer[b-wo8oqf8yu7] {
        display: grid;
        grid-template-columns: 1fr;
        align-items: stretch;
    }

        .bb-notification-footer[b-wo8oqf8yu7]  .mud-button-root {
            width: 100%;
            justify-content: center;
        }
}

    .bb-notification-footer[b-wo8oqf8yu7]  .mud-button-root {
        min-height: 40px;
        padding-inline: 12px;
        color: var(--mud-palette-primary) !important;
        font-size: 0.76rem;
        font-weight: 900;
        letter-spacing: 0.02em;
        text-transform: none;
        border-radius: 10px !important;
    }

        .bb-notification-footer[b-wo8oqf8yu7]  .mud-button-root:hover {
            background: color-mix( in srgb, var(--mud-palette-primary) 7%, transparent);
        }

    .bb-notification-footer[b-wo8oqf8yu7]  .mud-button-label {
        color: inherit !important;
        font-family: inherit !important;
    }

.bb-notification-footer-progress[b-wo8oqf8yu7] {
    margin-right: 0.45rem;
}

.bb-notification-footer[b-wo8oqf8yu7]
 .bb-notification-footer-progress
.mud-progress-circular-svg {
    width: 18px;
    height: 18px;
}

@media (max-width: 768px) {
    .bb-notification-menu[b-wo8oqf8yu7] {
        margin-left: 6px;
        margin-right: 6px;
    }

    .bb-notification-panel[b-wo8oqf8yu7] {
        position: fixed;
        top: 98px;
        right: 12px;
        left: 12px;
        width: auto;
        max-height: calc(100vh - 118px);
    }

    .bb-notification-list[b-wo8oqf8yu7] {
        max-height: calc(100vh - 318px);
    }

    .bb-notification-footer[b-wo8oqf8yu7] {
        align-items: stretch;
    }

        .bb-notification-footer[b-wo8oqf8yu7]  .mud-button-root {
            width: 100%;
            justify-content: center;
        }
}

@media (prefers-reduced-motion: reduce) {
    .bb-notification-menu[b-wo8oqf8yu7]  .bb-notification-trigger,
    .bb-notification-item[b-wo8oqf8yu7],
    .bb-notification-footer[b-wo8oqf8yu7]  .mud-button-root {
        transition: none;
    }
}
/* /Components/Owner/OwnerApprovalStatusPanel.razor.rz.scp.css */
.owner-approval-status-panel[b-fa90x94joq] {
    position: relative;
    overflow: hidden;
    padding: 1.25rem;
    border: 1px solid rgba(21, 50, 75, 0.1);
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(255, 253, 248, 0.98), rgba(247, 243, 234, 0.88));
    box-shadow: 0 16px 42px rgba(21, 50, 75, 0.08);
}

    .owner-approval-status-panel[b-fa90x94joq]::before {
        content: "";
        position: absolute;
        inset: 0 auto 0 0;
        width: 6px;
        background: var(--mud-palette-primary);
    }

.owner-approval-status-panel-approved[b-fa90x94joq]::before {
    background: var(--mud-palette-success);
}

.owner-approval-status-panel-pending[b-fa90x94joq]::before {
    background: var(--mud-palette-info);
}

.owner-approval-status-panel-warning[b-fa90x94joq]::before {
    background: var(--mud-palette-warning);
}

.owner-approval-status-main[b-fa90x94joq] {
    min-width: 0;
}

.owner-approval-status-avatar[b-fa90x94joq] {
    width: 52px;
    height: 52px;
    color: #ffffff !important;
    box-shadow: 0 14px 28px rgba(21, 50, 75, 0.16);
}

    .owner-approval-status-avatar[b-fa90x94joq]  .mud-icon-root {
        color: #ffffff !important;
    }

.owner-approval-status-copy[b-fa90x94joq] {
    min-width: 0;
}

.owner-approval-status-chip-row[b-fa90x94joq] {
    flex-wrap: wrap;
}

    .owner-approval-status-chip-row[b-fa90x94joq]  .mud-chip-root {
        font-family: inherit;
        font-size: 0.72rem;
        font-weight: 900;
        letter-spacing: 0.025em;
    }

    .owner-approval-status-chip-row[b-fa90x94joq]  .mud-chip-content,
    .owner-approval-status-chip-row[b-fa90x94joq]  .mud-icon-root {
        font-family: inherit;
        font-weight: 900;
    }

.owner-approval-status-title[b-fa90x94joq] {
    color: var(--mud-palette-primary);
    font-weight: 950;
    line-height: 1.2;
}

.owner-approval-status-message[b-fa90x94joq] {
    max-width: 760px;
    color: rgba(21, 50, 75, 0.7);
    font-size: 0.96rem;
    font-weight: 650;
    line-height: 1.5;
}

.owner-approval-status-reason[b-fa90x94joq] {
    max-width: 760px;
    margin-top: 0.35rem;
    border-radius: 14px;
}

.owner-approval-status-reason-title[b-fa90x94joq] {
    margin-bottom: 0.25rem;
    color: rgba(21, 50, 75, 0.92);
    font-weight: 950;
}

.owner-approval-status-reason-message[b-fa90x94joq] {
    color: rgba(21, 50, 75, 0.72);
    font-weight: 650;
    line-height: 1.5;
    white-space: pre-wrap;
}

.owner-approval-next-card[b-fa90x94joq] {
    height: 100%;
    padding: 1rem;
    border: 1px solid rgba(21, 50, 75, 0.09);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.62);
}

.owner-approval-next-eyebrow[b-fa90x94joq] {
    color: var(--mud-palette-secondary);
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.owner-approval-next-title[b-fa90x94joq] {
    color: var(--mud-palette-primary);
    font-weight: 950;
    line-height: 1.2;
}

.owner-approval-next-message[b-fa90x94joq] {
    color: rgba(21, 50, 75, 0.66);
    font-size: 0.88rem;
    font-weight: 650;
    line-height: 1.45;
}

.owner-approval-next-card[b-fa90x94joq]  .mud-button-root {
    min-height: 44px;
    font-family: inherit;
    font-size: 0.78rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.owner-approval-next-card[b-fa90x94joq]  .mud-button-label,
.owner-approval-next-card[b-fa90x94joq]  .mud-icon-root {
    font-family: inherit;
    font-weight: 950;
}

.owner-approval-next-card[b-fa90x94joq]  .mud-button-filled-secondary .mud-button-label,
.owner-approval-next-card[b-fa90x94joq]  .mud-button-filled-secondary .mud-icon-root,
.owner-approval-next-card[b-fa90x94joq]  .mud-button-filled-success .mud-button-label,
.owner-approval-next-card[b-fa90x94joq]  .mud-button-filled-success .mud-icon-root,
.owner-approval-next-card[b-fa90x94joq]  .mud-button-filled-warning .mud-button-label,
.owner-approval-next-card[b-fa90x94joq]  .mud-button-filled-warning .mud-icon-root {
    color: #ffffff !important;
}

.owner-approval-status-panel[b-fa90x94joq]  .mud-progress-linear {
    overflow: hidden;
    border-radius: 999px;
}

.owner-approval-status-panel[b-fa90x94joq]  .mud-alert {
    font-family: inherit;
}

.owner-approval-status-panel[b-fa90x94joq]  .mud-alert-message {
    font-family: inherit;
    font-weight: 650;
}

@media (max-width: 960px) {
    .owner-approval-status-panel[b-fa90x94joq] {
        padding: 1rem;
    }

    .owner-approval-next-card[b-fa90x94joq] {
        height: auto;
    }
}

@media (max-width: 600px) {
    .owner-approval-status-main[b-fa90x94joq] {
        flex-direction: column;
        align-items: stretch !important;
    }

    .owner-approval-status-avatar[b-fa90x94joq] {
        width: 48px;
        height: 48px;
    }
}
/* /Components/Owner/OwnerSalonPublicPreview.razor.rz.scp.css */
.owner-public-preview-root[b-v3c2dr2ovz] {
    --preview-primary: var(--mud-palette-primary);
    --preview-secondary: var(--mud-palette-secondary);
    --preview-surface: var(--mud-palette-surface);
    --preview-background: var(--mud-palette-background);
    --preview-text: var(--mud-palette-text-primary);
    --preview-muted: var(--mud-palette-text-secondary);
    --preview-divider: var(--mud-palette-divider);
    display: block;
}

    .owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-shell {
        padding: 1.15rem;
        border-radius: 24px;
        background: linear-gradient(135deg, color-mix(in srgb, var(--preview-surface) 96%, var(--preview-primary)), var(--preview-background));
        border: 1px solid color-mix(in srgb, var(--preview-primary) 11%, var(--preview-divider));
        box-shadow: 0 18px 46px color-mix(in srgb, var(--preview-text) 7%, transparent);
    }

    .owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-header {
        gap: 1rem;
    }

    .owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-eyebrow {
        color: var(--preview-secondary);
        font-size: 0.7rem;
        font-weight: 950;
        line-height: 1;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-title {
        color: var(--preview-primary);
        font-weight: 950;
        letter-spacing: -0.035em;
    }

.owner-public-preview-live-page[b-v3c2dr2ovz] {
    display: grid;
    gap: 1rem;
}

.owner-public-preview-hero[b-v3c2dr2ovz] {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.85fr);
    gap: 1.1rem;
    padding: 1.35rem;
    border-radius: 28px;
    background: radial-gradient(circle at 88% 14%, color-mix(in srgb, var(--preview-secondary) 18%, transparent), transparent 30%), radial-gradient(circle at 12% 92%, color-mix(in srgb, var(--preview-primary) 14%, transparent), transparent 32%), linear-gradient(135deg, color-mix(in srgb, var(--preview-surface) 98%, var(--preview-primary)), var(--preview-surface) 52%, color-mix(in srgb, var(--preview-secondary) 7%, var(--preview-surface)));
    border: 1px solid color-mix(in srgb, var(--preview-primary) 12%, var(--preview-divider));
    box-shadow: 0 22px 54px color-mix(in srgb, var(--preview-primary) 10%, transparent);
}

    .owner-public-preview-hero[b-v3c2dr2ovz]::before {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(112deg, color-mix(in srgb, var(--preview-surface) 80%, transparent), transparent 54%);
        pointer-events: none;
    }

.owner-public-preview-hero-copy[b-v3c2dr2ovz],
.owner-public-preview-hero-card[b-v3c2dr2ovz] {
    position: relative;
    z-index: 2;
}

.owner-public-preview-hero-copy[b-v3c2dr2ovz] {
    display: grid;
    align-content: center;
    gap: 0.82rem;
    min-width: 0;
}

.owner-public-preview-badge-row[b-v3c2dr2ovz],
.owner-public-preview-trust-row[b-v3c2dr2ovz],
.owner-public-preview-action-row[b-v3c2dr2ovz] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.52rem;
    align-items: center;
}

    .owner-public-preview-badge-row span[b-v3c2dr2ovz],
    .owner-public-preview-trust-row span[b-v3c2dr2ovz] {
        display: inline-flex;
        align-items: center;
        gap: 0.34rem;
        padding: 0.45rem 0.64rem;
        color: var(--preview-text);
        font-size: 0.72rem;
        font-weight: 850;
        line-height: 1;
        border-radius: 10px;
        background: color-mix(in srgb, var(--preview-primary) 6%, var(--preview-surface));
        border: 1px solid color-mix(in srgb, var(--preview-primary) 9%, var(--preview-divider));
    }

    .owner-public-preview-badge-row .mud-icon-root[b-v3c2dr2ovz],
    .owner-public-preview-trust-row .mud-icon-root[b-v3c2dr2ovz] {
        color: var(--preview-primary);
        font-size: 0.95rem;
    }

.owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-salon-name {
    max-width: 680px;
    color: var(--preview-text);
    font-size: clamp(1.75rem, 3vw, 2.55rem);
    font-weight: 950;
    line-height: 1.04;
    letter-spacing: -0.047em;
    text-wrap: balance;
    overflow-wrap: anywhere;
}

.owner-public-preview-location-line[b-v3c2dr2ovz] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 0.38rem;
    margin-top: 0.55rem;
    padding: 0.52rem 0.72rem;
    color: var(--preview-secondary);
    font-size: 0.82rem;
    font-weight: 850;
    border-radius: 10px;
    background: color-mix(in srgb, var(--preview-secondary) 8%, var(--preview-surface));
    border: 1px solid color-mix(in srgb, var(--preview-secondary) 13%, var(--preview-divider));
}

.owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-description {
    max-width: 720px;
    color: var(--preview-muted);
    font-size: 0.92rem;
    line-height: 1.55;
    font-weight: 620;
}

.owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-action-row .mud-button-root {
    min-height: 40px;
    border-radius: 10px !important;
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.035em;
    text-transform: uppercase;
}

.owner-public-preview-hero-card[b-v3c2dr2ovz] {
    position: relative;
    overflow: hidden;
    min-height: 280px;
    display: grid;
    align-content: space-between;
    gap: 0.9rem;
    padding: 1rem;
    color: #ffffff;
    border-radius: 24px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--preview-text) 92%, var(--preview-primary)), var(--preview-primary));
    border: 1px solid color-mix(in srgb, var(--preview-surface) 16%, transparent);
    box-shadow: 0 20px 48px color-mix(in srgb, var(--preview-text) 16%, transparent);
}

.owner-public-preview-hero-image[b-v3c2dr2ovz],
.owner-public-preview-hero-overlay[b-v3c2dr2ovz] {
    position: absolute;
    inset: 0;
}

.owner-public-preview-hero-image[b-v3c2dr2ovz] {
    z-index: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.01);
}

.owner-public-preview-hero-overlay[b-v3c2dr2ovz] {
    z-index: 1;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.18), rgba(15, 23, 42, 0.76));
    pointer-events: none;
}

.owner-public-preview-card-top[b-v3c2dr2ovz],
.owner-public-preview-card-main[b-v3c2dr2ovz],
.owner-public-preview-card-stats[b-v3c2dr2ovz] {
    position: relative;
    z-index: 2;
}

.owner-public-preview-card-top[b-v3c2dr2ovz] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.8rem;
}

.owner-public-preview-initials[b-v3c2dr2ovz] {
    width: 56px;
    height: 56px;
    display: grid;
    place-items: center;
    color: #ffffff;
    font-size: 1rem;
    font-weight: 950;
    letter-spacing: -0.04em;
    border-radius: 18px;
    background: rgba(255,255,255,0.18);
    border: 1px solid rgba(255,255,255,0.28);
    backdrop-filter: blur(12px);
}

.owner-public-preview-card-chips[b-v3c2dr2ovz] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.4rem;
}

    .owner-public-preview-card-chips span[b-v3c2dr2ovz] {
        padding: 0.28rem 0.5rem;
        color: rgba(255,255,255,0.92);
        font-size: 0.62rem;
        font-weight: 950;
        line-height: 1;
        text-transform: uppercase;
        letter-spacing: 0.06em;
        border-radius: 9px;
        background: rgba(255,255,255,0.15);
        border: 1px solid rgba(255,255,255,0.22);
    }

.owner-public-preview-card-main[b-v3c2dr2ovz] {
    display: grid;
    gap: 0.18rem;
}

    .owner-public-preview-card-main span[b-v3c2dr2ovz] {
        color: rgba(255,255,255,0.78);
        font-size: 0.68rem;
        font-weight: 950;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .owner-public-preview-card-main strong[b-v3c2dr2ovz] {
        color: #ffffff;
        font-size: 1.45rem;
        font-weight: 950;
        line-height: 1.08;
        letter-spacing: -0.04em;
        overflow-wrap: anywhere;
    }

    .owner-public-preview-card-main small[b-v3c2dr2ovz] {
        color: rgba(255,255,255,0.82);
        font-size: 0.82rem;
        font-weight: 700;
    }

.owner-public-preview-card-stats[b-v3c2dr2ovz] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
}

    .owner-public-preview-card-stats div[b-v3c2dr2ovz] {
        min-width: 0;
        display: grid;
        gap: 0.18rem;
        padding: 0.62rem;
        border-radius: 14px;
        background: rgba(255,255,255,0.13);
        border: 1px solid rgba(255,255,255,0.18);
        backdrop-filter: blur(10px);
    }

    .owner-public-preview-card-stats strong[b-v3c2dr2ovz] {
        overflow: hidden;
        color: #ffffff;
        font-size: 0.86rem;
        font-weight: 950;
        line-height: 1.12;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .owner-public-preview-card-stats span[b-v3c2dr2ovz] {
        color: rgba(255,255,255,0.74);
        font-size: 0.62rem;
        font-weight: 850;
        line-height: 1.15;
    }

.owner-public-preview-content-grid[b-v3c2dr2ovz] {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(240px, 0.6fr);
    gap: 1rem;
    align-items: start;
}

.owner-public-preview-main-column[b-v3c2dr2ovz],
.owner-public-preview-side-column[b-v3c2dr2ovz] {
    display: grid;
    gap: 1rem;
}

.owner-public-preview-panel[b-v3c2dr2ovz],
.owner-public-preview-side-card[b-v3c2dr2ovz] {
    padding: 1rem;
    border-radius: 22px;
    background: var(--preview-surface);
    border: 1px solid color-mix(in srgb, var(--preview-primary) 9%, var(--preview-divider));
    box-shadow: 0 14px 34px color-mix(in srgb, var(--preview-text) 6%, transparent);
}

.owner-public-preview-media-panel[b-v3c2dr2ovz],
.owner-public-preview-services-panel[b-v3c2dr2ovz] {
    background: radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--preview-secondary) 8%, transparent), transparent 30%), var(--preview-surface);
}

.owner-public-preview-section-header[b-v3c2dr2ovz] {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
    margin-bottom: 0.85rem;
}

    .owner-public-preview-section-header h3[b-v3c2dr2ovz],
    .owner-public-preview-side-card h3[b-v3c2dr2ovz] {
        margin: 0;
        color: var(--preview-text);
        font-size: 1rem;
        font-weight: 950;
        line-height: 1.18;
        letter-spacing: -0.025em;
    }

    .owner-public-preview-section-header p[b-v3c2dr2ovz],
    .owner-public-preview-side-card p[b-v3c2dr2ovz] {
        margin: 0.22rem 0 0;
        color: var(--preview-muted);
        font-size: 0.78rem;
        font-weight: 620;
        line-height: 1.38;
    }

    .owner-public-preview-section-header > span[b-v3c2dr2ovz] {
        flex: 0 0 auto;
        padding: 0.28rem 0.5rem;
        color: var(--preview-secondary);
        font-size: 0.62rem;
        font-weight: 950;
        line-height: 1;
        border-radius: 999px;
        background: color-mix(in srgb, var(--preview-secondary) 8%, var(--preview-surface));
        border: 1px solid color-mix(in srgb, var(--preview-secondary) 14%, var(--preview-divider));
    }

.owner-public-preview-gallery-grid[b-v3c2dr2ovz] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.65rem;
}

.owner-public-preview-gallery-card[b-v3c2dr2ovz] {
    position: relative;
    overflow: hidden;
    min-height: 130px;
    margin: 0;
    border-radius: 18px;
    background: color-mix(in srgb, var(--preview-primary) 8%, var(--preview-surface));
    border: 1px solid color-mix(in srgb, var(--preview-primary) 10%, var(--preview-divider));
}

.owner-public-preview-gallery-card-primary[b-v3c2dr2ovz] {
    grid-column: span 2;
    min-height: 200px;
}

.owner-public-preview-gallery-card img[b-v3c2dr2ovz] {
    width: 100%;
    height: 100%;
    min-height: inherit;
    display: block;
    object-fit: cover;
}

.owner-public-preview-gallery-card[b-v3c2dr2ovz]::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 50%, rgba(15, 23, 42, 0.52));
    pointer-events: none;
}

.owner-public-preview-gallery-card figcaption[b-v3c2dr2ovz] {
    position: absolute;
    left: 0.62rem;
    bottom: 0.58rem;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.32rem 0.5rem;
    color: #ffffff;
    font-size: 0.64rem;
    font-weight: 950;
    line-height: 1;
    border-radius: 9px;
    background: rgba(15, 23, 42, 0.54);
    border: 1px solid rgba(255,255,255,0.18);
    backdrop-filter: blur(10px);
}

.owner-public-preview-service-list[b-v3c2dr2ovz],
.owner-public-preview-professional-grid[b-v3c2dr2ovz] {
    display: grid;
    gap: 0.75rem;
}

.owner-public-preview-service-card[b-v3c2dr2ovz] {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.85rem;
    align-items: center;
    padding: 0.88rem;
    cursor: default;
    border-radius: 20px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--preview-surface) 96%, white), color-mix(in srgb, var(--preview-primary) 5%, var(--preview-surface)));
    border: 1px solid color-mix(in srgb, var(--preview-primary) 13%, var(--preview-divider));
    box-shadow: 0 12px 26px color-mix(in srgb, var(--preview-text) 5%, transparent);
}

.owner-public-preview-service-media[b-v3c2dr2ovz] {
    width: 64px;
    height: 58px;
    overflow: hidden;
    display: grid;
    place-items: center;
    color: #ffffff;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--preview-primary), var(--preview-secondary));
}

    .owner-public-preview-service-media img[b-v3c2dr2ovz] {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
    }

.owner-public-preview-service-copy[b-v3c2dr2ovz] {
    min-width: 0;
    display: grid;
    gap: 0.3rem;
}

    .owner-public-preview-service-copy strong[b-v3c2dr2ovz],
    .owner-public-preview-professional-card strong[b-v3c2dr2ovz] {
        overflow: hidden;
        color: var(--preview-text);
        font-size: 0.9rem;
        font-weight: 950;
        line-height: 1.15;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .owner-public-preview-service-copy p[b-v3c2dr2ovz],
    .owner-public-preview-professional-card p[b-v3c2dr2ovz] {
        display: -webkit-box;
        overflow: hidden;
        margin: 0;
        color: var(--preview-muted);
        font-size: 0.74rem;
        font-weight: 620;
        line-height: 1.34;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .owner-public-preview-service-copy div[b-v3c2dr2ovz] {
        display: flex;
        flex-wrap: wrap;
        gap: 0.38rem;
    }

    .owner-public-preview-service-copy span[b-v3c2dr2ovz],
    .owner-public-preview-service-side small[b-v3c2dr2ovz] {
        padding: 0.28rem 0.46rem;
        color: var(--preview-text);
        font-size: 0.64rem;
        font-weight: 850;
        line-height: 1;
        border-radius: 9px;
        background: color-mix(in srgb, var(--preview-primary) 6%, var(--preview-surface));
        border: 1px solid color-mix(in srgb, var(--preview-primary) 9%, var(--preview-divider));
    }

.owner-public-preview-service-side[b-v3c2dr2ovz] {
    min-width: 100px;
    display: grid;
    justify-items: end;
    gap: 0.35rem;
}

    .owner-public-preview-service-side strong[b-v3c2dr2ovz] {
        color: var(--preview-text);
        font-size: 0.86rem;
        font-weight: 950;
        text-align: right;
        line-height: 1.15;
    }

    .owner-public-preview-service-side small[b-v3c2dr2ovz] {
        color: var(--preview-secondary);
        text-transform: uppercase;
        letter-spacing: 0.04em;
    }

.owner-public-preview-professional-grid[b-v3c2dr2ovz] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.owner-public-preview-professional-card[b-v3c2dr2ovz] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.7rem;
    padding: 0.82rem;
    border-radius: 18px;
    background: color-mix(in srgb, var(--preview-surface) 96%, transparent);
    border: 1px solid color-mix(in srgb, var(--preview-primary) 9%, var(--preview-divider));
}

.owner-public-preview-professional-avatar[b-v3c2dr2ovz] {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    color: #ffffff;
    font-size: 0.78rem;
    font-weight: 950;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--preview-secondary), var(--preview-primary));
}

.owner-public-preview-professional-card div:last-child[b-v3c2dr2ovz] {
    min-width: 0;
    display: grid;
    gap: 0.15rem;
}

.owner-public-preview-professional-card small[b-v3c2dr2ovz] {
    overflow: hidden;
    color: var(--preview-secondary);
    font-size: 0.7rem;
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.owner-public-preview-empty-block[b-v3c2dr2ovz] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.75rem;
    align-items: center;
    padding: 0.95rem;
    border-radius: 18px;
    background: color-mix(in srgb, var(--preview-primary) 6%, var(--preview-surface));
    border: 1px dashed color-mix(in srgb, var(--preview-primary) 14%, var(--preview-divider));
}

    .owner-public-preview-empty-block .mud-icon-root[b-v3c2dr2ovz] {
        color: var(--preview-secondary);
        font-size: 1.75rem;
    }

    .owner-public-preview-empty-block strong[b-v3c2dr2ovz] {
        color: var(--preview-text);
        font-weight: 950;
    }

    .owner-public-preview-empty-block span[b-v3c2dr2ovz] {
        color: var(--preview-muted);
        font-size: 0.78rem;
        font-weight: 620;
        line-height: 1.36;
    }

.owner-public-preview-side-card[b-v3c2dr2ovz] {
    display: grid;
    gap: 0.75rem;
}

.owner-public-preview-signal-grid[b-v3c2dr2ovz] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
}

    .owner-public-preview-signal-grid div[b-v3c2dr2ovz] {
        min-width: 0;
        display: grid;
        gap: 0.12rem;
        padding: 0.7rem;
        border-radius: 14px;
        background: color-mix(in srgb, var(--preview-primary) 5%, var(--preview-surface));
        border: 1px solid color-mix(in srgb, var(--preview-primary) 9%, var(--preview-divider));
    }

    .owner-public-preview-signal-grid strong[b-v3c2dr2ovz] {
        color: var(--preview-text);
        font-size: 1rem;
        font-weight: 950;
        line-height: 1;
    }

    .owner-public-preview-signal-grid span[b-v3c2dr2ovz] {
        color: var(--preview-muted);
        font-size: 0.66rem;
        font-weight: 760;
        line-height: 1.2;
    }

.owner-public-preview-status-card[b-v3c2dr2ovz] {
    grid-template-columns: auto 1fr;
    align-items: start;
    gap: 0.75rem;
}

    .owner-public-preview-status-card .mud-icon-root[b-v3c2dr2ovz] {
        color: var(--preview-secondary);
        font-size: 1.55rem;
    }

.owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-alert {
    border-radius: 14px;
}

@media (max-width: 1100px) {
    .owner-public-preview-hero[b-v3c2dr2ovz],
    .owner-public-preview-content-grid[b-v3c2dr2ovz] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .owner-public-preview-gallery-grid[b-v3c2dr2ovz],
    .owner-public-preview-professional-grid[b-v3c2dr2ovz],
    .owner-public-preview-signal-grid[b-v3c2dr2ovz] {
        grid-template-columns: 1fr;
    }

    .owner-public-preview-gallery-card-primary[b-v3c2dr2ovz] {
        grid-column: auto;
        min-height: 170px;
    }

    .owner-public-preview-service-card[b-v3c2dr2ovz] {
        grid-template-columns: 1fr;
    }

    .owner-public-preview-service-side[b-v3c2dr2ovz] {
        min-width: 0;
        justify-items: start;
    }
}

@media (max-width: 600px) {
    .owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-shell,
    .owner-public-preview-hero[b-v3c2dr2ovz],
    .owner-public-preview-panel[b-v3c2dr2ovz],
    .owner-public-preview-side-card[b-v3c2dr2ovz] {
        padding: 0.9rem;
        border-radius: 20px;
    }

    .owner-public-preview-hero-card[b-v3c2dr2ovz] {
        min-height: 240px;
    }

    .owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-salon-name {
        font-size: 1.75rem;
    }

    .owner-public-preview-action-row .mud-button-root[b-v3c2dr2ovz] {
        width: 100%;
    }
}

/* BB-PUBLIC-PROFILE-UX-01 fullscreen image affordance */
.owner-public-preview-expand-button[b-v3c2dr2ovz] {
    position: absolute;
    right: 0.58rem;
    bottom: 0.58rem;
    z-index: 4;
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    color: #ffffff;
    background: rgba(15, 23, 42, 0.66);
    border: 1px solid rgba(255,255,255,0.22);
    border-radius: 11px;
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.22);
    backdrop-filter: blur(12px);
    cursor: pointer;
    transition: transform 150ms ease, background 150ms ease, border-color 150ms ease, box-shadow 150ms ease;
}

    .owner-public-preview-expand-button:hover[b-v3c2dr2ovz],
    .owner-public-preview-expand-button:focus-visible[b-v3c2dr2ovz] {
        transform: translateY(-1px) scale(1.04);
        background: color-mix(in srgb, var(--preview-primary) 82%, rgba(15, 23, 42, 0.74));
        border-color: rgba(255,255,255,0.34);
        box-shadow: 0 16px 30px color-mix(in srgb, var(--preview-primary) 20%, transparent);
        outline: none;
    }

.owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-expand-button .mud-icon-root {
    color: #ffffff !important;
    font-size: 0.95rem;
}

.owner-public-preview-hero-expand-button[b-v3c2dr2ovz] {
    right: 0.78rem;
    bottom: 0.78rem;
}

.owner-public-preview-service-media[b-v3c2dr2ovz] {
    position: relative;
}

.owner-public-preview-service-expand-button[b-v3c2dr2ovz] {
    right: 0.34rem;
    bottom: 0.34rem;
    width: 28px;
    height: 28px;
    border-radius: 9px;
}

@media (max-width: 600px) {
    .owner-public-preview-expand-button[b-v3c2dr2ovz] {
        width: 32px;
        height: 32px;
        right: 0.5rem;
        bottom: 0.5rem;
    }
}


/* BB-PUBLIC-PROFILE-UX-01 v02 make preview fullscreen affordance visible */
.owner-public-preview-expand-button[b-v3c2dr2ovz] {
    width: auto !important;
    min-width: 34px !important;
    height: 34px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.32rem !important;
    padding: 0 0.54rem !important;
}

    .owner-public-preview-expand-button span[b-v3c2dr2ovz] {
        color: #ffffff;
        font-size: 0.62rem;
        font-weight: 950;
        line-height: 1;
        letter-spacing: 0.035em;
        text-transform: uppercase;
    }

.owner-public-preview-service-expand-button[b-v3c2dr2ovz] {
    width: auto !important;
    min-width: 28px !important;
    height: 28px !important;
    padding: 0 0.42rem !important;
}

    .owner-public-preview-service-expand-button span[b-v3c2dr2ovz] {
        font-size: 0.56rem;
    }

.owner-public-preview-lightbox-hint[b-v3c2dr2ovz] {
    width: fit-content;
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    gap: 0.42rem;
    margin: -0.15rem 0 0.1rem;
    padding: 0.44rem 0.64rem;
    color: var(--preview-text);
    font-size: 0.74rem;
    font-weight: 850;
    line-height: 1.25;
    border-radius: 999px;
    background: color-mix(in srgb, var(--preview-primary) 7%, var(--preview-surface));
    border: 1px solid color-mix(in srgb, var(--preview-primary) 12%, var(--preview-divider));
}

    .owner-public-preview-lightbox-hint .mud-icon-root[b-v3c2dr2ovz] {
        color: var(--preview-secondary);
    }

@media (max-width: 600px) {
    .owner-public-preview-expand-button span[b-v3c2dr2ovz] {
        display: none;
    }

    .owner-public-preview-expand-button[b-v3c2dr2ovz] {
        width: 32px !important;
        min-width: 32px !important;
        padding: 0 !important;
    }
}

/* BB-PUBLIC-PROFILE-UX-01B public profile presentation parity */
.owner-public-preview-root[b-v3c2dr2ovz] {
    --preview-primary: var(--mud-palette-primary);
    --preview-secondary: var(--mud-palette-secondary);
    --preview-surface: var(--mud-palette-surface);
    --preview-background: var(--mud-palette-background);
    --preview-text: var(--mud-palette-text-primary);
    --preview-muted: var(--mud-palette-text-secondary);
    --preview-divider: var(--mud-palette-divider);
}

    .owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-shell {
        max-width: 100%;
    }

.owner-public-preview-live-page[b-v3c2dr2ovz] {
    max-width: 1180px;
    margin-inline: auto;
}

.owner-public-preview-hero[b-v3c2dr2ovz] {
    padding: clamp(1rem, 2vw, 1.45rem);
    border-radius: 26px;
    background: radial-gradient(circle at 86% 6%, color-mix(in srgb, var(--preview-secondary) 13%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--preview-surface) 97%, var(--preview-secondary)), color-mix(in srgb, var(--preview-background) 82%, var(--preview-surface)));
    border: 1px solid color-mix(in srgb, var(--preview-secondary) 18%, var(--preview-divider));
    box-shadow: 0 22px 56px color-mix(in srgb, var(--preview-primary) 10%, transparent);
}

.owner-public-preview-content-grid[b-v3c2dr2ovz] {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
    gap: 1rem;
}

.owner-public-preview-panel[b-v3c2dr2ovz],
.owner-public-preview-side-card[b-v3c2dr2ovz] {
    border-radius: 22px;
    background: radial-gradient(circle at 94% 8%, color-mix(in srgb, var(--preview-secondary) 7%, transparent), transparent 30%), var(--preview-surface);
    border: 1px solid color-mix(in srgb, var(--preview-primary) 10%, var(--preview-divider));
    box-shadow: 0 16px 40px color-mix(in srgb, var(--preview-primary) 7%, transparent);
}

.owner-public-preview-booking-card[b-v3c2dr2ovz] {
    position: sticky;
    top: 1rem;
    display: grid;
    gap: 0.85rem;
    border-top: 4px solid var(--preview-primary);
}

.owner-public-preview-booking-header[b-v3c2dr2ovz],
.owner-public-preview-location-card-header[b-v3c2dr2ovz],
.owner-public-preview-status-card[b-v3c2dr2ovz] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.75rem;
    align-items: center;
}

    .owner-public-preview-booking-icon[b-v3c2dr2ovz],
    .owner-public-preview-location-card-header > .mud-icon-root[b-v3c2dr2ovz],
    .owner-public-preview-status-card > .mud-icon-root[b-v3c2dr2ovz] {
        width: 46px;
        height: 46px;
        display: grid;
        place-items: center;
        color: #ffffff;
        border-radius: 16px;
        background: linear-gradient(135deg, var(--preview-primary), var(--preview-secondary));
        box-shadow: 0 12px 26px color-mix(in srgb, var(--preview-primary) 14%, transparent);
    }

.owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-booking-icon .mud-icon-root,
.owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-location-card-header > .mud-icon-root,
.owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-status-card > .mud-icon-root {
    color: #ffffff !important;
}

.owner-public-preview-booking-note[b-v3c2dr2ovz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.68rem 0.78rem;
    color: var(--preview-text);
    font-size: 0.78rem;
    font-weight: 760;
    border-radius: 14px;
    background: color-mix(in srgb, var(--preview-secondary) 7%, var(--preview-surface));
    border: 1px solid color-mix(in srgb, var(--preview-secondary) 12%, var(--preview-divider));
}

.owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-booking-note .mud-icon-root {
    color: var(--preview-secondary);
}

.owner-public-preview-booking-flow[b-v3c2dr2ovz] {
    display: grid;
    gap: 0.65rem;
    padding: 0.75rem;
    border-radius: 18px;
    border: 1px solid color-mix(in srgb, var(--preview-primary) 10%, var(--preview-divider));
    background: color-mix(in srgb, var(--preview-primary) 4%, var(--preview-surface));
}

.owner-public-preview-booking-flow-title[b-v3c2dr2ovz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
}

    .owner-public-preview-booking-flow-title span[b-v3c2dr2ovz],
    .owner-public-preview-booking-summary span[b-v3c2dr2ovz],
    .owner-public-preview-booking-fields div span[b-v3c2dr2ovz] {
        color: var(--preview-secondary);
        font-size: 0.64rem;
        font-weight: 950;
        letter-spacing: 0.075em;
        text-transform: uppercase;
    }

    .owner-public-preview-booking-flow-title strong[b-v3c2dr2ovz] {
        color: var(--preview-text);
        font-size: 0.78rem;
        font-weight: 950;
    }

.owner-public-preview-booking-flow-grid[b-v3c2dr2ovz] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
}

.owner-public-preview-booking-flow-step[b-v3c2dr2ovz] {
    min-width: 0;
    display: grid;
    gap: 0.18rem;
    padding: 0.66rem;
    border-radius: 15px;
    background: color-mix(in srgb, var(--preview-surface) 88%, transparent);
    border: 1px solid color-mix(in srgb, var(--preview-primary) 9%, var(--preview-divider));
}

.owner-public-preview-booking-flow-step-active[b-v3c2dr2ovz] {
    background: linear-gradient(135deg, color-mix(in srgb, var(--preview-primary) 92%, var(--preview-secondary)), var(--preview-primary));
    border-color: color-mix(in srgb, var(--preview-primary) 55%, var(--preview-secondary));
}

.owner-public-preview-booking-flow-step span:first-child[b-v3c2dr2ovz] {
    width: 26px;
    height: 26px;
    display: grid;
    place-items: center;
    color: #ffffff;
    font-size: 0.72rem;
    font-weight: 950;
    line-height: 1;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--preview-primary), var(--preview-secondary));
}

.owner-public-preview-booking-flow-step-active span:first-child[b-v3c2dr2ovz] {
    background: color-mix(in srgb, #ffffff 18%, transparent);
    border: 1px solid rgba(255,255,255,0.18);
}

.owner-public-preview-booking-flow-step strong[b-v3c2dr2ovz] {
    color: var(--preview-text);
    font-size: 0.78rem;
    font-weight: 950;
    line-height: 1.1;
}

.owner-public-preview-booking-flow-step small[b-v3c2dr2ovz] {
    overflow: hidden;
    color: var(--preview-muted);
    font-size: 0.68rem;
    font-weight: 780;
    line-height: 1.1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.owner-public-preview-booking-flow-step-active strong[b-v3c2dr2ovz],
.owner-public-preview-booking-flow-step-active small[b-v3c2dr2ovz] {
    color: #ffffff;
}

.owner-public-preview-booking-summary[b-v3c2dr2ovz],
.owner-public-preview-booking-fields[b-v3c2dr2ovz] {
    display: grid;
    gap: 0.45rem;
    padding: 0.78rem;
    border: 1px solid color-mix(in srgb, var(--preview-primary) 10%, var(--preview-divider));
    background: color-mix(in srgb, var(--preview-surface) 92%, var(--preview-primary));
    border-radius: 16px;
}

    .owner-public-preview-booking-summary strong[b-v3c2dr2ovz] {
        overflow: hidden;
        color: var(--preview-text);
        font-size: 0.82rem;
        font-weight: 950;
        line-height: 1.2;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .owner-public-preview-booking-fields div[b-v3c2dr2ovz] {
        min-width: 0;
        display: grid;
        grid-template-columns: 1fr auto;
        gap: 0.15rem 0.5rem;
        align-items: center;
        padding: 0.68rem;
        border: 1px solid color-mix(in srgb, var(--preview-primary) 10%, var(--preview-divider));
        border-radius: 14px;
        background: var(--preview-surface);
    }

        .owner-public-preview-booking-fields div span[b-v3c2dr2ovz] {
            grid-column: 1 / -1;
        }

        .owner-public-preview-booking-fields div strong[b-v3c2dr2ovz] {
            overflow: hidden;
            color: var(--preview-text);
            font-size: 0.82rem;
            font-weight: 850;
            line-height: 1.2;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

.owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-booking-button {
    min-height: 46px;
    border-radius: 12px !important;
    font-family: inherit;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.owner-public-preview-location-box[b-v3c2dr2ovz] {
    display: grid;
    gap: 0.15rem;
    margin-top: 0.75rem;
    padding: 0.78rem;
    border: 1px solid color-mix(in srgb, var(--preview-primary) 10%, var(--preview-divider));
    border-radius: 16px;
    background: color-mix(in srgb, var(--preview-primary) 4%, var(--preview-surface));
}

    .owner-public-preview-location-box strong[b-v3c2dr2ovz] {
        color: var(--preview-text);
        font-size: 0.86rem;
        font-weight: 950;
    }

    .owner-public-preview-location-box span[b-v3c2dr2ovz] {
        color: var(--preview-muted);
        font-size: 0.78rem;
        font-weight: 780;
    }

.owner-public-preview-status-card[b-v3c2dr2ovz] {
    align-items: start;
}

@media (max-width: 960px) {
    .owner-public-preview-content-grid[b-v3c2dr2ovz] {
        grid-template-columns: 1fr;
    }

    .owner-public-preview-booking-card[b-v3c2dr2ovz] {
        position: relative;
        top: auto;
    }
}

/* BB-PUBLIC-PROFILE-UX-01C final owner preview polish */
.owner-public-preview-service-mini-gallery[b-v3c2dr2ovz] {
    display: flex;
    align-items: center;
    gap: 0.34rem;
    margin-top: 0.18rem;
}

    .owner-public-preview-service-mini-gallery button[b-v3c2dr2ovz] {
        position: relative;
        overflow: hidden;
        width: 34px;
        height: 30px;
        padding: 0;
        border: 1px solid color-mix(in srgb, var(--preview-primary) 12%, var(--preview-divider));
        border-radius: 9px;
        background: color-mix(in srgb, var(--preview-surface) 88%, transparent);
        box-shadow: 0 8px 18px color-mix(in srgb, var(--preview-primary) 5%, transparent);
        cursor: pointer;
    }

    .owner-public-preview-service-mini-gallery img[b-v3c2dr2ovz] {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
        transition: transform 150ms ease, filter 150ms ease;
    }

    .owner-public-preview-service-mini-gallery button:hover img[b-v3c2dr2ovz],
    .owner-public-preview-service-mini-gallery button:focus-visible img[b-v3c2dr2ovz] {
        transform: scale(1.07);
        filter: saturate(1.08) contrast(1.03);
    }

    .owner-public-preview-service-mini-gallery button:focus-visible[b-v3c2dr2ovz] {
        outline: 2px solid color-mix(in srgb, var(--preview-secondary) 70%, #ffffff);
        outline-offset: 2px;
    }

.owner-public-preview-booking-card[b-v3c2dr2ovz] {
    position: relative !important;
    top: auto !important;
    align-self: start;
}

.owner-public-preview-side-column[b-v3c2dr2ovz] {
    display: grid;
    align-content: start;
    gap: 1rem;
}

@media (max-width: 600px) {
    .owner-public-preview-service-mini-gallery button[b-v3c2dr2ovz] {
        width: 38px;
        height: 32px;
    }
}


/* BB-PUBLIC-PROFILE-UX-01B final mobile/location polish */
.owner-public-preview-booking-card[b-v3c2dr2ovz] {
    position: relative !important;
    top: auto !important;
}

.owner-public-preview-location-box[b-v3c2dr2ovz] {
    grid-template-columns: auto 1fr;
    align-items: center;
    column-gap: 0.65rem;
}

    .owner-public-preview-location-box > .mud-icon-root[b-v3c2dr2ovz] {
        width: 34px;
        height: 34px;
        display: grid;
        place-items: center;
        color: #ffffff !important;
        border-radius: 12px;
        background: linear-gradient(135deg, var(--preview-primary), var(--preview-secondary));
        box-shadow: 0 10px 20px color-mix(in srgb, var(--preview-primary) 12%, transparent);
    }

    .owner-public-preview-location-box > div[b-v3c2dr2ovz] {
        min-width: 0;
        display: grid;
        gap: 0.12rem;
    }

@media (max-width: 760px) {
    .owner-public-preview-location-box[b-v3c2dr2ovz] {
        grid-template-columns: auto 1fr;
    }
}


/* BB-PUBLIC-SALON-LOCATION-01B owner preview location parity */
.owner-public-preview-location-card[b-v3c2dr2ovz] {
    gap: 0.85rem;
}

    .owner-public-preview-location-card .mud-button-root[b-v3c2dr2ovz] {
        min-height: 42px;
        border-radius: 12px !important;
        font-family: inherit;
        font-weight: 950;
        letter-spacing: 0.035em;
        text-transform: uppercase;
    }

    .owner-public-preview-location-card .mud-button-label[b-v3c2dr2ovz],
    .owner-public-preview-location-card .mud-icon-root[b-v3c2dr2ovz] {
        font-family: inherit;
        font-weight: 950;
    }

.owner-public-preview-location-box small[b-v3c2dr2ovz] {
    color: var(--preview-muted);
    font-size: 0.72rem;
    font-weight: 720;
    line-height: 1.25;
}

.owner-public-preview-location-meta[b-v3c2dr2ovz] {
    display: grid;
    gap: 0.45rem;
    padding: 0.78rem;
    border-radius: 16px;
    color: var(--preview-muted);
    font-size: 0.76rem;
    font-weight: 720;
    line-height: 1.38;
    background: linear-gradient(135deg, color-mix(in srgb, var(--preview-secondary) 6%, var(--preview-surface)), color-mix(in srgb, var(--preview-primary) 4%, var(--preview-surface)));
    border: 1px solid color-mix(in srgb, var(--preview-secondary) 11%, var(--preview-divider));
}

.owner-public-preview-location-pill[b-v3c2dr2ovz] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 0.32rem;
    padding: 0.34rem 0.56rem;
    color: var(--preview-primary);
    font-size: 0.66rem;
    font-weight: 950;
    line-height: 1;
    letter-spacing: 0.055em;
    text-transform: uppercase;
    border-radius: 999px;
    background: color-mix(in srgb, var(--preview-primary) 8%, var(--preview-surface));
    border: 1px solid color-mix(in srgb, var(--preview-primary) 12%, var(--preview-divider));
}

.owner-public-preview-location-pill-verified[b-v3c2dr2ovz] {
    color: var(--preview-secondary);
    background: color-mix(in srgb, var(--preview-secondary) 9%, var(--preview-surface));
    border-color: color-mix(in srgb, var(--preview-secondary) 16%, var(--preview-divider));
}

.owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-location-pill .mud-icon-root {
    color: currentColor !important;
    font-size: 0.9rem;
}

/* BB-OWNER-PUBLIC-PREVIEW-V4 — public-profile fidelity refinements */
.owner-public-preview-professional-avatar-with-image[b-v3c2dr2ovz] {
    overflow: hidden;
    padding: 0;
    background: color-mix(in srgb, var(--preview-primary) 7%, var(--preview-surface));
    border: 2px solid color-mix(in srgb, var(--preview-surface) 90%, transparent);
}

    .owner-public-preview-professional-avatar-with-image img[b-v3c2dr2ovz] {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
    }

.owner-public-preview-map-preview[b-v3c2dr2ovz] {
    position: relative;
    overflow: hidden;
    min-height: 190px;
    margin-top: 0.75rem;
    border-radius: 20px;
    background: linear-gradient(24deg, transparent 46%, color-mix(in srgb, var(--preview-surface) 95%, transparent) 47% 53%, transparent 54%), linear-gradient(-32deg, transparent 46%, color-mix(in srgb, var(--preview-surface) 95%, transparent) 47% 53%, transparent 54%), radial-gradient(circle at 28% 32%, color-mix(in srgb, var(--preview-secondary) 16%, transparent), transparent 24%), color-mix(in srgb, var(--preview-primary) 7%, var(--preview-surface));
    border: 1px solid color-mix(in srgb, var(--preview-primary) 10%, var(--preview-divider));
    box-shadow: inset 0 1px 0 color-mix(in srgb, white 55%, transparent);
}

    .owner-public-preview-map-preview[b-v3c2dr2ovz]::before,
    .owner-public-preview-map-preview[b-v3c2dr2ovz]::after {
        content: "";
        position: absolute;
        border-radius: 999px;
        background: color-mix(in srgb, var(--preview-secondary) 12%, transparent);
    }

    .owner-public-preview-map-preview[b-v3c2dr2ovz]::before {
        width: 130px;
        height: 130px;
        left: -34px;
        bottom: -48px;
    }

    .owner-public-preview-map-preview[b-v3c2dr2ovz]::after {
        width: 95px;
        height: 95px;
        right: -22px;
        top: -28px;
    }

.owner-public-preview-map-road[b-v3c2dr2ovz] {
    position: absolute;
    height: 9px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--preview-surface) 88%, var(--preview-background));
    border: 1px solid color-mix(in srgb, var(--preview-primary) 6%, var(--preview-divider));
    box-shadow: 0 3px 8px color-mix(in srgb, var(--preview-text) 5%, transparent);
}

.owner-public-preview-map-road-one[b-v3c2dr2ovz] {
    width: 145%;
    left: -22%;
    top: 42%;
    transform: rotate(-17deg);
}

.owner-public-preview-map-road-two[b-v3c2dr2ovz] {
    width: 120%;
    left: -8%;
    top: 65%;
    transform: rotate(12deg);
}

.owner-public-preview-map-road-three[b-v3c2dr2ovz] {
    width: 95%;
    left: 12%;
    top: 22%;
    transform: rotate(32deg);
}

.owner-public-preview-map-pin[b-v3c2dr2ovz] {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 3;
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    color: #ffffff;
    border-radius: 50% 50% 50% 10%;
    background: linear-gradient(135deg, var(--preview-primary), var(--preview-secondary));
    border: 3px solid color-mix(in srgb, var(--preview-surface) 90%, transparent);
    box-shadow: 0 16px 34px color-mix(in srgb, var(--preview-primary) 24%, transparent);
    transform: translate(-50%, -60%) rotate(-45deg);
}

    .owner-public-preview-map-pin .mud-icon-root[b-v3c2dr2ovz] {
        color: #ffffff;
        transform: rotate(45deg);
    }

.owner-public-preview-map-preview > small[b-v3c2dr2ovz] {
    position: absolute;
    right: 0.7rem;
    bottom: 0.65rem;
    z-index: 3;
    padding: 0.34rem 0.55rem;
    color: var(--preview-text);
    font-size: 0.64rem;
    font-weight: 900;
    border-radius: 999px;
    background: color-mix(in srgb, var(--preview-surface) 88%, transparent);
    border: 1px solid color-mix(in srgb, var(--preview-primary) 8%, var(--preview-divider));
    backdrop-filter: blur(10px);
}


/* BB-OWNER-PUBLIC-PREVIEW-V5 — match the live public service cards and map branding */
.owner-public-preview-services-panel[b-v3c2dr2ovz] {
    background: radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--preview-primary) 9%, transparent), transparent 30%), radial-gradient(circle at 10% 94%, color-mix(in srgb, var(--preview-secondary) 8%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--preview-surface) 94%, var(--preview-primary)), color-mix(in srgb, var(--preview-surface) 91%, var(--preview-secondary)));
}

.owner-public-preview-service-list[b-v3c2dr2ovz] {
    gap: 1rem;
}

.owner-public-preview-service-card[b-v3c2dr2ovz] {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 1.15rem;
    align-items: center;
    min-height: 132px;
    padding: 1.18rem 1.28rem;
    border-radius: 28px;
    background: radial-gradient(circle at 7% 12%, color-mix(in srgb, var(--preview-primary) 13%, transparent), transparent 28%), radial-gradient(circle at 94% 10%, color-mix(in srgb, var(--preview-secondary) 16%, transparent), transparent 34%), radial-gradient(circle at 86% 94%, color-mix(in srgb, var(--preview-primary) 9%, transparent), transparent 36%), linear-gradient(135deg, color-mix(in srgb, var(--preview-surface) 96%, white) 0%, color-mix(in srgb, var(--preview-primary) 5%, var(--preview-surface)) 48%, color-mix(in srgb, var(--preview-secondary) 6%, var(--preview-surface)) 100%);
    border: 1px solid color-mix(in srgb, var(--preview-primary) 18%, var(--preview-divider));
    box-shadow: 0 18px 42px color-mix(in srgb, var(--preview-text) 8%, transparent), 0 7px 20px color-mix(in srgb, var(--preview-primary) 6%, transparent), inset 0 1px 0 color-mix(in srgb, white 82%, transparent);
}

    .owner-public-preview-service-card[b-v3c2dr2ovz]::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 0;
        background: linear-gradient(105deg, color-mix(in srgb, white 60%, transparent) 0%, color-mix(in srgb, white 26%, transparent) 36%, transparent 72%), linear-gradient(90deg, color-mix(in srgb, var(--preview-primary) 5%, transparent), transparent 30%, color-mix(in srgb, var(--preview-secondary) 6%, transparent));
        pointer-events: none;
    }

    .owner-public-preview-service-card[b-v3c2dr2ovz]::after {
        content: "";
        position: absolute;
        right: -58px;
        bottom: -78px;
        z-index: 0;
        width: 190px;
        height: 190px;
        border-radius: 999px;
        background: color-mix(in srgb, var(--preview-secondary) 9%, transparent);
        pointer-events: none;
    }

.owner-public-preview-service-media[b-v3c2dr2ovz],
.owner-public-preview-service-copy[b-v3c2dr2ovz],
.owner-public-preview-service-side[b-v3c2dr2ovz] {
    position: relative;
    z-index: 2;
}

.owner-public-preview-service-media[b-v3c2dr2ovz] {
    width: 112px;
    height: 98px;
    overflow: hidden;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 22px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--preview-primary) 9%, var(--preview-surface)), color-mix(in srgb, var(--preview-secondary) 8%, var(--preview-surface)));
    border: 1px solid color-mix(in srgb, var(--preview-primary) 12%, var(--preview-divider));
    box-shadow: 0 18px 38px color-mix(in srgb, var(--preview-primary) 14%, transparent), 0 6px 18px color-mix(in srgb, var(--preview-secondary) 9%, transparent);
}

    .owner-public-preview-service-media img[b-v3c2dr2ovz] {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
    }

    .owner-public-preview-service-media:not(.owner-public-preview-service-media-with-image)[b-v3c2dr2ovz] {
        width: 64px;
        height: 64px;
        background: transparent;
        border: 0;
        box-shadow: 0 18px 38px color-mix(in srgb, var(--preview-primary) 14%, transparent), 0 6px 18px color-mix(in srgb, var(--preview-secondary) 9%, transparent);
    }

.owner-public-preview-service-brand-logo[b-v3c2dr2ovz] {
    width: 64px !important;
    max-width: 64px;
    height: 64px !important;
    object-fit: contain !important;
    border-radius: 21px;
}

.owner-public-preview-service-media-with-image img[b-v3c2dr2ovz] {
    transform: scale(1.01);
    filter: saturate(1.04) contrast(1.02);
}

.owner-public-preview-service-media-shade[b-v3c2dr2ovz] {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.04), rgba(15, 23, 42, 0.56));
    pointer-events: none;
}

.owner-public-preview-service-media-count[b-v3c2dr2ovz] {
    position: absolute;
    left: 0.52rem;
    right: 0.52rem;
    bottom: 0.48rem;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    padding: 0.34rem 0.42rem;
    color: #ffffff;
    font-size: 0.64rem;
    font-weight: 950;
    line-height: 1;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.58);
    border: 1px solid rgba(255,255,255,0.18);
    backdrop-filter: blur(12px);
}

.owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-service-media-count .mud-icon-root {
    color: var(--preview-secondary);
    font-size: 0.82rem;
}

.owner-public-preview-service-media-count + .owner-public-preview-service-expand-button[b-v3c2dr2ovz] {
    top: 0.42rem;
    right: 0.42rem;
    bottom: auto;
}

.owner-public-preview-service-copy[b-v3c2dr2ovz] {
    gap: 0.5rem;
    padding-left: 0.08rem;
}

    .owner-public-preview-service-copy > strong[b-v3c2dr2ovz] {
        color: var(--preview-text);
        font-size: 1.02rem;
        font-weight: 950;
        line-height: 1.16;
        letter-spacing: -0.02em;
        white-space: normal;
        overflow-wrap: anywhere;
    }

    .owner-public-preview-service-copy > p[b-v3c2dr2ovz] {
        max-width: 560px;
        color: var(--preview-muted);
        font-size: 0.82rem;
        line-height: 1.48;
        font-weight: 650;
        -webkit-line-clamp: 2;
    }

.owner-public-preview-service-meta[b-v3c2dr2ovz] {
    display: flex !important;
    flex-wrap: wrap;
    gap: 0.42rem !important;
    padding-top: 0.04rem;
}

    .owner-public-preview-service-meta > span[b-v3c2dr2ovz] {
        display: inline-flex;
        align-items: center;
        gap: 0.28rem;
        padding: 0.4rem 0.58rem;
        color: var(--preview-text);
        font-size: 0.68rem;
        font-weight: 850;
        line-height: 1;
        border-radius: 10px;
        background: linear-gradient(180deg, color-mix(in srgb, white 62%, transparent), color-mix(in srgb, white 34%, transparent)), color-mix(in srgb, var(--preview-primary) 7%, var(--preview-surface));
        border: 1px solid color-mix(in srgb, var(--preview-primary) 13%, var(--preview-divider));
        box-shadow: 0 7px 16px color-mix(in srgb, var(--preview-primary) 4%, transparent);
    }

.owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-service-meta .mud-icon-root {
    color: var(--preview-primary);
    font-size: 0.9rem;
}

.owner-public-preview-service-mini-gallery[b-v3c2dr2ovz] {
    gap: 0.36rem !important;
}

    .owner-public-preview-service-mini-gallery button[b-v3c2dr2ovz] {
        width: 42px;
        height: 32px;
        overflow: hidden;
        padding: 0;
        border: 0;
        border-radius: 10px;
        background: transparent;
        box-shadow: 0 8px 16px color-mix(in srgb, var(--preview-text) 5%, transparent);
    }

    .owner-public-preview-service-mini-gallery img[b-v3c2dr2ovz] {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: inherit;
        border: 1px solid color-mix(in srgb, var(--preview-primary) 12%, var(--preview-divider));
    }

.owner-public-preview-service-side[b-v3c2dr2ovz] {
    min-width: 126px;
    padding-left: 0.7rem;
}

    .owner-public-preview-service-side strong[b-v3c2dr2ovz] {
        font-size: 1rem;
        line-height: 1.1;
        letter-spacing: -0.02em;
    }

    .owner-public-preview-service-side small[b-v3c2dr2ovz] {
        padding: 0.34rem 0.58rem;
        color: var(--preview-primary);
        font-size: 0.66rem;
        font-weight: 950;
        text-transform: uppercase;
        letter-spacing: 0.06em;
        border-radius: 10px;
        background: color-mix(in srgb, var(--preview-primary) 8%, var(--preview-surface));
        border: 1px solid color-mix(in srgb, var(--preview-primary) 11%, var(--preview-divider));
    }

.owner-public-preview-map-brand[b-v3c2dr2ovz] {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 3;
    width: 56px;
    height: 56px;
    display: grid;
    place-items: center;
    padding: 7px;
    border-radius: 20px;
    background: color-mix(in srgb, var(--preview-surface) 94%, transparent);
    border: 3px solid color-mix(in srgb, var(--preview-surface) 92%, transparent);
    box-shadow: 0 16px 34px color-mix(in srgb, var(--preview-primary) 24%, transparent), 0 0 0 1px color-mix(in srgb, var(--preview-primary) 18%, var(--preview-divider));
    transform: translate(-50%, -50%);
}

    .owner-public-preview-map-brand img[b-v3c2dr2ovz] {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: contain;
        border-radius: 13px;
    }

.owner-public-preview-map-pin[b-v3c2dr2ovz] {
    display: none;
}

@media (max-width: 760px) {
    .owner-public-preview-service-card[b-v3c2dr2ovz] {
        grid-template-columns: auto minmax(0, 1fr);
        gap: 0.85rem;
        padding: 0.9rem;
        border-radius: 22px;
    }

    .owner-public-preview-service-media[b-v3c2dr2ovz] {
        width: 92px;
        height: 82px;
        border-radius: 19px;
    }

        .owner-public-preview-service-media:not(.owner-public-preview-service-media-with-image)[b-v3c2dr2ovz] {
            width: 52px;
            height: 52px;
        }

    .owner-public-preview-service-brand-logo[b-v3c2dr2ovz] {
        width: 52px !important;
        max-width: 52px;
        height: 52px !important;
        border-radius: 17px;
    }

    .owner-public-preview-service-side[b-v3c2dr2ovz] {
        grid-column: 1 / -1;
        width: 100%;
        min-width: 0;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0.7rem 0 0;
        border-top: 1px solid color-mix(in srgb, var(--preview-primary) 9%, var(--preview-divider));
    }
}

@media (max-width: 520px) {
    .owner-public-preview-service-card[b-v3c2dr2ovz] {
        grid-template-columns: 1fr;
    }

    .owner-public-preview-service-media[b-v3c2dr2ovz] {
        width: 100%;
        height: 180px;
    }

        .owner-public-preview-service-media:not(.owner-public-preview-service-media-with-image)[b-v3c2dr2ovz] {
            width: 58px;
            height: 58px;
        }

    .owner-public-preview-service-copy[b-v3c2dr2ovz] {
        padding-left: 0;
    }
}

/* BB-OWNER-PUBLIC-PREVIEW-V6 — final public-profile fidelity and typography */
.owner-public-preview-root[b-v3c2dr2ovz],
.owner-public-preview-root button[b-v3c2dr2ovz],
.owner-public-preview-root input[b-v3c2dr2ovz],
.owner-public-preview-root textarea[b-v3c2dr2ovz],
.owner-public-preview-root select[b-v3c2dr2ovz],
.owner-public-preview-root label[b-v3c2dr2ovz],
.owner-public-preview-root small[b-v3c2dr2ovz],
.owner-public-preview-root strong[b-v3c2dr2ovz],
.owner-public-preview-root span[b-v3c2dr2ovz],
.owner-public-preview-root p[b-v3c2dr2ovz],
.owner-public-preview-root h1[b-v3c2dr2ovz],
.owner-public-preview-root h2[b-v3c2dr2ovz],
.owner-public-preview-root h3[b-v3c2dr2ovz],
.owner-public-preview-root h4[b-v3c2dr2ovz],
.owner-public-preview-root[b-v3c2dr2ovz]  .mud-typography,
.owner-public-preview-root[b-v3c2dr2ovz]  .mud-button-label,
.owner-public-preview-root[b-v3c2dr2ovz]  .mud-chip-content,
.owner-public-preview-root[b-v3c2dr2ovz]  .mud-input-label,
.owner-public-preview-root[b-v3c2dr2ovz]  .mud-input-helper-text,
.owner-public-preview-root[b-v3c2dr2ovz]  .mud-select-input,
.owner-public-preview-root[b-v3c2dr2ovz]  .mud-input-slot {
    font-family: inherit !important;
}

/* Match the real SalonDetails service presentation instead of a softened owner card. */
.owner-public-preview-service-list[b-v3c2dr2ovz] {
    gap: 1.05rem;
}

.owner-public-preview-service-card[b-v3c2dr2ovz] {
    min-height: 150px;
    gap: 1.25rem;
    padding: 1.35rem 1.5rem;
    border-radius: 30px;
    background: radial-gradient(circle at 7% 12%, color-mix(in srgb, var(--preview-primary) 13%, transparent), transparent 28%), radial-gradient(circle at 94% 10%, color-mix(in srgb, var(--preview-secondary) 16%, transparent), transparent 34%), radial-gradient(circle at 86% 94%, color-mix(in srgb, var(--preview-primary) 9%, transparent), transparent 36%), linear-gradient(135deg, color-mix(in srgb, var(--preview-surface) 96%, white) 0%, color-mix(in srgb, var(--preview-primary) 5%, var(--preview-surface)) 48%, color-mix(in srgb, var(--preview-secondary) 6%, var(--preview-surface)) 100%);
    border-color: color-mix(in srgb, var(--preview-primary) 18%, var(--preview-divider));
    box-shadow: 0 20px 48px color-mix(in srgb, var(--preview-text) 8%, transparent), 0 8px 24px color-mix(in srgb, var(--preview-primary) 6%, transparent), inset 0 1px 0 color-mix(in srgb, white 82%, transparent);
}

.owner-public-preview-service-media[b-v3c2dr2ovz] {
    width: 122px;
    height: 108px;
    border-radius: 23px;
}

.owner-public-preview-service-media-with-image img[b-v3c2dr2ovz] {
    transform: none;
    filter: none;
}

.owner-public-preview-service-copy > strong[b-v3c2dr2ovz] {
    font-size: 1.08rem;
}

.owner-public-preview-service-copy > p[b-v3c2dr2ovz] {
    max-width: 560px;
    font-size: 0.88rem;
    line-height: 1.52;
}

.owner-public-preview-service-meta > span[b-v3c2dr2ovz] {
    padding: 0.46rem 0.68rem;
    font-size: 0.74rem;
}

.owner-public-preview-service-mini-gallery button[b-v3c2dr2ovz] {
    width: 48px;
    height: 38px;
}

.owner-public-preview-service-side[b-v3c2dr2ovz] {
    min-width: 142px;
    padding-left: 1rem;
}

    .owner-public-preview-service-side strong[b-v3c2dr2ovz] {
        font-size: 1.08rem;
    }

/* Location now mirrors the real public location panel: heading, verified card,
   map shell, status note and the same three customer actions. */
.owner-public-preview-location-panel[b-v3c2dr2ovz] {
    display: grid;
    gap: 0.72rem;
}

.owner-public-preview-location-heading[b-v3c2dr2ovz] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.72rem;
    align-items: center;
}

.owner-public-preview-location-heading-icon[b-v3c2dr2ovz] {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    color: var(--preview-primary);
    border-radius: 16px;
    background: color-mix(in srgb, var(--preview-primary) 7%, var(--preview-surface));
}

.owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-location-heading-icon .mud-icon-root {
    color: inherit;
    font-size: 1.25rem;
}

.owner-public-preview-location-heading > div[b-v3c2dr2ovz] {
    min-width: 0;
    display: grid;
    gap: 0.1rem;
}

.owner-public-preview-location-heading h3[b-v3c2dr2ovz] {
    margin: 0;
    color: var(--preview-text);
    font-size: 1.18rem;
    font-weight: 950;
    letter-spacing: -0.025em;
}

.owner-public-preview-location-heading p[b-v3c2dr2ovz] {
    margin: 0;
    color: var(--preview-muted);
    font-size: 0.76rem;
    font-weight: 650;
}

.owner-public-preview-location-card[b-v3c2dr2ovz] {
    position: relative;
    overflow: hidden;
    display: grid;
    gap: 0.78rem;
    padding: 0.92rem;
    border-radius: 22px;
    background: radial-gradient(circle at 94% 8%, color-mix(in srgb, var(--preview-secondary) 7%, transparent), transparent 34%), color-mix(in srgb, var(--preview-primary) 5%, var(--preview-surface));
    border: 1px solid color-mix(in srgb, var(--preview-primary) 10%, var(--preview-divider));
    box-shadow: 0 12px 30px color-mix(in srgb, var(--preview-text) 5%, transparent);
}

    .owner-public-preview-location-card[b-v3c2dr2ovz]::before {
        content: "";
        position: absolute;
        inset: 0 auto 0 0;
        width: 4px;
        background: linear-gradient(180deg, var(--preview-primary), var(--preview-secondary));
    }

.owner-public-preview-location-card-verified[b-v3c2dr2ovz] {
    background: radial-gradient(circle at 92% 12%, color-mix(in srgb, var(--mud-palette-success) 10%, transparent), transparent 32%), radial-gradient(circle at 8% 92%, color-mix(in srgb, var(--preview-secondary) 8%, transparent), transparent 30%), color-mix(in srgb, var(--preview-surface) 96%, transparent);
    border-color: color-mix(in srgb, var(--mud-palette-success) 18%, var(--preview-divider));
}

    .owner-public-preview-location-card-verified[b-v3c2dr2ovz]::before {
        background: linear-gradient(180deg, var(--mud-palette-success), var(--preview-secondary));
    }

.owner-public-preview-location-card-header[b-v3c2dr2ovz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.owner-public-preview-location-status-pill[b-v3c2dr2ovz] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 0.36rem;
    padding: 0.4rem 0.66rem;
    color: var(--preview-primary);
    font-size: 0.68rem;
    font-weight: 950;
    line-height: 1;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    border-radius: 999px;
    background: color-mix(in srgb, var(--preview-primary) 8%, var(--preview-surface));
    border: 1px solid color-mix(in srgb, var(--preview-primary) 10%, var(--preview-divider));
}

.owner-public-preview-location-status-pill-verified[b-v3c2dr2ovz] {
    color: var(--mud-palette-success);
    background: color-mix(in srgb, var(--mud-palette-success) 10%, var(--preview-surface));
    border-color: color-mix(in srgb, var(--mud-palette-success) 15%, var(--preview-divider));
}

.owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-location-status-pill .mud-icon-root {
    color: currentColor;
    font-size: 0.94rem;
}

.owner-public-preview-location-address[b-v3c2dr2ovz] {
    min-width: 0;
    display: grid;
    gap: 0.22rem;
}

    .owner-public-preview-location-address strong[b-v3c2dr2ovz] {
        color: var(--preview-text);
        font-size: 1rem;
        font-weight: 950;
        line-height: 1.28;
        overflow-wrap: anywhere;
    }

    .owner-public-preview-location-address span[b-v3c2dr2ovz],
    .owner-public-preview-location-address small[b-v3c2dr2ovz] {
        color: var(--preview-muted);
        font-size: 0.82rem;
        font-weight: 720;
        line-height: 1.36;
        overflow-wrap: anywhere;
    }

.owner-public-preview-location-map-shell[b-v3c2dr2ovz] {
    position: relative;
    overflow: hidden;
    min-height: 220px;
    border-radius: 20px;
    border: 1px solid color-mix(in srgb, var(--preview-primary) 10%, var(--preview-divider));
    box-shadow: inset 0 1px 0 color-mix(in srgb, white 38%, transparent), 0 12px 28px color-mix(in srgb, var(--preview-primary) 7%, transparent);
}

    .owner-public-preview-location-map-shell .owner-public-preview-map-preview[b-v3c2dr2ovz] {
        min-height: 220px;
        height: 220px;
        border: 0;
        border-radius: inherit;
        box-shadow: none;
    }

.owner-public-preview-location-map-expand-button[b-v3c2dr2ovz] {
    position: absolute;
    right: 0.72rem;
    bottom: 0.72rem;
    z-index: 5;
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    padding: 0 0.72rem;
    color: #ffffff;
    font-family: inherit;
    font-size: 0.68rem;
    font-weight: 950;
    line-height: 1;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border: 1px solid color-mix(in srgb, var(--preview-primary) 22%, transparent);
    border-radius: 999px;
    background: linear-gradient(135deg, var(--preview-primary), color-mix(in srgb, var(--preview-primary) 72%, var(--preview-secondary)));
    box-shadow: 0 14px 28px color-mix(in srgb, var(--preview-primary) 22%, transparent);
    opacity: 1;
}

.owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-location-map-expand-button .mud-icon-root {
    color: #ffffff;
    font-size: 1rem;
}

.owner-public-preview-location-map-note[b-v3c2dr2ovz] {
    display: flex;
    align-items: flex-start;
    gap: 0.45rem;
    padding: 0.65rem 0.72rem;
    color: var(--preview-text);
    font-size: 0.76rem;
    font-weight: 760;
    line-height: 1.35;
    border-radius: 16px;
    background: color-mix(in srgb, var(--preview-surface) 72%, transparent);
    border: 1px solid color-mix(in srgb, var(--preview-primary) 8%, var(--preview-divider));
}

.owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-location-map-note .mud-icon-root {
    flex: 0 0 auto;
    color: var(--preview-secondary);
    margin-top: 0.05rem;
}

.owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-location-action {
    min-height: 44px;
    border-radius: 12px !important;
    font-family: inherit;
    font-weight: 950;
    letter-spacing: 0.025em;
}

    .owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-location-action.mud-button-filled-primary .mud-button-label,
    .owner-public-preview-root[b-v3c2dr2ovz]  .owner-public-preview-location-action.mud-button-filled-primary .mud-icon-root {
        color: #ffffff !important;
    }

@media (max-width: 760px) {
    .owner-public-preview-service-card[b-v3c2dr2ovz] {
        padding: 1rem;
    }

    .owner-public-preview-service-media[b-v3c2dr2ovz] {
        width: 96px;
        height: 88px;
    }
}

@media (max-width: 520px) {
    .owner-public-preview-service-media[b-v3c2dr2ovz] {
        width: 100%;
        height: 190px;
    }

    .owner-public-preview-location-map-shell[b-v3c2dr2ovz],
    .owner-public-preview-location-map-shell .owner-public-preview-map-preview[b-v3c2dr2ovz] {
        min-height: 200px;
        height: 200px;
    }
}

/* ========================================================================== */
/* BOOKBEAUT OWNER PUBLIC PREVIEW V6.1 — LIVE MAP MARKER FIDELITY             */
/* ========================================================================== */

/* Match the recognizable public-profile Leaflet marker: a navy pin, warm
   BookBeaut ring and the BB brand mark in the centre. */
.owner-public-preview-map-brand[b-v3c2dr2ovz] {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 4;
    width: 56px;
    height: 68px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    transform: translate(-50%, -58%);
}

    .owner-public-preview-map-brand[b-v3c2dr2ovz]::before {
        content: "";
        position: absolute;
        left: 50%;
        top: 2px;
        width: 48px;
        height: 48px;
        border-radius: 50% 50% 50% 10px;
        background: linear-gradient( 135deg, var(--preview-primary), color-mix(in srgb, var(--preview-primary) 76%, var(--preview-secondary)) );
        border: 3px solid color-mix(in srgb, var(--preview-surface) 96%, transparent);
        box-shadow: 0 16px 30px color-mix(in srgb, var(--preview-primary) 28%, transparent), 0 0 0 1px color-mix(in srgb, var(--preview-primary) 20%, var(--preview-divider));
        transform: translateX(-50%) rotate(-45deg);
    }

    .owner-public-preview-map-brand[b-v3c2dr2ovz]::after {
        content: "";
        position: absolute;
        left: 50%;
        top: 10px;
        z-index: 2;
        width: 32px;
        height: 32px;
        border-radius: 50%;
        background: var(--preview-secondary);
        border: 3px solid color-mix(in srgb, var(--preview-surface) 94%, transparent);
        box-shadow: 0 7px 16px color-mix(in srgb, var(--preview-text) 24%, transparent);
        transform: translateX(-50%);
    }

    .owner-public-preview-map-brand img[b-v3c2dr2ovz] {
        position: absolute;
        left: 50%;
        top: 16px;
        z-index: 3;
        width: 20px !important;
        height: 20px !important;
        display: block;
        object-fit: contain;
        border-radius: 6px;
        background: var(--preview-primary);
        box-shadow: none;
        filter: none;
        transform: translateX(-50%);
    }

@media (max-width: 520px) {
    .owner-public-preview-map-brand[b-v3c2dr2ovz] {
        width: 52px;
        height: 64px;
    }

        .owner-public-preview-map-brand[b-v3c2dr2ovz]::before {
            width: 45px;
            height: 45px;
        }

        .owner-public-preview-map-brand[b-v3c2dr2ovz]::after {
            top: 9px;
            width: 30px;
            height: 30px;
        }

        .owner-public-preview-map-brand img[b-v3c2dr2ovz] {
            top: 15px;
            width: 18px !important;
            height: 18px !important;
        }
}
/* /Components/Pages/Account/AccountSecurity.razor.rz.scp.css */
.account-security-page[b-ttz4nskjwq] {
    display: grid;
    gap: 1.5rem;
    max-width: 850px;
    margin: 0 auto;
    padding: 2rem 0 4rem;
}

.account-security-hero[b-ttz4nskjwq] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 1rem;
    align-items: center;
    padding: 1.6rem;
    border: 1px solid color-mix( in srgb, var(--mud-palette-primary) 12%, var(--mud-palette-divider));
    border-radius: 26px;
    background: radial-gradient( circle at 88% 12%, color-mix( in srgb, var(--mud-palette-secondary) 18%, transparent), transparent 34%), var(--mud-palette-surface);
    box-shadow: 0 20px 55px color-mix( in srgb, var(--mud-palette-primary) 10%, transparent);
}

.account-security-icon[b-ttz4nskjwq],
.account-security-card-icon[b-ttz4nskjwq] {
    display: grid;
    place-items: center;
    color: var(--mud-palette-primary);
    background: color-mix( in srgb, var(--mud-palette-secondary) 18%, var(--mud-palette-surface));
    border: 1px solid color-mix( in srgb, var(--mud-palette-secondary) 28%, transparent);
}

.account-security-icon[b-ttz4nskjwq] {
    width: 68px;
    height: 68px;
    border-radius: 22px;
}

.account-security-card-icon[b-ttz4nskjwq] {
    width: 52px;
    height: 52px;
    border-radius: 17px;
}

.account-security-card-icon-danger[b-ttz4nskjwq] {
    color: var(--mud-palette-error);
    background: color-mix( in srgb, var(--mud-palette-error) 9%, var(--mud-palette-surface));
    border-color: color-mix( in srgb, var(--mud-palette-error) 18%, transparent);
}

.account-security-page[b-ttz4nskjwq]  .account-security-eyebrow {
    color: var(--mud-palette-secondary);
    font-weight: 900;
    letter-spacing: .08em;
}

.account-security-page[b-ttz4nskjwq]  .account-security-title {
    color: var(--mud-palette-primary);
    font-weight: 950;
    letter-spacing: -.04em;
}

.account-security-page[b-ttz4nskjwq]  .account-security-copy,
.account-security-page[b-ttz4nskjwq]  .account-security-card-copy {
    color: var(--mud-palette-text-secondary);
    line-height: 1.65;
}

.account-security-alert[b-ttz4nskjwq] {
    border-radius: 16px;
}

.account-security-card[b-ttz4nskjwq] {
    display: grid;
    gap: 1.35rem;
    padding: 1.6rem;
    border: 1px solid color-mix( in srgb, var(--mud-palette-primary) 10%, var(--mud-palette-divider));
    border-radius: 24px;
    background: var(--mud-palette-surface);
    box-shadow: 0 18px 48px color-mix( in srgb, var(--mud-palette-primary) 8%, transparent);
}

.account-security-danger-card[b-ttz4nskjwq] {
    border-color: color-mix( in srgb, var(--mud-palette-error) 16%, var(--mud-palette-divider));
}

.account-security-card-heading[b-ttz4nskjwq] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: .9rem;
    align-items: center;
}

.account-security-page[b-ttz4nskjwq]  .account-security-card-title {
    color: var(--mud-palette-text-primary);
    font-weight: 900;
}

.account-security-password-form[b-ttz4nskjwq] {
    display: block;
    width: 100%;
    max-width: 580px;
    margin-inline: auto;
}

.account-security-page[b-ttz4nskjwq]  .account-security-password-hint {
    color: var(--mud-palette-text-secondary);
    line-height: 1.55;
}

.account-security-page[b-ttz4nskjwq]  .account-security-primary-button,
.account-security-page[b-ttz4nskjwq]  .account-security-danger-button {
    align-self: center;
    justify-self: center;
    min-height: 48px;
    margin-inline: auto;
    border-radius: 14px;
    font-weight: 900;
}

.account-security-password-form[b-ttz4nskjwq]  .mud-stack {
    width: 100%;
}

.account-security-danger-card .account-security-details[b-ttz4nskjwq] {
    width: 100%;
    max-width: 580px;
    margin-inline: auto;
}

.account-security-danger-card > .account-security-danger-button[b-ttz4nskjwq] {
    align-self: center;
    justify-self: center;
}

.account-security-details[b-ttz4nskjwq] {
    display: grid;
    gap: .7rem;
    padding: 1rem;
    border-radius: 18px;
    background: color-mix( in srgb, var(--mud-palette-background) 80%, var(--mud-palette-surface));
}

.account-security-detail[b-ttz4nskjwq] {
    display: grid;
    grid-template-columns: 22px 1fr;
    gap: .55rem;
    align-items: center;
    color: var(--mud-palette-text-secondary);
    font-size: .9rem;
    line-height: 1.5;
}

    .account-security-detail[b-ttz4nskjwq]  .mud-icon-root {
        color: var(--mud-palette-success);
    }

@media (max-width: 600px) {
    .account-security-page[b-ttz4nskjwq] {
        padding: 1rem 0 2.5rem;
    }

    .account-security-hero[b-ttz4nskjwq],
    .account-security-card[b-ttz4nskjwq] {
        padding: 1.2rem;
        border-radius: 20px;
    }

    .account-security-hero[b-ttz4nskjwq],
    .account-security-card-heading[b-ttz4nskjwq] {
        grid-template-columns: 1fr;
    }

    .account-security-page[b-ttz4nskjwq]  .account-security-primary-button,
    .account-security-page[b-ttz4nskjwq]  .account-security-danger-button {
        width: 100%;
    }
}

.account-security-password-checklist[b-ttz4nskjwq] {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: .55rem;
}

    .account-security-password-checklist div[b-ttz4nskjwq] {
        display: flex;
        align-items: center;
        gap: .4rem;
        padding: .58rem .68rem;
        color: var(--mud-palette-text-secondary);
        font-size: .76rem;
        font-weight: 750;
        border: 1px solid var(--mud-palette-divider);
        border-radius: 13px;
        background: color-mix(in srgb,var(--mud-palette-background) 75%,var(--mud-palette-surface));
    }

    .account-security-password-checklist .is-complete[b-ttz4nskjwq] {
        color: var(--mud-palette-success);
        border-color: color-mix(in srgb,var(--mud-palette-success) 24%,var(--mud-palette-divider));
        background: color-mix(in srgb,var(--mud-palette-success) 7%,var(--mud-palette-surface));
    }

@media(max-width:600px) {
    .account-security-password-checklist[b-ttz4nskjwq] {
        grid-template-columns: 1fr
    }
}
/* /Components/Pages/AdminApproveSalonDialog.razor.rz.scp.css */
.admin-approve-salon-dialog[b-mngbdtf5vg] {
    min-width: 0;
}

.admin-approve-salon-dialog__hero[b-mngbdtf5vg],
.admin-approve-salon-dialog__founding-note[b-mngbdtf5vg] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.9rem;
    align-items: center;
}

    .admin-approve-salon-dialog__hero > span[b-mngbdtf5vg],
    .admin-approve-salon-dialog__founding-note > .mud-icon-root[b-mngbdtf5vg] {
        width: 52px;
        height: 52px;
        display: grid;
        place-items: center;
        color: #ffffff;
        border-radius: 18px;
        background: linear-gradient(135deg, var(--mud-palette-primary), var(--mud-palette-secondary));
    }

.admin-approve-salon-dialog__founding-note[b-mngbdtf5vg] {
    padding: 1rem;
    border-radius: 20px;
    border: 1px solid color-mix(in srgb, #b89b5e 32%, var(--mud-palette-divider));
    background: linear-gradient(135deg, color-mix(in srgb, #b89b5e 12%, var(--mud-palette-surface)), var(--mud-palette-surface));
}

    .admin-approve-salon-dialog__founding-note > div[b-mngbdtf5vg] {
        display: grid;
        gap: 0.2rem;
    }

    .admin-approve-salon-dialog__founding-note strong[b-mngbdtf5vg] {
        color: var(--mud-palette-text-primary);
        font-weight: 950;
    }

    .admin-approve-salon-dialog__founding-note span[b-mngbdtf5vg] {
        color: var(--mud-palette-text-secondary);
        font-size: 0.82rem;
    }
/* /Components/Pages/AdminRejectOwnerMediaDialog.razor.rz.scp.css */
.admin-reject-owner-media-dialog[b-fpxzg9tc1j] {
    font-family: inherit;
}

.admin-reject-owner-media-icon[b-fpxzg9tc1j] {
    color: #ffffff !important;
}

    .admin-reject-owner-media-icon[b-fpxzg9tc1j]  .mud-icon-root {
        color: #ffffff !important;
    }

.admin-reject-owner-media-title[b-fpxzg9tc1j] {
    color: var(--mud-palette-primary);
    font-weight: 950;
    line-height: 1.2;
}

.admin-reject-owner-media-subtitle[b-fpxzg9tc1j] {
    color: var(--mud-palette-text-secondary);
    font-size: 0.86rem;
    font-weight: 700;
    line-height: 1.35;
}

.admin-reject-owner-media-alert[b-fpxzg9tc1j] {
    border-radius: 14px;
}

.admin-reject-owner-media-field[b-fpxzg9tc1j],
.admin-reject-owner-media-field[b-fpxzg9tc1j]  .mud-input-control,
.admin-reject-owner-media-field[b-fpxzg9tc1j]  textarea,
.admin-reject-owner-media-field[b-fpxzg9tc1j]  label {
    font-family: inherit;
}

.admin-reject-owner-media-requirement-row[b-fpxzg9tc1j] {
    flex-wrap: wrap;
}

.admin-reject-owner-media-requirement-text[b-fpxzg9tc1j] {
    color: var(--mud-palette-text-secondary);
    font-size: 0.78rem;
    font-weight: 750;
    line-height: 1.35;
}

.admin-reject-owner-media-validation-text[b-fpxzg9tc1j] {
    color: var(--mud-palette-error);
    font-size: 0.78rem;
    font-weight: 850;
    line-height: 1.35;
}

.admin-reject-owner-media-dialog[b-fpxzg9tc1j]  .mud-chip-root {
    font-family: inherit;
    font-weight: 900;
}

.admin-reject-owner-media-dialog[b-fpxzg9tc1j]  .mud-chip-content {
    font-family: inherit;
    font-weight: 900;
}
/* /Components/Pages/AdminRejectSalonDialog.razor.rz.scp.css */
.admin-reject-salon-dialog[b-k5ydz43t48] {
    display: grid;
    gap: 1rem;
    min-width: 0;
}

.admin-reject-salon-dialog-header[b-k5ydz43t48] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.85rem;
    align-items: start;
    padding: 1rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-error) 15%, var(--mud-palette-divider));
    background: radial-gradient(circle at 10% 18%, color-mix(in srgb, var(--mud-palette-error) 11%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--mud-palette-surface) 98%, var(--mud-palette-error)), var(--mud-palette-surface));
    border-radius: 18px;
}

.admin-reject-salon-dialog-icon[b-k5ydz43t48] {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    color: #ffffff;
    background: linear-gradient(135deg, var(--mud-palette-error), color-mix(in srgb, var(--mud-palette-error) 74%, var(--mud-palette-primary)));
    border-radius: 16px;
    box-shadow: 0 14px 28px color-mix(in srgb, var(--mud-palette-error) 20%, transparent);
}

    .admin-reject-salon-dialog-icon[b-k5ydz43t48]  .mud-icon-root {
        color: #ffffff;
        font-size: 1.55rem;
    }

.admin-reject-salon-dialog-title[b-k5ydz43t48] {
    color: var(--mud-palette-primary);
    font-weight: 950;
    line-height: 1.2;
}

.admin-reject-salon-dialog-subtitle[b-k5ydz43t48] {
    margin-top: 0.25rem;
    color: var(--mud-palette-text-secondary);
    line-height: 1.5;
}

.admin-reject-salon-dialog-note[b-k5ydz43t48] {
    border-radius: 14px;
}

.admin-reject-salon-dialog-actions[b-k5ydz43t48] {
    display: flex;
    justify-content: flex-end;
    gap: 0.65rem;
    width: 100%;
    padding: 0.2rem 0.35rem 0.35rem;
}

    .admin-reject-salon-dialog-actions[b-k5ydz43t48]  .mud-button-root {
        min-height: 40px;
        border-radius: 10px;
        font-weight: 900;
        text-transform: none;
    }

@media (max-width: 600px) {
    .admin-reject-salon-dialog-header[b-k5ydz43t48] {
        grid-template-columns: 1fr;
    }

    .admin-reject-salon-dialog-actions[b-k5ydz43t48] {
        display: grid;
    }

        .admin-reject-salon-dialog-actions[b-k5ydz43t48]  .mud-button-root {
            width: 100%;
        }
}
/* /Components/Pages/AdminRequestSalonChangesDialog.razor.rz.scp.css */
.admin-request-changes-dialog[b-3uj3qb62h7] {
    display: grid;
    gap: 1rem;
    min-width: 0;
}

.admin-request-changes-header[b-3uj3qb62h7] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.9rem;
    align-items: start;
    padding: 1rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-warning) 18%, var(--mud-palette-divider));
    background: radial-gradient(circle at 10% 18%, color-mix(in srgb, var(--mud-palette-warning) 13%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--mud-palette-surface) 98%, var(--mud-palette-warning)), var(--mud-palette-surface));
    border-radius: 18px;
}

.admin-request-changes-icon[b-3uj3qb62h7] {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    color: #ffffff;
    background: linear-gradient(135deg, var(--mud-palette-warning), color-mix(in srgb, var(--mud-palette-warning) 70%, var(--mud-palette-primary)));
    border-radius: 16px;
    box-shadow: 0 14px 28px color-mix(in srgb, var(--mud-palette-warning) 20%, transparent);
}

    .admin-request-changes-icon[b-3uj3qb62h7]  .mud-icon-root {
        color: #ffffff;
        font-size: 1.55rem;
    }

.admin-request-changes-title[b-3uj3qb62h7] {
    color: var(--mud-palette-primary);
    font-weight: 950;
    line-height: 1.2;
}

.admin-request-changes-subtitle[b-3uj3qb62h7] {
    margin-top: 0.25rem;
    color: var(--mud-palette-text-secondary);
    font-weight: 650;
    line-height: 1.5;
}

.admin-request-changes-missing[b-3uj3qb62h7] {
    display: grid;
    gap: 0.55rem;
    padding: 0.9rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 8%, var(--mud-palette-divider));
    background: color-mix(in srgb, var(--mud-palette-primary) 3%, var(--mud-palette-surface));
    border-radius: 16px;
}

    .admin-request-changes-missing[b-3uj3qb62h7]  .mud-typography {
        color: var(--mud-palette-primary);
        font-weight: 950;
    }

.admin-request-changes-suggestion[b-3uj3qb62h7] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    width: 100%;
    padding: 0.65rem;
    color: var(--mud-palette-text-secondary);
    font-family: inherit;
    font-size: 0.86rem;
    font-weight: 750;
    line-height: 1.35;
    text-align: left;
    background: var(--mud-palette-surface);
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 8%, var(--mud-palette-divider));
    border-radius: 12px;
    cursor: pointer;
}

    .admin-request-changes-suggestion:hover[b-3uj3qb62h7] {
        color: var(--mud-palette-primary);
        background: color-mix(in srgb, var(--mud-palette-secondary) 8%, var(--mud-palette-surface));
        border-color: color-mix(in srgb, var(--mud-palette-secondary) 24%, var(--mud-palette-divider));
    }

    .admin-request-changes-suggestion[b-3uj3qb62h7]  .mud-icon-root {
        flex: 0 0 auto;
        margin-top: 0.04rem;
        color: var(--mud-palette-secondary);
        font-size: 1rem;
    }

.admin-request-changes-note[b-3uj3qb62h7] {
    border-radius: 14px;
}

.admin-request-changes-actions[b-3uj3qb62h7] {
    display: flex;
    justify-content: flex-end;
    gap: 0.65rem;
    width: 100%;
    padding: 0.2rem 0.35rem 0.35rem;
}

    .admin-request-changes-actions[b-3uj3qb62h7]  .mud-button-root {
        min-height: 40px;
        border-radius: 10px;
        font-weight: 900;
        text-transform: none;
    }

@media (max-width: 600px) {
    .admin-request-changes-header[b-3uj3qb62h7] {
        grid-template-columns: 1fr;
    }

    .admin-request-changes-actions[b-3uj3qb62h7] {
        display: grid;
    }

        .admin-request-changes-actions[b-3uj3qb62h7]  .mud-button-root {
            width: 100%;
        }
}
/* /Components/Pages/AdminSalonPreviewDialog.razor.rz.scp.css */
.admin-salon-preview-dialog[b-xb97chqvpo] {
    display: grid;
    gap: 1rem;
    min-width: 0;
}

.admin-salon-preview-header[b-xb97chqvpo] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 10%, var(--mud-palette-divider));
    background: radial-gradient(circle at 10% 18%, color-mix(in srgb, var(--mud-palette-primary) 9%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--mud-palette-surface) 97%, var(--mud-palette-primary)), var(--mud-palette-surface));
    border-radius: 18px;
}

.admin-salon-preview-dialog[b-xb97chqvpo]  .admin-salon-preview-eyebrow {
    color: var(--mud-palette-secondary);
    font-weight: 950;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.admin-salon-preview-dialog[b-xb97chqvpo]  .admin-salon-preview-title {
    margin-top: 0.15rem;
    color: var(--mud-palette-primary);
    font-weight: 950;
    line-height: 1.15;
    letter-spacing: -0.03em;
}

.admin-salon-preview-dialog[b-xb97chqvpo]  .admin-salon-preview-location {
    margin-top: 0.25rem;
    color: var(--mud-palette-text-secondary);
    font-weight: 700;
}

.admin-salon-preview-dialog[b-xb97chqvpo]  .mud-chip {
    flex: 0 0 auto;
    font-weight: 900;
    border-radius: 999px;
}

.admin-salon-preview-alert[b-xb97chqvpo] {
    border-radius: 14px;
}

.admin-salon-preview-section[b-xb97chqvpo] {
    display: grid;
    gap: 0.5rem;
    padding: 1rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 8%, var(--mud-palette-divider));
    background: var(--mud-palette-surface);
    border-radius: 16px;
}

.admin-salon-preview-dialog[b-xb97chqvpo]  .admin-salon-preview-section-title {
    color: var(--mud-palette-primary);
    font-weight: 950;
}

.admin-salon-preview-dialog[b-xb97chqvpo]  .admin-salon-preview-description {
    color: var(--mud-palette-text-secondary);
    font-weight: 650;
    line-height: 1.55;
}

.admin-salon-preview-grid[b-xb97chqvpo] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.7rem;
}

.admin-salon-preview-meta-card[b-xb97chqvpo] {
    min-width: 0;
    padding: 0.8rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 8%, var(--mud-palette-divider));
    background: color-mix(in srgb, var(--mud-palette-primary) 3%, var(--mud-palette-surface));
    border-radius: 14px;
}

    .admin-salon-preview-meta-card span[b-xb97chqvpo] {
        display: block;
        color: var(--mud-palette-text-secondary);
        font-size: 0.72rem;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 0.06em;
    }

    .admin-salon-preview-meta-card strong[b-xb97chqvpo] {
        display: block;
        min-width: 0;
        margin-top: 0.2rem;
        color: var(--mud-palette-primary);
        font-size: 0.92rem;
        font-weight: 950;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.admin-salon-preview-contact[b-xb97chqvpo] {
    display: grid;
    gap: 0.45rem;
}

    .admin-salon-preview-contact span[b-xb97chqvpo] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        color: var(--mud-palette-text-secondary);
        font-weight: 750;
    }

    .admin-salon-preview-contact[b-xb97chqvpo]  .mud-icon-root {
        color: var(--mud-palette-secondary);
        font-size: 1rem;
    }

.admin-salon-preview-actions[b-xb97chqvpo] {
    display: flex;
    justify-content: flex-end;
    gap: 0.65rem;
    width: 100%;
    padding: 0.2rem 0.35rem 0.35rem;
}

    .admin-salon-preview-actions[b-xb97chqvpo]  .mud-button-root {
        min-height: 40px;
        border-radius: 10px;
        font-weight: 900;
        text-transform: none;
    }

@media (max-width: 760px) {
    .admin-salon-preview-header[b-xb97chqvpo] {
        display: grid;
    }

    .admin-salon-preview-grid[b-xb97chqvpo] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-salon-preview-actions[b-xb97chqvpo] {
        display: grid;
    }

        .admin-salon-preview-actions[b-xb97chqvpo]  .mud-button-root {
            width: 100%;
        }
}
/* /Components/Pages/AdminSalonReview.razor.rz.scp.css */
.admin-salon-review-page[b-4pg2gifhg2] {
    padding-top: 1.5rem;
    padding-bottom: 3rem;
}

    .admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-hero {
        display: flex;
        justify-content: space-between;
        align-items: stretch;
        gap: 1.5rem;
        padding: clamp(1.4rem, 2.2vw, 2.2rem);
        border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 10%, var(--mud-palette-divider));
        background: radial-gradient(circle at 10% 15%, color-mix(in srgb, var(--mud-palette-primary) 10%, transparent), transparent 34%), radial-gradient(circle at 90% 10%, color-mix(in srgb, var(--mud-palette-secondary) 11%, transparent), transparent 30%), linear-gradient(135deg, color-mix(in srgb, var(--mud-palette-surface) 96%, var(--mud-palette-primary)), var(--mud-palette-surface));
        border-radius: 24px;
        box-shadow: 0 18px 42px color-mix(in srgb, var(--mud-palette-primary) 8%, transparent);
    }

.admin-salon-review-hero-content[b-4pg2gifhg2] {
    max-width: 760px;
}

.admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-eyebrow {
    color: var(--mud-palette-secondary);
    font-weight: 950;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-title {
    margin-top: 0.25rem;
    color: var(--mud-palette-primary);
    font-size: clamp(2.15rem, 3vw, 3.25rem);
    font-weight: 950;
    line-height: 1.02;
    letter-spacing: -0.045em;
}

.admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-subtitle {
    max-width: 720px;
    margin-top: 0.75rem;
    color: var(--mud-palette-text-secondary);
    font-weight: 650;
    line-height: 1.65;
}

.admin-salon-review-stats[b-4pg2gifhg2] {
    display: grid;
    grid-template-columns: repeat(3, minmax(92px, 1fr));
    gap: 0.7rem;
    align-content: start;
}

.admin-salon-review-stat[b-4pg2gifhg2] {
    min-width: 96px;
    padding: 0.9rem 1rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 12%, var(--mud-palette-divider));
    background: color-mix(in srgb, var(--mud-palette-surface) 90%, transparent);
    border-radius: 16px;
    text-align: center;
}

    .admin-salon-review-stat span[b-4pg2gifhg2] {
        display: block;
        color: var(--mud-palette-text-secondary);
        font-size: 0.7rem;
        font-weight: 900;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .admin-salon-review-stat strong[b-4pg2gifhg2] {
        display: block;
        margin-top: 0.15rem;
        color: var(--mud-palette-primary);
        font-size: 1.45rem;
        font-weight: 950;
    }

.admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1rem;
    padding: 0.85rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 9%, var(--mud-palette-divider));
    background: var(--mud-palette-surface);
    border-radius: 18px;
    box-shadow: 0 14px 30px color-mix(in srgb, var(--mud-palette-primary) 5%, transparent);
}

.admin-salon-review-type-tabs[b-4pg2gifhg2] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.admin-salon-review-type-button[b-4pg2gifhg2] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 42px;
    padding: 0.55rem 0.85rem;
    color: var(--mud-palette-text-secondary);
    font-family: inherit;
    font-weight: 850;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 12px;
    cursor: pointer;
}

    .admin-salon-review-type-button:hover[b-4pg2gifhg2] {
        color: var(--mud-palette-primary);
        background: color-mix(in srgb, var(--mud-palette-primary) 5%, var(--mud-palette-surface));
    }

.admin-salon-review-type-button-active[b-4pg2gifhg2] {
    color: var(--mud-palette-primary);
    background: color-mix(in srgb, var(--mud-palette-primary) 9%, var(--mud-palette-surface));
    border-color: color-mix(in srgb, var(--mud-palette-primary) 24%, var(--mud-palette-divider));
    box-shadow: 0 8px 18px color-mix(in srgb, var(--mud-palette-primary) 8%, transparent);
}

.admin-salon-review-type-button[b-4pg2gifhg2]  .mud-icon-root {
    font-size: 1.1rem;
}

.admin-salon-review-toolbar-actions[b-4pg2gifhg2] {
    display: flex;
    align-items: center;
    gap: 0.7rem;
}

.admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-state-filter {
    width: 210px;
}

    .admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-state-filter .mud-input-root {
        border-radius: 12px;
    }

.admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-alert {
    margin-top: 1rem;
    border-radius: 14px;
}

.admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-loading,
.admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-empty {
    display: grid;
    justify-items: center;
    gap: 0.8rem;
    margin-top: 1rem;
    padding: 3.25rem 1rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 9%, var(--mud-palette-divider));
    background: var(--mud-palette-surface);
    border-radius: 20px;
    text-align: center;
}

    .admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-empty .mud-icon-root {
        color: var(--mud-palette-secondary);
        font-size: 3rem;
    }

.admin-salon-review-grid[b-4pg2gifhg2] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1rem;
}

.admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-card {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    min-height: 100%;
    padding: 1rem;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 9%, var(--mud-palette-divider));
    background: var(--mud-palette-surface);
    border-radius: 19px;
    box-shadow: 0 14px 32px color-mix(in srgb, var(--mud-palette-primary) 5%, transparent);
}

.admin-salon-review-card[b-4pg2gifhg2]::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: color-mix(in srgb, var(--mud-palette-primary) 65%, transparent);
}

.admin-salon-review-card-media[b-4pg2gifhg2]::before {
    background: color-mix(in srgb, var(--mud-palette-info) 78%, transparent);
}

.admin-salon-review-card-combined[b-4pg2gifhg2]::before {
    background: linear-gradient(var(--mud-palette-primary), var(--mud-palette-secondary));
}

.admin-salon-review-card-completed[b-4pg2gifhg2] {
    opacity: 0.9;
}

.admin-salon-review-card-topline[b-4pg2gifhg2],
.admin-salon-review-card-header[b-4pg2gifhg2],
.admin-salon-review-card-actions[b-4pg2gifhg2] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.7rem;
}

.admin-salon-review-card-topline[b-4pg2gifhg2] {
    flex-wrap: wrap;
}

.admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-card-topline .mud-chip {
    font-weight: 900;
    border-radius: 999px;
}

.admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-card-title {
    color: var(--mud-palette-primary);
    font-weight: 950;
    line-height: 1.2;
}

.admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-card-location {
    display: block;
    margin-top: 0.15rem;
    color: var(--mud-palette-text-secondary);
    font-weight: 750;
}

.admin-salon-review-profile-status[b-4pg2gifhg2] {
    display: grid;
    justify-items: end;
    gap: 0.1rem;
}

    .admin-salon-review-profile-status > span[b-4pg2gifhg2] {
        color: var(--mud-palette-text-secondary);
        font-size: 0.65rem;
        font-weight: 900;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .admin-salon-review-profile-status[b-4pg2gifhg2]  .mud-chip {
        height: 24px;
        font-size: 0.72rem;
        font-weight: 900;
    }

.admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-card-description {
    min-height: 3.1rem;
    color: var(--mud-palette-text-secondary);
    font-weight: 650;
    line-height: 1.55;
}

.admin-salon-review-request-summary[b-4pg2gifhg2] {
    display: grid;
    gap: 0.55rem;
}

.admin-salon-review-request-row[b-4pg2gifhg2] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.65rem;
    padding: 0.75rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-warning) 18%, var(--mud-palette-divider));
    background: color-mix(in srgb, var(--mud-palette-warning) 6%, var(--mud-palette-surface));
    border-radius: 13px;
}

    .admin-salon-review-request-row[b-4pg2gifhg2]  .mud-icon-root {
        color: var(--mud-palette-warning);
        font-size: 1.2rem;
    }

    .admin-salon-review-request-row strong[b-4pg2gifhg2],
    .admin-salon-review-request-row span[b-4pg2gifhg2] {
        display: block;
    }

    .admin-salon-review-request-row strong[b-4pg2gifhg2] {
        color: var(--mud-palette-primary);
        font-size: 0.82rem;
        font-weight: 950;
    }

    .admin-salon-review-request-row span[b-4pg2gifhg2] {
        margin-top: 0.12rem;
        color: var(--mud-palette-text-secondary);
        font-size: 0.75rem;
        font-weight: 650;
        line-height: 1.4;
    }

.admin-salon-review-request-row-completed[b-4pg2gifhg2] {
    border-color: color-mix(in srgb, var(--mud-palette-success) 20%, var(--mud-palette-divider));
    background: color-mix(in srgb, var(--mud-palette-success) 5%, var(--mud-palette-surface));
}

    .admin-salon-review-request-row-completed[b-4pg2gifhg2]  .mud-icon-root {
        color: var(--mud-palette-success);
    }

.admin-salon-review-card-meta[b-4pg2gifhg2] {
    display: grid;
    gap: 0.35rem;
    margin-top: auto;
}

    .admin-salon-review-card-meta span[b-4pg2gifhg2] {
        display: flex;
        align-items: center;
        gap: 0.4rem;
        min-width: 0;
        color: var(--mud-palette-text-secondary);
        font-size: 0.76rem;
        font-weight: 750;
    }

    .admin-salon-review-card-meta[b-4pg2gifhg2]  .mud-icon-root {
        color: var(--mud-palette-secondary);
        font-size: 1rem;
    }

.admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-rejection {
    border-radius: 12px;
}

.admin-salon-review-card-actions[b-4pg2gifhg2] {
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    padding-top: 0.15rem;
}

.admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-card-actions .mud-button-root {
    min-height: 38px;
    border-radius: 10px;
    font-size: 0.78rem;
    font-weight: 900;
    text-transform: none;
}

.admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1rem;
    padding: 0.75rem 1rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 9%, var(--mud-palette-divider));
    border-radius: 16px;
}

@media (max-width: 1180px) {
    .admin-salon-review-grid[b-4pg2gifhg2] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-hero {
        flex-direction: column;
    }

    .admin-salon-review-stats[b-4pg2gifhg2] {
        width: 100%;
    }
}

@media (max-width: 820px) {
    .admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-salon-review-toolbar-actions[b-4pg2gifhg2] {
        justify-content: space-between;
    }

    .admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-state-filter {
        width: min(100%, 260px);
    }
}

@media (max-width: 700px) {
    .admin-salon-review-grid[b-4pg2gifhg2] {
        grid-template-columns: 1fr;
    }

    .admin-salon-review-stats[b-4pg2gifhg2] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .admin-salon-review-type-tabs[b-4pg2gifhg2],
    .admin-salon-review-toolbar-actions[b-4pg2gifhg2] {
        display: grid;
        grid-template-columns: 1fr;
    }

        .admin-salon-review-type-button[b-4pg2gifhg2],
        .admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-state-filter,
        .admin-salon-review-toolbar-actions[b-4pg2gifhg2]  .mud-button-root {
            width: 100%;
        }

    .admin-salon-review-page[b-4pg2gifhg2]  .admin-salon-review-pagination {
        flex-wrap: wrap;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .admin-salon-review-stats[b-4pg2gifhg2] {
        grid-template-columns: 1fr;
    }

    .admin-salon-review-card-header[b-4pg2gifhg2] {
        flex-direction: column;
    }

    .admin-salon-review-profile-status[b-4pg2gifhg2] {
        justify-items: start;
    }
}
/* /Components/Pages/AdminSalonReviewDetails.razor.rz.scp.css */
.admin-salon-review-details-page[b-w0cik8j5ok] {
    display: grid;
    gap: 1rem;
    padding-bottom: 3rem;
}

    .admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-back-button {
        width: fit-content;
        font-weight: 900;
        text-transform: none;
    }

    .admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-loading,
    .admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-empty {
        display: grid;
        justify-items: center;
        gap: 0.85rem;
        padding: 3rem 1rem;
        border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 9%, var(--mud-palette-divider));
        background: var(--mud-palette-surface);
        border-radius: 18px;
        text-align: center;
    }

        .admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-empty .mud-icon-root {
            color: var(--mud-palette-secondary);
            font-size: 3rem;
        }

    .admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-alert {
        border-radius: 14px;
    }

    .admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-hero {
        display: flex;
        justify-content: space-between;
        gap: 1.5rem;
        padding: clamp(1.25rem, 2vw, 2rem);
        border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 10%, var(--mud-palette-divider));
        background: radial-gradient(circle at 10% 16%, color-mix(in srgb, var(--mud-palette-primary) 10%, transparent), transparent 34%), radial-gradient(circle at 90% 12%, color-mix(in srgb, var(--mud-palette-secondary) 12%, transparent), transparent 30%), linear-gradient(135deg, color-mix(in srgb, var(--mud-palette-surface) 96%, var(--mud-palette-primary)), var(--mud-palette-surface));
        border-radius: 22px;
        box-shadow: 0 18px 42px color-mix(in srgb, var(--mud-palette-primary) 8%, transparent);
    }

.admin-review-hero-main[b-w0cik8j5ok] {
    min-width: 0;
    max-width: 780px;
}

.admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-eyebrow,
.admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-section-eyebrow {
    color: var(--mud-palette-secondary);
    font-weight: 950;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-title {
    margin-top: 0.25rem;
    color: var(--mud-palette-primary);
    font-size: clamp(2rem, 3vw, 3rem);
    font-weight: 950;
    line-height: 1.04;
    letter-spacing: -0.045em;
}

.admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-subtitle {
    margin-top: 0.45rem;
    color: var(--mud-palette-text-secondary);
    font-weight: 700;
}

.admin-review-hero-chips[b-w0cik8j5ok] {
    flex-wrap: wrap;
    margin-top: 1rem;
}

.admin-review-hero-actions[b-w0cik8j5ok] {
    display: flex;
    flex: 0 0 auto;
    align-items: flex-start;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-hero-actions .mud-button-root {
    min-height: 42px;
    border-radius: 10px;
    font-weight: 950;
    text-transform: none;
}

.admin-review-layout[b-w0cik8j5ok] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 1rem;
}

.admin-review-main-column[b-w0cik8j5ok],
.admin-review-side-column[b-w0cik8j5ok] {
    display: grid;
    gap: 1rem;
    align-content: start;
}

.admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-panel {
    padding: 1rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 9%, var(--mud-palette-divider));
    background: var(--mud-palette-surface);
    border-radius: 18px;
    box-shadow: 0 14px 32px color-mix(in srgb, var(--mud-palette-primary) 5%, transparent);
}

.admin-review-section-header[b-w0cik8j5ok] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-section-title {
    margin-top: 0.12rem;
    color: var(--mud-palette-primary);
    font-weight: 950;
    line-height: 1.18;
}

.admin-review-public-card[b-w0cik8j5ok] {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 1rem;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 8%, var(--mud-palette-divider));
    background: color-mix(in srgb, var(--mud-palette-primary) 3%, var(--mud-palette-surface));
    border-radius: 18px;
}

.admin-review-public-media[b-w0cik8j5ok] {
    position: relative;
    min-height: 220px;
    overflow: hidden;
    background: color-mix(in srgb, var(--mud-palette-primary) 8%, var(--mud-palette-surface));
}

    .admin-review-public-media img[b-w0cik8j5ok] {
        width: 100%;
        height: 100%;
        min-height: 220px;
        display: block;
        object-fit: cover;
    }

.admin-review-public-media-empty[b-w0cik8j5ok] {
    height: 100%;
    min-height: 220px;
    display: grid;
    place-items: center;
    gap: 0.35rem;
    color: var(--mud-palette-text-secondary);
    font-weight: 800;
    text-align: center;
}

    .admin-review-public-media-empty .mud-icon-root[b-w0cik8j5ok] {
        color: var(--mud-palette-secondary);
        font-size: 2.4rem;
    }

.admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-media-overlay-chip {
    position: absolute;
    left: 0.75rem;
    bottom: 0.75rem;
}

.admin-review-public-content[b-w0cik8j5ok] {
    min-width: 0;
    padding: 1.1rem 1.1rem 1.1rem 0;
}

.admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-public-title {
    color: var(--mud-palette-primary);
    font-weight: 950;
    line-height: 1.16;
}

.admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-public-location {
    display: block;
    margin-top: 0.2rem;
    color: var(--mud-palette-text-secondary);
    font-weight: 750;
}

.admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-public-description {
    margin-top: 0.8rem;
    color: var(--mud-palette-text-secondary);
    font-weight: 650;
    line-height: 1.55;
}

.admin-review-public-service-row[b-w0cik8j5ok] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin-top: 1rem;
}

    .admin-review-public-service-row span[b-w0cik8j5ok] {
        display: inline-flex;
        align-items: center;
        min-height: 26px;
        padding: 0.2rem 0.55rem;
        color: var(--mud-palette-primary);
        font-size: 0.76rem;
        font-weight: 900;
        background: color-mix(in srgb, var(--mud-palette-secondary) 12%, var(--mud-palette-surface));
        border: 1px solid color-mix(in srgb, var(--mud-palette-secondary) 20%, transparent);
        border-radius: 999px;
    }

.admin-review-empty-inline[b-w0cik8j5ok] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 1rem;
    color: var(--mud-palette-text-secondary);
    font-weight: 750;
    background: color-mix(in srgb, var(--mud-palette-primary) 3%, var(--mud-palette-surface));
    border: 1px dashed color-mix(in srgb, var(--mud-palette-primary) 16%, var(--mud-palette-divider));
    border-radius: 14px;
}

.admin-review-empty-inline-small[b-w0cik8j5ok] {
    padding: 0.75rem;
    font-size: 0.84rem;
}

.admin-review-empty-inline .mud-icon-root[b-w0cik8j5ok] {
    color: var(--mud-palette-secondary);
}

.admin-review-media-grid[b-w0cik8j5ok] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
}

.admin-review-media-card[b-w0cik8j5ok] {
    min-width: 0;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--mud-palette-warning) 18%, var(--mud-palette-divider));
    background: var(--mud-palette-surface);
    border-radius: 16px;
}

.admin-review-media-card-approved[b-w0cik8j5ok] {
    border-color: color-mix(in srgb, var(--mud-palette-success) 24%, var(--mud-palette-divider));
}

.admin-review-media-card-rejected[b-w0cik8j5ok] {
    border-color: color-mix(in srgb, var(--mud-palette-error) 26%, var(--mud-palette-divider));
}

.admin-review-media-card-primary[b-w0cik8j5ok] {
    box-shadow: 0 14px 30px color-mix(in srgb, var(--mud-palette-secondary) 13%, transparent);
}

.admin-review-media-image[b-w0cik8j5ok] {
    position: relative;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: color-mix(in srgb, var(--mud-palette-primary) 7%, var(--mud-palette-surface));
}

    .admin-review-media-image img[b-w0cik8j5ok] {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
    }

.admin-review-primary-badge[b-w0cik8j5ok] {
    position: absolute;
    left: 0.55rem;
    top: 0.55rem;
    min-height: 24px;
    padding: 0.18rem 0.55rem;
    color: #ffffff;
    font-size: 0.68rem;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    background: color-mix(in srgb, var(--mud-palette-primary) 88%, transparent);
    border-radius: 999px;
}

.admin-review-media-body[b-w0cik8j5ok] {
    display: grid;
    gap: 0.4rem;
    padding: 0.75rem;
}

.admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-media-name {
    display: block;
    overflow: hidden;
    color: var(--mud-palette-primary);
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-muted {
    color: var(--mud-palette-text-secondary);
    font-weight: 700;
}

.admin-review-service-list[b-w0cik8j5ok] {
    display: grid;
    gap: 0.9rem;
}

.admin-review-service-card[b-w0cik8j5ok] {
    display: grid;
    gap: 0.75rem;
    padding: 1rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 8%, var(--mud-palette-divider));
    background: color-mix(in srgb, var(--mud-palette-primary) 2%, var(--mud-palette-surface));
    border-radius: 16px;
}

.admin-review-service-header[b-w0cik8j5ok] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-service-title {
    color: var(--mud-palette-primary);
    font-weight: 950;
}

.admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-service-description {
    color: var(--mud-palette-text-secondary);
    font-weight: 650;
    line-height: 1.5;
}

.admin-review-service-media-row[b-w0cik8j5ok] {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0.65rem;
}

.admin-review-service-media[b-w0cik8j5ok] {
    position: relative;
    overflow: hidden;
    border-radius: 14px;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 8%, var(--mud-palette-divider));
    background: var(--mud-palette-surface);
}

    .admin-review-service-media img[b-w0cik8j5ok] {
        width: 100%;
        aspect-ratio: 1 / 1;
        display: block;
        object-fit: cover;
    }

    .admin-review-service-media[b-w0cik8j5ok]  .mud-chip {
        position: absolute;
        left: 0.45rem;
        bottom: 0.45rem;
        max-width: calc(100% - 0.9rem);
    }

.admin-review-progress-row[b-w0cik8j5ok] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-top: 1rem;
}

    .admin-review-progress-row strong[b-w0cik8j5ok] {
        display: block;
        color: var(--mud-palette-primary);
        font-size: 1.5rem;
        font-weight: 950;
        line-height: 1;
    }

    .admin-review-progress-row span[b-w0cik8j5ok] {
        display: block;
        margin-top: 0.18rem;
        color: var(--mud-palette-text-secondary);
        font-size: 0.78rem;
        font-weight: 850;
        text-transform: uppercase;
        letter-spacing: 0.04em;
    }

.admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-alert-in-panel {
    margin-top: 1rem;
    border-radius: 14px;
}

.admin-review-missing-list[b-w0cik8j5ok] {
    display: grid;
    gap: 0.5rem;
    margin-top: 1rem;
}

.admin-review-missing-item[b-w0cik8j5ok] {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
    color: var(--mud-palette-text-secondary);
    font-size: 0.86rem;
    font-weight: 750;
    line-height: 1.35;
}

    .admin-review-missing-item .mud-icon-root[b-w0cik8j5ok] {
        margin-top: 0.08rem;
        color: var(--mud-palette-warning);
        font-size: 1rem;
    }

.admin-review-info-list[b-w0cik8j5ok] {
    display: grid;
    gap: 0.65rem;
    margin-top: 1rem;
}

    .admin-review-info-list div[b-w0cik8j5ok] {
        min-width: 0;
        padding: 0.75rem;
        background: color-mix(in srgb, var(--mud-palette-primary) 3%, var(--mud-palette-surface));
        border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 7%, var(--mud-palette-divider));
        border-radius: 12px;
    }

    .admin-review-info-list span[b-w0cik8j5ok] {
        display: block;
        color: var(--mud-palette-text-secondary);
        font-size: 0.7rem;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 0.06em;
    }

    .admin-review-info-list strong[b-w0cik8j5ok] {
        display: block;
        overflow: hidden;
        margin-top: 0.18rem;
        color: var(--mud-palette-primary);
        font-size: 0.9rem;
        font-weight: 950;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-policy-text {
    margin-top: 0.75rem;
    color: var(--mud-palette-text-secondary);
    font-weight: 650;
    line-height: 1.5;
}

.admin-review-policy-grid[b-w0cik8j5ok] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin-top: 1rem;
}

    .admin-review-policy-grid span[b-w0cik8j5ok] {
        display: inline-flex;
        align-items: center;
        min-height: 26px;
        padding: 0.2rem 0.55rem;
        font-size: 0.72rem;
        font-weight: 950;
        border-radius: 999px;
    }

    .admin-review-policy-grid .policy-yes[b-w0cik8j5ok] {
        color: var(--mud-palette-success);
        background: color-mix(in srgb, var(--mud-palette-success) 9%, var(--mud-palette-surface));
        border: 1px solid color-mix(in srgb, var(--mud-palette-success) 20%, transparent);
    }

    .admin-review-policy-grid .policy-no[b-w0cik8j5ok] {
        color: var(--mud-palette-error);
        background: color-mix(in srgb, var(--mud-palette-error) 7%, var(--mud-palette-surface));
        border: 1px solid color-mix(in srgb, var(--mud-palette-error) 16%, transparent);
    }

.admin-salon-review-details-page[b-w0cik8j5ok]  .mud-chip {
    font-weight: 900;
    border-radius: 999px;
}

@media (max-width: 1180px) {
    .admin-review-layout[b-w0cik8j5ok] {
        grid-template-columns: 1fr;
    }

    .admin-review-side-column[b-w0cik8j5ok] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-review-decision-panel[b-w0cik8j5ok] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 860px) {
    .admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-hero {
        display: grid;
    }

    .admin-review-hero-actions[b-w0cik8j5ok] {
        justify-content: stretch;
    }

    .admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-hero-actions .mud-button-root {
        width: 100%;
    }

    .admin-review-public-card[b-w0cik8j5ok] {
        grid-template-columns: 1fr;
    }

    .admin-review-public-content[b-w0cik8j5ok] {
        padding: 1rem;
    }

    .admin-review-media-grid[b-w0cik8j5ok] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-review-service-media-row[b-w0cik8j5ok] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .admin-review-side-column[b-w0cik8j5ok] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .admin-review-section-header[b-w0cik8j5ok],
    .admin-review-service-header[b-w0cik8j5ok] {
        display: grid;
    }

    .admin-review-media-grid[b-w0cik8j5ok],
    .admin-review-service-media-row[b-w0cik8j5ok] {
        grid-template-columns: 1fr;
    }
}


.admin-review-media-actions[b-w0cik8j5ok] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin-top: 0.25rem;
}

.admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-media-actions .mud-button-root {
    min-height: 32px;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 950;
    text-transform: none;
}

.admin-review-service-media-actions[b-w0cik8j5ok] {
    position: absolute;
    top: 0.45rem;
    right: 0.45rem;
    z-index: 2;
    display: flex;
    gap: 0.3rem;
    padding: 0.18rem;
    background: color-mix(in srgb, var(--mud-palette-surface) 76%, transparent);
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 10%, transparent);
    border-radius: 999px;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--mud-palette-primary) 14%, transparent);
    backdrop-filter: blur(10px);
}

.admin-salon-review-details-page[b-w0cik8j5ok]  .admin-review-service-media-actions .mud-icon-button {
    width: 30px;
    height: 30px;
    padding: 0;
}

.admin-review-overview-panel[b-w0cik8j5ok] {
    position: relative;
    overflow: hidden;
}

.admin-review-overview-grid[b-w0cik8j5ok] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.85rem;
}

    .admin-review-overview-grid div[b-w0cik8j5ok] {
        display: grid;
        gap: 0.35rem;
        min-width: 0;
        padding: 1rem;
        border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 8%, var(--mud-palette-divider));
        background: color-mix(in srgb, var(--mud-palette-primary) 3%, var(--mud-palette-surface));
        border-radius: 16px;
    }

    .admin-review-overview-grid .mud-icon-root[b-w0cik8j5ok] {
        color: var(--mud-palette-secondary);
        font-size: 1.45rem;
    }

    .admin-review-overview-grid span[b-w0cik8j5ok] {
        color: var(--mud-palette-text-secondary);
        font-size: 0.72rem;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 0.06em;
    }

    .admin-review-overview-grid strong[b-w0cik8j5ok] {
        color: var(--mud-palette-primary);
        font-size: 1.35rem;
        font-weight: 950;
        line-height: 1;
    }

.admin-review-professional-list[b-w0cik8j5ok] {
    display: grid;
    gap: 0.85rem;
}

.admin-review-professional-card[b-w0cik8j5ok] {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    padding: 1rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 8%, var(--mud-palette-divider));
    background: color-mix(in srgb, var(--mud-palette-primary) 2%, var(--mud-palette-surface));
    border-radius: 16px;
}

.admin-review-professional-avatar[b-w0cik8j5ok] {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    color: #ffffff;
    font-weight: 950;
    background: color-mix(in srgb, var(--mud-palette-primary) 86%, var(--mud-palette-secondary));
    border-radius: 999px;
    box-shadow: 0 12px 24px color-mix(in srgb, var(--mud-palette-primary) 15%, transparent);
}

.admin-review-professional-copy[b-w0cik8j5ok] {
    display: grid;
    gap: 0.4rem;
    min-width: 0;
    width: 100%;
}

.admin-review-professional-title-row[b-w0cik8j5ok] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

    .admin-review-professional-title-row strong[b-w0cik8j5ok] {
        display: block;
        color: var(--mud-palette-primary);
        font-weight: 950;
        line-height: 1.2;
    }

    .admin-review-professional-title-row span[b-w0cik8j5ok],
    .admin-review-professional-copy p[b-w0cik8j5ok],
    .admin-review-professional-copy small[b-w0cik8j5ok] {
        color: var(--mud-palette-text-secondary);
        font-weight: 700;
        line-height: 1.45;
    }

.admin-review-professional-copy p[b-w0cik8j5ok] {
    margin: 0;
}

.admin-review-working-hours-grid[b-w0cik8j5ok] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

.admin-review-working-hour-card[b-w0cik8j5ok] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.65rem;
    align-items: start;
    padding: 0.9rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-success) 20%, var(--mud-palette-divider));
    background: color-mix(in srgb, var(--mud-palette-success) 5%, var(--mud-palette-surface));
    border-radius: 14px;
}

.admin-review-working-hour-card-closed[b-w0cik8j5ok] {
    border-color: color-mix(in srgb, var(--mud-palette-primary) 8%, var(--mud-palette-divider));
    background: color-mix(in srgb, var(--mud-palette-primary) 2%, var(--mud-palette-surface));
}

.admin-review-working-hour-card strong[b-w0cik8j5ok] {
    display: block;
    color: var(--mud-palette-primary);
    font-weight: 950;
}

.admin-review-working-hour-card span[b-w0cik8j5ok],
.admin-review-working-hour-breaks small[b-w0cik8j5ok] {
    color: var(--mud-palette-text-secondary);
    font-weight: 700;
}

.admin-review-working-hour-breaks[b-w0cik8j5ok] {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    padding-top: 0.2rem;
}

    .admin-review-working-hour-breaks small[b-w0cik8j5ok] {
        display: inline-flex;
        align-items: center;
        min-height: 24px;
        padding: 0.18rem 0.5rem;
        background: color-mix(in srgb, var(--mud-palette-warning) 8%, var(--mud-palette-surface));
        border: 1px solid color-mix(in srgb, var(--mud-palette-warning) 18%, transparent);
        border-radius: 999px;
    }

.admin-review-schedule-block-list[b-w0cik8j5ok] {
    display: grid;
    gap: 0.7rem;
}

.admin-review-schedule-block-card[b-w0cik8j5ok] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.9rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-info) 18%, var(--mud-palette-divider));
    background: color-mix(in srgb, var(--mud-palette-info) 5%, var(--mud-palette-surface));
    border-radius: 14px;
}

    .admin-review-schedule-block-card strong[b-w0cik8j5ok] {
        display: block;
        color: var(--mud-palette-primary);
        font-weight: 950;
    }

    .admin-review-schedule-block-card span[b-w0cik8j5ok],
    .admin-review-schedule-block-card small[b-w0cik8j5ok] {
        display: block;
        color: var(--mud-palette-text-secondary);
        font-weight: 700;
        line-height: 1.45;
    }

@media (max-width: 1180px) {
    .admin-review-overview-grid[b-w0cik8j5ok] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .admin-review-working-hours-grid[b-w0cik8j5ok] {
        grid-template-columns: 1fr;
    }

    .admin-review-professional-title-row[b-w0cik8j5ok] {
        display: grid;
    }
}

@media (max-width: 560px) {
    .admin-review-overview-grid[b-w0cik8j5ok] {
        grid-template-columns: 1fr;
    }
}


.admin-review-section-subtitle[b-w0cik8j5ok] {
    display: block;
    max-width: 720px;
    margin-top: 0.35rem;
}

.admin-review-media-workspace-panel[b-w0cik8j5ok] {
    border-color: color-mix(in srgb, var(--mud-palette-warning) 18%, var(--mud-palette-divider)) !important;
    background: radial-gradient(circle at 8% 10%, color-mix(in srgb, var(--mud-palette-warning) 7%, transparent), transparent 34%), var(--mud-palette-surface) !important;
}

.admin-review-media-workspace-header[b-w0cik8j5ok] {
    margin-bottom: 0.85rem;
}

.admin-review-media-filter-bar[b-w0cik8j5ok] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.7rem;
    margin-bottom: 1rem;
}

.admin-review-media-filter-button[b-w0cik8j5ok] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.55rem;
    min-height: 48px;
    padding: 0.65rem 0.8rem;
    color: var(--mud-palette-text-secondary);
    font: inherit;
    font-weight: 900;
    text-align: left;
    background: color-mix(in srgb, var(--mud-palette-primary) 3%, var(--mud-palette-surface));
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 9%, var(--mud-palette-divider));
    border-radius: 14px;
    cursor: pointer;
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease, color 160ms ease;
}

    .admin-review-media-filter-button:hover[b-w0cik8j5ok] {
        color: var(--mud-palette-primary);
        border-color: color-mix(in srgb, var(--mud-palette-secondary) 34%, var(--mud-palette-divider));
        transform: translateY(-1px);
    }

    .admin-review-media-filter-button span[b-w0cik8j5ok] {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .admin-review-media-filter-button strong[b-w0cik8j5ok] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 28px;
        height: 28px;
        padding: 0 0.45rem;
        color: var(--mud-palette-primary);
        background: color-mix(in srgb, var(--mud-palette-secondary) 12%, var(--mud-palette-surface));
        border-radius: 999px;
    }

.admin-review-media-filter-button-active[b-w0cik8j5ok] {
    color: var(--mud-palette-primary);
    border-color: color-mix(in srgb, var(--mud-palette-secondary) 44%, var(--mud-palette-divider));
    box-shadow: 0 12px 26px color-mix(in srgb, var(--mud-palette-secondary) 11%, transparent);
}

    .admin-review-media-filter-button-active strong[b-w0cik8j5ok] {
        color: #ffffff;
        background: var(--mud-palette-secondary);
    }

.admin-review-media-grid-featured[b-w0cik8j5ok] {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.admin-review-media-card-pending[b-w0cik8j5ok] {
    border-color: color-mix(in srgb, var(--mud-palette-warning) 34%, var(--mud-palette-divider));
    box-shadow: 0 14px 28px color-mix(in srgb, var(--mud-palette-warning) 10%, transparent);
}

.admin-review-media-location-badge[b-w0cik8j5ok] {
    position: absolute;
    right: 0.55rem;
    bottom: 0.55rem;
    max-width: calc(100% - 1.1rem);
    overflow: hidden;
    padding: 0.18rem 0.55rem;
    color: #ffffff;
    font-size: 0.68rem;
    font-weight: 950;
    text-overflow: ellipsis;
    white-space: nowrap;
    background: color-mix(in srgb, var(--mud-palette-primary) 82%, transparent);
    border-radius: 999px;
}

.admin-review-media-chip-row[b-w0cik8j5ok] {
    flex-wrap: wrap;
}

.admin-review-media-empty-state[b-w0cik8j5ok] {
    min-height: 112px;
    justify-content: center;
}

@media (max-width: 1180px) {
    .admin-review-media-grid-featured[b-w0cik8j5ok] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 860px) {
    .admin-review-media-filter-bar[b-w0cik8j5ok] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-review-media-grid-featured[b-w0cik8j5ok] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 560px) {
    .admin-review-media-filter-bar[b-w0cik8j5ok],
    .admin-review-media-grid-featured[b-w0cik8j5ok] {
        grid-template-columns: 1fr;
    }
}


.admin-review-request-strip[b-w0cik8j5ok] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.admin-review-request-tile[b-w0cik8j5ok] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 0.7rem;
    padding: 0.85rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 8%, var(--mud-palette-divider));
    background: var(--mud-palette-surface);
    border-radius: 15px;
}

    .admin-review-request-tile[b-w0cik8j5ok]  .mud-icon-root {
        color: var(--mud-palette-text-secondary);
        font-size: 1.35rem;
    }

    .admin-review-request-tile strong[b-w0cik8j5ok],
    .admin-review-request-tile span[b-w0cik8j5ok] {
        display: block;
    }

    .admin-review-request-tile strong[b-w0cik8j5ok] {
        color: var(--mud-palette-primary);
        font-size: 0.86rem;
        font-weight: 950;
    }

    .admin-review-request-tile span[b-w0cik8j5ok] {
        margin-top: 0.18rem;
        color: var(--mud-palette-text-secondary);
        font-size: 0.78rem;
        font-weight: 680;
        line-height: 1.45;
    }

.admin-review-request-tile-open[b-w0cik8j5ok] {
    border-color: color-mix(in srgb, var(--mud-palette-warning) 28%, var(--mud-palette-divider));
    background: color-mix(in srgb, var(--mud-palette-warning) 6%, var(--mud-palette-surface));
}

    .admin-review-request-tile-open[b-w0cik8j5ok]  .mud-icon-root {
        color: var(--mud-palette-warning);
    }

.admin-review-request-tile-media[b-w0cik8j5ok] {
    border-color: color-mix(in srgb, var(--mud-palette-info) 28%, var(--mud-palette-divider));
    background: color-mix(in srgb, var(--mud-palette-info) 6%, var(--mud-palette-surface));
}

    .admin-review-request-tile-media[b-w0cik8j5ok]  .mud-icon-root {
        color: var(--mud-palette-info);
    }

.admin-review-request-tile-draft[b-w0cik8j5ok] {
    border-style: dashed;
    background: color-mix(in srgb, var(--mud-palette-primary) 2%, var(--mud-palette-surface));
}

.admin-review-media-card-draft[b-w0cik8j5ok] {
    border-style: dashed;
    border-color: color-mix(in srgb, var(--mud-palette-text-secondary) 24%, var(--mud-palette-divider));
    opacity: 0.86;
}

@media (max-width: 900px) {
    .admin-review-request-strip[b-w0cik8j5ok] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/AppointmentDetails.razor.rz.scp.css */
.appointment-details-page[b-c2tz4j8x1j] {
    padding-bottom: 3rem;
}

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-loading-panel,
    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-error-panel {
        padding: 2.5rem;
        border: 1px solid rgba(203, 213, 225, 0.9);
        background: rgba(255, 255, 255, 0.96);
        box-shadow: 0 18px 44px rgba(15, 23, 42, 0.08);
    }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-hero {
        position: relative;
        overflow: hidden;
        padding: 2rem;
        border: 1px solid rgba(203, 213, 225, 0.9);
        box-shadow: 0 24px 60px rgba(15, 23, 42, 0.11);
    }

        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-hero::before {
            content: "";
            position: absolute;
            inset: -40%;
            background: radial-gradient(circle at 15% 25%, rgba(255, 255, 255, 0.42), transparent 28%), radial-gradient(circle at 85% 10%, rgba(255, 255, 255, 0.24), transparent 26%), radial-gradient(circle at 75% 90%, rgba(255, 255, 255, 0.22), transparent 30%);
            pointer-events: none;
        }

        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-hero > .mud-grid {
            position: relative;
            z-index: 1;
        }

        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-hero.is-pending {
            background: linear-gradient(135deg, rgba(245, 158, 11, 0.22), rgba(255, 251, 235, 0.96));
        }

        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-hero.is-confirmed {
            background: linear-gradient(135deg, rgba(34, 197, 94, 0.2), rgba(240, 253, 244, 0.96));
        }

        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-hero.is-completed {
            background: linear-gradient(135deg, rgba(91, 75, 255, 0.18), rgba(245, 243, 255, 0.96));
        }

        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-hero.is-cancelled,
        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-hero.is-expired {
            background: linear-gradient(135deg, rgba(100, 116, 139, 0.16), rgba(248, 250, 252, 0.98));
        }

        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-hero.is-noshow {
            background: linear-gradient(135deg, rgba(239, 68, 68, 0.18), rgba(254, 242, 242, 0.96));
        }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-hero-top,
    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-section-header {
        gap: 1rem;
    }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-hero-avatar {
        width: 56px;
        height: 56px;
        box-shadow: 0 14px 30px rgba(15, 23, 42, 0.16);
    }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-eyebrow {
        color: #64748b;
        font-weight: 800;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        font-size: 0.74rem;
    }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-title {
        color: #0f172a;
        line-height: 1.05;
    }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-subtitle {
        color: #334155;
        font-size: 1.05rem;
        font-weight: 600;
    }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-reference {
        color: #64748b;
    }

        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-reference strong {
            color: #0f172a;
            font-weight: 800;
        }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-hero-summary {
        padding: 1.25rem;
        background: rgba(255, 255, 255, 0.74);
        border: 1px solid rgba(255, 255, 255, 0.82);
        backdrop-filter: blur(14px);
        box-shadow: 0 18px 42px rgba(15, 23, 42, 0.1);
    }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-summary-label,
    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-muted {
        color: #64748b;
    }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-summary-value {
        color: #0f172a;
        font-weight: 800;
    }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-alert {
        box-shadow: 0 12px 30px rgba(15, 23, 42, 0.06);
    }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-main-panel,
    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-status-panel,
    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-side-panel {
        padding: 1.5rem;
        background: rgba(255, 255, 255, 0.98);
        border: 1px solid rgba(203, 213, 225, 0.92);
        box-shadow: 0 16px 42px rgba(15, 23, 42, 0.075);
    }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-info-card {
        height: 100%;
        padding: 1rem;
        border: 1px solid rgba(203, 213, 225, 0.82);
        background: linear-gradient(135deg, rgba(248, 250, 252, 0.96), rgba(255, 255, 255, 0.98));
        transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
    }

        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-info-card:hover {
            transform: translateY(-2px);
            border-color: rgba(91, 75, 255, 0.28);
            box-shadow: 0 14px 34px rgba(15, 23, 42, 0.08);
        }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-note-panel {
        padding: 1rem;
        border: 1px solid rgba(91, 75, 255, 0.16);
        background: linear-gradient(135deg, rgba(91, 75, 255, 0.055), rgba(20, 184, 166, 0.045));
    }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-status-panel {
        position: relative;
        overflow: hidden;
    }

        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-status-panel::before {
            content: "";
            position: absolute;
            inset: 0;
            border-left: 5px solid rgba(91, 75, 255, 0.38);
            pointer-events: none;
        }

        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-status-panel.status-is-pending::before {
            border-left-color: rgba(245, 158, 11, 0.75);
        }

        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-status-panel.status-is-confirmed::before {
            border-left-color: rgba(34, 197, 94, 0.75);
        }

        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-status-panel.status-is-noshow::before,
        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-status-panel.status-is-cancelled::before {
            border-left-color: rgba(239, 68, 68, 0.62);
        }

        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-status-panel.status-is-completed::before {
            border-left-color: rgba(91, 75, 255, 0.75);
        }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-status-alert {
        border-radius: 14px;
    }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-cancel-panel {
        padding: 1rem;
        border: 1px solid rgba(239, 68, 68, 0.22);
        background: linear-gradient(135deg, rgba(239, 68, 68, 0.055), rgba(254, 242, 242, 0.96));
    }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-actions {
        flex-wrap: wrap;
    }

        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-actions .mud-button-root {
            min-height: 44px;
            min-width: 150px;
        }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-timeline {
        position: relative;
    }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-timeline-step {
        position: relative;
        display: grid;
        grid-template-columns: 18px 1fr;
        gap: 0.85rem;
        padding: 0.2rem 0 1.15rem;
        color: #94a3b8;
    }

        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-timeline-step:not(:last-child)::after {
            content: "";
            position: absolute;
            left: 8px;
            top: 22px;
            bottom: -3px;
            width: 2px;
            background: rgba(203, 213, 225, 0.9);
        }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-timeline-dot {
        position: relative;
        z-index: 1;
        width: 18px;
        height: 18px;
        margin-top: 0.15rem;
        border-radius: 999px;
        border: 3px solid #cbd5e1;
        background: #ffffff;
    }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-timeline-step.is-complete {
        color: #334155;
    }

        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-timeline-step.is-complete .appointment-details-timeline-dot {
            border-color: #14b8a6;
            background: #14b8a6;
            box-shadow: 0 0 0 5px rgba(20, 184, 166, 0.12);
        }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-timeline-step.is-active {
        color: #0f172a;
    }

        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-timeline-step.is-active .appointment-details-timeline-dot {
            border-color: #5b4bff;
            background: #ffffff;
            box-shadow: 0 0 0 6px rgba(91, 75, 255, 0.14);
        }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-auto-refresh-alert {
        border-radius: 14px;
    }

@media (max-width: 960px) {
    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-hero {
        padding: 1.5rem;
    }

    .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-title {
        font-size: 2rem;
    }
}

@media (max-width: 600px) {
    .appointment-details-page[b-c2tz4j8x1j] {
        padding-bottom: 2rem;
    }

        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-hero,
        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-main-panel,
        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-status-panel,
        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-side-panel,
        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-loading-panel,
        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-error-panel {
            padding: 1rem;
        }

        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-hero-top,
        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-section-header,
        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-actions {
            flex-direction: column;
            align-items: flex-start !important;
        }

            .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-actions,
            .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-actions .mud-button-root {
                width: 100%;
            }

        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-title {
            font-size: 1.8rem;
        }

        .appointment-details-page[b-c2tz4j8x1j]  .appointment-details-hero-summary {
            margin-top: 1rem;
        }
}
/* /Components/Pages/Appointments.razor.rz.scp.css */
.appointments-center-page[b-crpmfagskd] {
    --appointments-primary: var(--mud-palette-primary, #15324b);
    --appointments-secondary: var(--mud-palette-secondary, #b89b5e);
    --appointments-surface: #fffdf8;
    --appointments-surface-soft: #f7f3ea;
    --appointments-text-primary: #15324b;
    --appointments-text-secondary: rgba(21, 50, 75, 0.68);
    --appointments-text-muted: rgba(21, 50, 75, 0.58);
    --appointments-border: rgba(21, 50, 75, 0.12);
    --appointments-border-strong: rgba(184, 155, 94, 0.28);
    --appointments-primary-soft: rgba(21, 50, 75, 0.08);
    --appointments-secondary-soft: rgba(184, 155, 94, 0.14);
    --appointments-shadow: rgba(21, 50, 75, 0.1);
    padding-bottom: 3rem;
}

    .appointments-center-page[b-crpmfagskd]  .appointments-center-loading,
    .appointments-center-page[b-crpmfagskd]  .appointments-center-error {
        padding: 2.5rem;
        border: 1px solid var(--appointments-border);
        background: rgba(255, 253, 248, 0.96);
        box-shadow: 0 18px 44px var(--appointments-shadow);
    }

    .appointments-center-page[b-crpmfagskd]  .appointments-center-hero {
        position: relative;
        overflow: hidden;
        padding: 2rem;
        border: 1px solid var(--appointments-border-strong);
        background: radial-gradient(circle at 12% 20%, rgba(184, 155, 94, 0.18), transparent 32%), linear-gradient(135deg, rgba(255, 253, 248, 0.98), rgba(247, 243, 234, 0.94));
        box-shadow: 0 24px 60px rgba(21, 50, 75, 0.12);
    }

        .appointments-center-page[b-crpmfagskd]  .appointments-center-hero::before {
            content: "";
            position: absolute;
            inset: -40%;
            background: radial-gradient(circle at 12% 22%, rgba(255, 255, 255, 0.58), transparent 28%), radial-gradient(circle at 86% 12%, rgba(184, 155, 94, 0.18), transparent 28%), radial-gradient(circle at 72% 90%, rgba(21, 50, 75, 0.055), transparent 32%);
            pointer-events: none;
        }

        .appointments-center-page[b-crpmfagskd]  .appointments-center-hero > .mud-grid {
            position: relative;
            z-index: 1;
        }

    .appointments-center-page[b-crpmfagskd]  .appointments-center-hero-top {
        gap: 1rem;
    }

    .appointments-center-page[b-crpmfagskd]  .appointments-center-hero-avatar {
        width: 56px;
        height: 56px;
        box-shadow: 0 14px 30px rgba(21, 50, 75, 0.18);
    }

    .appointments-center-page[b-crpmfagskd]  .appointments-center-eyebrow {
        color: var(--appointments-text-muted);
        font-weight: 900;
        letter-spacing: 0.09em;
        text-transform: uppercase;
        font-size: 0.74rem;
    }

    .appointments-center-page[b-crpmfagskd]  .appointments-center-title {
        color: var(--appointments-text-primary);
        line-height: 1.05;
    }

    .appointments-center-page[b-crpmfagskd]  .appointments-center-subtitle {
        color: var(--appointments-text-primary);
        max-width: 760px;
        font-size: 1.05rem;
        font-weight: 650;
        line-height: 1.55;
    }

    .appointments-center-page[b-crpmfagskd]  .appointments-center-hero-summary {
        padding: 1.25rem;
        background: rgba(255, 253, 248, 0.78);
        border: 1px solid rgba(255, 255, 255, 0.78);
        backdrop-filter: blur(14px);
        box-shadow: 0 18px 42px rgba(21, 50, 75, 0.1);
    }

    .appointments-center-page[b-crpmfagskd]  .appointments-center-summary-label,
    .appointments-center-page[b-crpmfagskd]  .appointments-center-muted,
    .appointments-center-page[b-crpmfagskd]  .appointments-center-summary-text {
        color: var(--appointments-text-secondary);
    }

    .appointments-center-page[b-crpmfagskd]  .appointments-center-option-card,
    .appointments-center-page[b-crpmfagskd]  .appointments-center-side-panel {
        height: 100%;
        padding: 1.35rem;
        border: 1px solid var(--appointments-border);
        background: rgba(255, 253, 248, 0.98);
        box-shadow: 0 16px 42px rgba(21, 50, 75, 0.085);
    }

    .appointments-center-page[b-crpmfagskd]  .appointments-center-option-card {
        position: relative;
        overflow: hidden;
        min-height: 360px;
        transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
    }

        .appointments-center-page[b-crpmfagskd]  .appointments-center-option-card:hover {
            transform: translateY(-3px);
            border-color: rgba(184, 155, 94, 0.34);
            box-shadow: 0 24px 54px rgba(21, 50, 75, 0.13);
        }

        .appointments-center-page[b-crpmfagskd]  .appointments-center-option-card::before {
            content: "";
            position: absolute;
            inset: 0;
            border-left: 5px solid rgba(21, 50, 75, 0.68);
            pointer-events: none;
        }

    .appointments-center-page[b-crpmfagskd]  .appointments-center-option-salon::before {
        border-left-color: rgba(184, 155, 94, 0.82);
    }

    .appointments-center-page[b-crpmfagskd]  .appointments-center-option-setup::before {
        border-left-color: rgba(184, 155, 94, 0.82);
    }

    .appointments-center-page[b-crpmfagskd]  .appointments-center-option-content {
        height: 100%;
    }

    .appointments-center-page[b-crpmfagskd]  .appointments-center-option-avatar {
        box-shadow: 0 12px 26px rgba(21, 50, 75, 0.14);
    }

    .appointments-center-page[b-crpmfagskd]  .appointments-center-option-text {
        color: var(--appointments-text-primary);
        line-height: 1.6;
    }

    .appointments-center-page[b-crpmfagskd]  .appointments-center-mini-list {
        padding: 0.85rem;
        border-radius: 14px;
        background: linear-gradient(135deg, rgba(247, 243, 234, 0.88), rgba(255, 253, 248, 0.98));
        border: 1px solid var(--appointments-border);
    }

        .appointments-center-page[b-crpmfagskd]  .appointments-center-mini-list .mud-typography {
            display: flex;
            gap: 0.45rem;
            align-items: center;
            color: var(--appointments-text-primary);
            font-weight: 750;
        }

        .appointments-center-page[b-crpmfagskd]  .appointments-center-mini-list .mud-icon-root {
            color: var(--appointments-secondary);
        }

    .appointments-center-page[b-crpmfagskd]  .appointments-center-option-button {
        margin-top: auto;
        min-height: 48px;
    }

    .appointments-center-page[b-crpmfagskd]  .appointments-center-progress {
        position: relative;
    }

    .appointments-center-page[b-crpmfagskd]  .appointments-center-progress-step {
        position: relative;
        display: grid;
        grid-template-columns: 18px 1fr;
        gap: 0.85rem;
        padding: 0.2rem 0 1.15rem;
        color: rgba(21, 50, 75, 0.42);
    }

        .appointments-center-page[b-crpmfagskd]  .appointments-center-progress-step:not(:last-child)::after {
            content: "";
            position: absolute;
            left: 8px;
            top: 22px;
            bottom: -3px;
            width: 2px;
            background: rgba(21, 50, 75, 0.12);
        }

    .appointments-center-page[b-crpmfagskd]  .appointments-center-progress-dot {
        position: relative;
        z-index: 1;
        width: 18px;
        height: 18px;
        margin-top: 0.15rem;
        border-radius: 999px;
        border: 3px solid rgba(21, 50, 75, 0.22);
        background: var(--appointments-surface);
    }

    .appointments-center-page[b-crpmfagskd]  .appointments-center-progress-step.is-active {
        color: var(--appointments-text-primary);
    }

        .appointments-center-page[b-crpmfagskd]  .appointments-center-progress-step.is-active .appointments-center-progress-dot {
            border-color: var(--appointments-secondary);
            background: var(--appointments-surface);
            box-shadow: 0 0 0 6px rgba(184, 155, 94, 0.18);
        }

    .appointments-center-page[b-crpmfagskd]  .appointments-center-info-alert {
        border-radius: 14px;
    }

@media (max-width: 960px) {
    .appointments-center-page[b-crpmfagskd]  .appointments-center-hero {
        padding: 1.5rem;
    }

    .appointments-center-page[b-crpmfagskd]  .appointments-center-title {
        font-size: 2rem;
    }
}

@media (max-width: 600px) {
    .appointments-center-page[b-crpmfagskd] {
        padding-bottom: 2rem;
    }

        .appointments-center-page[b-crpmfagskd]  .appointments-center-hero,
        .appointments-center-page[b-crpmfagskd]  .appointments-center-loading,
        .appointments-center-page[b-crpmfagskd]  .appointments-center-error,
        .appointments-center-page[b-crpmfagskd]  .appointments-center-option-card,
        .appointments-center-page[b-crpmfagskd]  .appointments-center-side-panel {
            padding: 1rem;
        }

        .appointments-center-page[b-crpmfagskd]  .appointments-center-hero-top {
            flex-direction: column;
            align-items: flex-start !important;
        }

        .appointments-center-page[b-crpmfagskd]  .appointments-center-title {
            font-size: 1.85rem;
        }

        .appointments-center-page[b-crpmfagskd]  .appointments-center-hero-summary {
            margin-top: 1rem;
        }
}
/* /Components/Pages/Auth/ConfirmEmail.razor.rz.scp.css */
.confirm-email-state[b-bcrezlh244] {
    display: grid;
    justify-items: center;
    gap: 1rem;
    padding: 1.4rem;
    color: var(--mud-palette-text-secondary);
}

.confirm-email-recovery-copy[b-bcrezlh244] {
    color: var(--mud-palette-text-secondary);
    line-height: 1.65;
}
/* /Components/Pages/Auth/ForgotPassword.razor.rz.scp.css */
.auth-recovery-page[b-1bscff95da] {
    min-height: calc(100vh - 150px);
    display: grid;
    place-items: center;
    padding: 3rem 1rem 4rem;
    background: radial-gradient( circle at 12% 12%, color-mix(in srgb, #B89B5E 15%, transparent), transparent 28%), radial-gradient( circle at 88% 84%, color-mix(in srgb, var(--mud-palette-primary) 12%, transparent), transparent 30%), var(--mud-palette-background);
}

.auth-recovery-card[b-1bscff95da] {
    width: min(100%, 520px);
    display: grid;
    gap: 1.1rem;
    padding: 2.35rem;
    text-align: center;
    border: 1px solid color-mix( in srgb, var(--mud-palette-primary) 12%, var(--mud-palette-divider));
    border-radius: 30px;
    background: var(--mud-palette-surface);
    box-shadow: 0 28px 80px color-mix( in srgb, var(--mud-palette-primary) 14%, transparent);
}

.auth-recovery-brand[b-1bscff95da] {
    display: inline-flex;
    justify-self: center;
    margin-bottom: .25rem;
}

    .auth-recovery-brand img[b-1bscff95da] {
        display: block;
        width: 154px;
        height: auto;
    }

.auth-recovery-icon[b-1bscff95da] {
    width: 78px;
    height: 78px;
    display: grid;
    place-items: center;
    justify-self: center;
    color: #15324B;
    border-radius: 25px;
    background: #EFE2C6;
}

.auth-recovery-icon-success[b-1bscff95da] {
    color: #2F7D72;
    background: #DDEFEA;
}

.auth-recovery-icon-error[b-1bscff95da] {
    color: var(--mud-palette-error);
    background: color-mix( in srgb, var(--mud-palette-error) 10%, var(--mud-palette-surface));
}

.auth-recovery-page[b-1bscff95da]  .auth-recovery-title {
    color: var(--mud-palette-primary);
    font-weight: 950;
    letter-spacing: -.035em;
}

.auth-recovery-page[b-1bscff95da]  .auth-recovery-copy {
    max-width: 420px;
    justify-self: center;
    color: var(--mud-palette-text-secondary);
    line-height: 1.7;
}

.auth-recovery-page[b-1bscff95da]  form {
    width: 100%;
}

.auth-recovery-page[b-1bscff95da]  .auth-recovery-primary {
    min-height: 52px;
    border-radius: 16px;
    font-weight: 900;
}

.auth-recovery-page[b-1bscff95da]  .auth-recovery-security {
    color: var(--mud-palette-text-secondary);
    line-height: 1.55;
}

@media (max-width: 600px) {
    .auth-recovery-page[b-1bscff95da] {
        padding: 1.25rem .75rem 2.5rem;
    }

    .auth-recovery-card[b-1bscff95da] {
        padding: 1.45rem;
        border-radius: 24px;
    }
}
/* /Components/Pages/Auth/Login.razor.rz.scp.css */
.bb-login-actions-row[b-j57nxzpfo8] {
    display: flex;
    justify-content: space-between;
    gap: .75rem;
    align-items: center;
    color: var(--mud-palette-text-secondary);
    font-size: .78rem;
}

    .bb-login-actions-row span[b-j57nxzpfo8] {
        padding: .32rem .55rem;
        border-radius: 999px;
        background: #F7F3EA;
        border: 1px solid #E5DCCE;
        white-space: nowrap;
    }

@media(max-width:600px) {
    .bb-login-actions-row[b-j57nxzpfo8] {
        align-items: flex-start;
        flex-direction: column
    }

        .bb-login-actions-row span[b-j57nxzpfo8] {
            white-space: normal
        }
}


.bb-login-registration-heading[b-j57nxzpfo8] {
    display: grid;
    gap: 0.18rem;
    padding-top: 0.15rem;
    text-align: center;
}

    .bb-login-registration-heading span[b-j57nxzpfo8] {
        color: var(--mud-palette-secondary);
        font-size: 0.68rem;
        font-weight: 950;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .bb-login-registration-heading strong[b-j57nxzpfo8] {
        color: var(--mud-palette-primary);
        font-size: 0.86rem;
        line-height: 1.4;
    }

.bb-login-account-options[b-j57nxzpfo8] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.7rem;
}

.bb-login-account-option[b-j57nxzpfo8] {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.62rem;
    align-items: center;
    padding: 0.78rem;
    color: var(--mud-palette-text-primary);
    text-decoration: none;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 11%, var(--mud-palette-divider));
    border-radius: 15px;
    background: linear-gradient( 135deg, color-mix(in srgb, var(--mud-palette-primary) 5%, var(--mud-palette-surface)), color-mix(in srgb, var(--mud-palette-secondary) 6%, var(--mud-palette-surface)));
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

    .bb-login-account-option:hover[b-j57nxzpfo8],
    .bb-login-account-option:focus-visible[b-j57nxzpfo8] {
        color: var(--mud-palette-text-primary);
        text-decoration: none;
        transform: translateY(-2px);
        border-color: color-mix(in srgb, var(--mud-palette-secondary) 34%, var(--mud-palette-divider));
        box-shadow: 0 14px 30px color-mix(in srgb, var(--mud-palette-primary) 10%, transparent);
        outline: none;
    }

.bb-login-account-icon[b-j57nxzpfo8] {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    color: #ffffff;
    border-radius: 12px;
    background: linear-gradient(135deg, var(--mud-palette-primary), var(--mud-palette-secondary));
}

    .bb-login-account-icon[b-j57nxzpfo8]  .mud-icon-root {
        color: #ffffff !important;
        font-size: 1.05rem;
    }

.bb-login-account-copy[b-j57nxzpfo8] {
    min-width: 0;
    display: grid;
    gap: 0.12rem;
}

    .bb-login-account-copy small[b-j57nxzpfo8] {
        color: var(--mud-palette-text-secondary);
        font-size: 0.66rem;
        font-weight: 800;
    }

    .bb-login-account-copy strong[b-j57nxzpfo8] {
        color: var(--mud-palette-primary);
        font-size: 0.78rem;
        font-weight: 950;
        line-height: 1.25;
    }

.bb-login-account-arrow[b-j57nxzpfo8] {
    color: var(--mud-palette-secondary);
    font-size: 1rem;
}

@media(max-width:600px) {
    .bb-login-account-options[b-j57nxzpfo8] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Auth/RegisterCustomer.razor.rz.scp.css */
.bb-customer-register-loading[b-d5z6twyzia] {
    min-height: calc(100vh - 160px);
    display: grid;
    place-items: center;
    align-content: center;
    gap: 1rem;
    color: var(--mud-palette-primary);
}

.bb-customer-coming-soon[b-d5z6twyzia] {
    display: grid;
    gap: 1rem;
    text-align: center;
}

.bb-coming-soon-seal[b-d5z6twyzia] {
    width: 78px;
    height: 78px;
    display: grid;
    place-items: center;
    justify-self: center;
    color: var(--mud-palette-primary);
    border-radius: 25px;
    background: #EFE2C6;
}

.bb-customer-coming-soon > strong[b-d5z6twyzia] {
    color: var(--mud-palette-primary);
    font-size: 1.05rem;
    font-weight: 950;
}

.bb-customer-coming-soon > p[b-d5z6twyzia] {
    margin: 0;
    color: var(--mud-palette-text-secondary);
    line-height: 1.65;
}

.bb-register-phone-field[b-d5z6twyzia] {
    position: relative;
}

.bb-register-phone-prefix[b-d5z6twyzia] {
    position: absolute;
    left: 13px;
    top: 31px;
    z-index: 4;
    min-width: 78px;
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 0.32rem 0.52rem;
    color: var(--mud-palette-text-primary);
    border: 1px solid #E5DCCE;
    border-radius: 10px;
    background: #F7F3EA;
    box-shadow: 0 3px 8px rgba(21, 50, 75, 0.05);
    transform: translateY(-50%);
    pointer-events: none;
}

    .bb-register-phone-prefix img[b-d5z6twyzia] {
        flex: 0 0 16px;
        width: 16px;
        min-width: 16px;
        max-width: 16px;
        height: 16px;
        min-height: 16px;
        max-height: 16px;
        display: block;
        object-fit: cover;
        object-position: center;
        border-radius: 2px;
        box-shadow: none;
        filter: none;
        transform: none;
        image-rendering: pixelated;
    }

    .bb-register-phone-prefix strong[b-d5z6twyzia] {
        color: var(--mud-palette-text-primary);
        font-size: 0.76rem;
        font-weight: 900;
        line-height: 1;
        white-space: nowrap;
    }

[b-d5z6twyzia] .bb-register-phone-input .mud-input-adornment-start {
    visibility: hidden;
    width: 94px;
    min-width: 94px;
}

[b-d5z6twyzia] .bb-register-phone-input input {
    padding-left: 0.15rem;
}

.bb-register-phone-message[b-d5z6twyzia] {
    display: flex;
    align-items: flex-start;
    gap: 0.42rem;
    margin-top: 0.38rem;
    padding: 0 0.2rem;
    font-size: 0.76rem;
    font-weight: 700;
    line-height: 1.45;
}

    .bb-register-phone-message[b-d5z6twyzia]  .mud-icon-root {
        flex: 0 0 auto;
        margin-top: 0.05rem;
    }

.bb-register-phone-hint[b-d5z6twyzia] {
    color: var(--mud-palette-text-secondary);
}

.bb-register-phone-error[b-d5z6twyzia] {
    color: var(--mud-palette-error);
}

.bb-password-checklist[b-d5z6twyzia] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
}

    .bb-password-checklist div[b-d5z6twyzia] {
        display: flex;
        align-items: center;
        gap: 0.4rem;
        padding: 0.55rem 0.65rem;
        color: var(--mud-palette-text-secondary);
        font-size: 0.75rem;
        font-weight: 750;
        border: 1px solid #E5DCCE;
        border-radius: 13px;
        background: #F7F3EA;
    }

    .bb-password-checklist .is-complete[b-d5z6twyzia] {
        color: var(--mud-palette-success);
        border-color: color-mix(in srgb, var(--mud-palette-success) 25%, #E5DCCE);
        background: color-mix(in srgb, var(--mud-palette-success) 7%, #FFFDF8);
    }

.bb-customer-access-note[b-d5z6twyzia] {
    display: grid;
    grid-template-columns: 36px 1fr;
    gap: 0.65rem;
    align-items: center;
    padding: 0.72rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-secondary) 24%, #E5DCCE);
    border-radius: 15px;
    background: #F7F3EA;
}

    .bb-customer-access-note > .mud-icon-root[b-d5z6twyzia] {
        color: var(--mud-palette-secondary);
    }

    .bb-customer-access-note div[b-d5z6twyzia] {
        display: grid;
        gap: 0.12rem;
    }

    .bb-customer-access-note strong[b-d5z6twyzia] {
        color: var(--mud-palette-primary);
        font-size: 0.8rem;
    }

    .bb-customer-access-note span[b-d5z6twyzia],
    .bb-register-legal[b-d5z6twyzia] {
        color: var(--mud-palette-text-secondary);
        font-size: 0.73rem;
        line-height: 1.45;
    }

.bb-register-legal[b-d5z6twyzia] {
    text-align: center;
}

.bb-auth-role-switch[b-d5z6twyzia] {
    display: grid;
    gap: 0.25rem;
    padding: 0.8rem;
    text-align: center;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 11%, var(--mud-palette-divider));
    border-radius: 14px;
    background: color-mix(in srgb, var(--mud-palette-primary) 4%, var(--mud-palette-surface));
}

    .bb-auth-role-switch > span[b-d5z6twyzia] {
        color: var(--mud-palette-text-secondary);
        font-size: 0.75rem;
        font-weight: 750;
    }

    .bb-auth-role-switch[b-d5z6twyzia]  a {
        font-size: 0.84rem;
        font-weight: 900;
    }

@media (max-width: 600px) {
    .bb-password-checklist[b-d5z6twyzia] {
        grid-template-columns: 1fr;
    }

    .bb-register-phone-prefix[b-d5z6twyzia] {
        left: 11px;
        min-width: 76px;
    }

    [b-d5z6twyzia] .bb-register-phone-input .mud-input-adornment-start {
        width: 91px;
        min-width: 91px;
    }
}


/* BB-CUSTOMER-EARLY-ACCESS-MARKETING-01 */
.bb-customer-early-access-banner[b-d5z6twyzia] {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.85rem;
    padding: 1rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-secondary) 28%, var(--mud-palette-divider));
    border-radius: 20px;
    background: radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--mud-palette-secondary) 17%, transparent), transparent 30%), linear-gradient( 135deg, color-mix(in srgb, var(--mud-palette-primary) 6%, var(--mud-palette-surface)), color-mix(in srgb, var(--mud-palette-secondary) 9%, var(--mud-palette-surface)));
    box-shadow: 0 16px 38px color-mix(in srgb, var(--mud-palette-primary) 8%, transparent);
}

    .bb-customer-early-access-banner[b-d5z6twyzia]::after {
        content: "";
        position: absolute;
        right: -58px;
        bottom: -78px;
        width: 170px;
        height: 170px;
        border-radius: 999px;
        background: color-mix(in srgb, var(--mud-palette-secondary) 10%, transparent);
        pointer-events: none;
    }

.bb-customer-early-access-icon[b-d5z6twyzia] {
    position: relative;
    z-index: 2;
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    color: #ffffff;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--mud-palette-primary), var(--mud-palette-secondary));
    box-shadow: 0 14px 28px color-mix(in srgb, var(--mud-palette-primary) 20%, transparent);
}

    .bb-customer-early-access-icon[b-d5z6twyzia]  .mud-icon-root {
        color: #ffffff !important;
        font-size: 1.28rem;
    }

.bb-customer-early-access-copy[b-d5z6twyzia] {
    position: relative;
    z-index: 2;
    min-width: 0;
    display: grid;
    gap: 0.2rem;
}

    .bb-customer-early-access-copy > span[b-d5z6twyzia] {
        color: var(--mud-palette-secondary);
        font-size: 0.66rem;
        font-weight: 950;
        line-height: 1;
        letter-spacing: 0.085em;
        text-transform: uppercase;
    }

    .bb-customer-early-access-copy > strong[b-d5z6twyzia] {
        color: var(--mud-palette-primary);
        font-size: 0.94rem;
        font-weight: 950;
        line-height: 1.2;
    }

    .bb-customer-early-access-copy > p[b-d5z6twyzia] {
        margin: 0;
        color: var(--mud-palette-text-secondary);
        font-size: 0.76rem;
        font-weight: 650;
        line-height: 1.5;
    }

.bb-customer-early-access-status[b-d5z6twyzia] {
    position: relative;
    z-index: 2;
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
}

    .bb-customer-early-access-status > div[b-d5z6twyzia] {
        min-width: 0;
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        gap: 0.45rem;
        align-items: center;
        min-height: 42px;
        padding: 0.58rem 0.66rem;
        color: var(--mud-palette-text-primary);
        font-size: 0.72rem;
        font-weight: 850;
        line-height: 1.3;
        border-radius: 13px;
        background: color-mix(in srgb, var(--mud-palette-surface) 88%, transparent);
        border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 10%, var(--mud-palette-divider));
    }

    .bb-customer-early-access-status .is-open[b-d5z6twyzia] {
        border-color: color-mix(in srgb, var(--mud-palette-success) 25%, var(--mud-palette-divider));
        background: color-mix(in srgb, var(--mud-palette-success) 8%, var(--mud-palette-surface));
    }

    .bb-customer-early-access-status .is-next[b-d5z6twyzia] {
        border-color: color-mix(in srgb, var(--mud-palette-secondary) 28%, var(--mud-palette-divider));
        background: color-mix(in srgb, var(--mud-palette-secondary) 10%, var(--mud-palette-surface));
    }

    .bb-customer-early-access-status .is-open[b-d5z6twyzia]  .mud-icon-root {
        color: var(--mud-palette-success);
    }

    .bb-customer-early-access-status .is-next[b-d5z6twyzia]  .mud-icon-root {
        color: var(--mud-palette-secondary);
    }

.bb-customer-booking-next-note[b-d5z6twyzia] {
    border-color: color-mix(in srgb, var(--mud-palette-secondary) 30%, #E5DCCE);
    background: color-mix(in srgb, var(--mud-palette-secondary) 9%, #FFFDF8);
}

    .bb-customer-booking-next-note > .mud-icon-root[b-d5z6twyzia] {
        color: var(--mud-palette-secondary);
    }

@media (max-width: 600px) {
    .bb-customer-early-access-banner[b-d5z6twyzia],
    .bb-customer-early-access-status[b-d5z6twyzia] {
        grid-template-columns: 1fr;
    }

    .bb-customer-early-access-status[b-d5z6twyzia] {
        grid-column: auto;
    }

    .bb-customer-early-access-icon[b-d5z6twyzia] {
        width: 44px;
        height: 44px;
        border-radius: 14px;
    }
}

/* Persisted communication language selected during registration. */
.bb-registration-language-card[b-d5z6twyzia] {
    display: grid;
    gap: 0.85rem;
    padding: 0.95rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-secondary) 25%, var(--mud-palette-divider));
    border-radius: 18px;
    background: radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--mud-palette-secondary) 12%, transparent), transparent 32%), color-mix(in srgb, var(--mud-palette-secondary) 6%, var(--mud-palette-surface));
}

.bb-registration-language-heading[b-d5z6twyzia] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.72rem;
    align-items: center;
}

.bb-registration-language-icon[b-d5z6twyzia] {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    color: var(--mud-palette-primary);
    border-radius: 14px;
    background: color-mix(in srgb, var(--mud-palette-secondary) 20%, var(--mud-palette-surface));
}

.bb-registration-language-heading > div[b-d5z6twyzia] {
    min-width: 0;
    display: grid;
    gap: 0.14rem;
}

.bb-registration-language-heading strong[b-d5z6twyzia] {
    color: var(--mud-palette-primary);
    font-size: 0.86rem;
    font-weight: 950;
}

.bb-registration-language-heading p[b-d5z6twyzia],
.bb-registration-language-card > small[b-d5z6twyzia] {
    margin: 0;
    color: var(--mud-palette-text-secondary);
    font-size: 0.73rem;
    font-weight: 650;
    line-height: 1.45;
}

[b-d5z6twyzia] .bb-registration-language-select .mud-input-outlined-border {
    border-radius: 14px;
}


.bb-registration-consent-card[b-d5z6twyzia] {
    display: grid;
    gap: 12px;
    margin: 8px 0 4px;
    padding: 18px;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 14%, var(--mud-palette-lines-default));
    border-radius: 16px;
    background: linear-gradient(145deg, color-mix(in srgb, var(--mud-palette-primary) 4%, var(--mud-palette-surface)), var(--mud-palette-surface));
}

.bb-registration-consent-heading[b-d5z6twyzia] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid color-mix(in srgb, var(--mud-palette-lines-default) 78%, transparent);
}

    .bb-registration-consent-heading .mud-icon-root[b-d5z6twyzia] {
        color: var(--mud-palette-primary);
    }

    .bb-registration-consent-heading div[b-d5z6twyzia] {
        display: grid;
        gap: 3px;
    }

    .bb-registration-consent-heading strong[b-d5z6twyzia] {
        color: var(--mud-palette-text-primary);
        font-weight: 900;
    }

    .bb-registration-consent-heading span[b-d5z6twyzia] {
        color: var(--mud-palette-text-secondary);
        font-size: .83rem;
        line-height: 1.45;
    }

.bb-registration-consent-item[b-d5z6twyzia] {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    align-items: start;
    gap: 8px;
}

    .bb-registration-consent-item > div:last-child[b-d5z6twyzia] {
        min-width: 0;
        padding-top: 8px;
        color: var(--mud-palette-text-primary);
        font-size: .89rem;
        line-height: 1.5;
    }

    .bb-registration-consent-item small[b-d5z6twyzia] {
        display: block;
        margin-top: 3px;
        color: var(--mud-palette-text-secondary);
    }

    .bb-registration-consent-item[b-d5z6twyzia]  .mud-link {
        font-weight: 850;
    }

.bb-consent-required[b-d5z6twyzia],
.bb-consent-optional[b-d5z6twyzia] {
    display: inline-flex;
    margin-left: 6px;
    padding: 2px 7px;
    border-radius: 999px;
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.bb-consent-required[b-d5z6twyzia] {
    color: var(--mud-palette-error-darken);
    background: color-mix(in srgb, var(--mud-palette-error) 10%, transparent);
}

.bb-consent-optional[b-d5z6twyzia] {
    color: var(--mud-palette-primary);
    background: color-mix(in srgb, var(--mud-palette-primary) 9%, transparent);
}

.bb-consent-validation[b-d5z6twyzia] {
    display: block;
    margin: -8px 0 0 40px;
    color: var(--mud-palette-error);
    font-size: .78rem;
    font-weight: 700;
}
/* /Components/Pages/Auth/RegisterSalonOwner.razor.rz.scp.css */
.bb-owner-register-loading[b-vistzudvgz] {
    min-height: calc(100vh - 160px);
    display: grid;
    place-items: center;
    align-content: center;
    gap: 1rem;
    color: var(--mud-palette-primary);
}

.bb-register-phone-field[b-vistzudvgz] {
    position: relative;
}

.bb-register-phone-prefix[b-vistzudvgz] {
    position: absolute;
    left: 13px;
    top: 31px;
    z-index: 4;
    min-width: 78px;
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 0.32rem 0.52rem;
    color: var(--mud-palette-text-primary);
    border: 1px solid #E5DCCE;
    border-radius: 10px;
    background: #F7F3EA;
    box-shadow: 0 3px 8px rgba(21, 50, 75, 0.05);
    transform: translateY(-50%);
    pointer-events: none;
}

    .bb-register-phone-prefix img[b-vistzudvgz] {
        flex: 0 0 16px;
        width: 16px;
        min-width: 16px;
        max-width: 16px;
        height: 16px;
        min-height: 16px;
        max-height: 16px;
        display: block;
        object-fit: cover;
        object-position: center;
        border-radius: 2px;
        box-shadow: none;
        filter: none;
        transform: none;
        image-rendering: pixelated;
    }

    .bb-register-phone-prefix strong[b-vistzudvgz] {
        color: var(--mud-palette-text-primary);
        font-size: 0.76rem;
        font-weight: 900;
        line-height: 1;
        white-space: nowrap;
    }

[b-vistzudvgz] .bb-register-phone-input .mud-input-adornment-start {
    visibility: hidden;
    width: 94px;
    min-width: 94px;
}

[b-vistzudvgz] .bb-register-phone-input input {
    padding-left: 0.15rem;
}


.bb-register-phone-message[b-vistzudvgz] {
    display: flex;
    align-items: flex-start;
    gap: 0.42rem;
    margin-top: 0.38rem;
    padding: 0 0.2rem;
    font-size: 0.76rem;
    font-weight: 700;
    line-height: 1.45;
}

    .bb-register-phone-message[b-vistzudvgz]  .mud-icon-root {
        flex: 0 0 auto;
        margin-top: 0.05rem;
    }

.bb-register-phone-hint[b-vistzudvgz] {
    color: var(--mud-palette-text-secondary);
}

.bb-register-phone-error[b-vistzudvgz] {
    color: var(--mud-palette-error);
}

.bb-password-checklist[b-vistzudvgz] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
}

    .bb-password-checklist div[b-vistzudvgz] {
        display: flex;
        align-items: center;
        gap: 0.4rem;
        padding: 0.55rem 0.65rem;
        color: var(--mud-palette-text-secondary);
        font-size: 0.75rem;
        font-weight: 750;
        border: 1px solid #E5DCCE;
        border-radius: 13px;
        background: #F7F3EA;
    }

    .bb-password-checklist .is-complete[b-vistzudvgz] {
        color: var(--mud-palette-success);
        border-color: color-mix( in srgb, var(--mud-palette-success) 25%, #E5DCCE);
        background: color-mix( in srgb, var(--mud-palette-success) 7%, #FFFDF8);
    }

.bb-owner-launch-note[b-vistzudvgz] {
    display: grid;
    grid-template-columns: 36px 1fr;
    gap: 0.65rem;
    align-items: center;
    padding: 0.72rem;
    border: 1px solid color-mix( in srgb, var(--mud-palette-secondary) 24%, #E5DCCE);
    border-radius: 15px;
    background: #F7F3EA;
}

    .bb-owner-launch-note > .mud-icon-root[b-vistzudvgz] {
        color: var(--mud-palette-secondary);
    }

    .bb-owner-launch-note div[b-vistzudvgz] {
        display: grid;
        gap: 0.12rem;
    }

    .bb-owner-launch-note strong[b-vistzudvgz] {
        color: var(--mud-palette-primary);
        font-size: 0.8rem;
    }

    .bb-owner-launch-note span[b-vistzudvgz],
    .bb-register-legal[b-vistzudvgz] {
        color: var(--mud-palette-text-secondary);
        font-size: 0.73rem;
        line-height: 1.45;
    }

.bb-register-legal[b-vistzudvgz] {
    text-align: center;
}

@media (max-width: 600px) {
    .bb-password-checklist[b-vistzudvgz] {
        grid-template-columns: 1fr;
    }

    .bb-register-phone-prefix[b-vistzudvgz] {
        left: 11px;
        min-width: 76px;
    }

    [b-vistzudvgz] .bb-register-phone-input .mud-input-adornment-start {
        width: 91px;
        min-width: 91px;
    }
}


.bb-auth-role-switch[b-vistzudvgz] {
    display: grid;
    gap: 0.25rem;
    padding: 0.8rem;
    text-align: center;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 11%, var(--mud-palette-divider));
    border-radius: 14px;
    background: color-mix(in srgb, var(--mud-palette-primary) 4%, var(--mud-palette-surface));
}

    .bb-auth-role-switch > span[b-vistzudvgz] {
        color: var(--mud-palette-text-secondary);
        font-size: 0.75rem;
        font-weight: 750;
    }

    .bb-auth-role-switch[b-vistzudvgz]  a {
        font-size: 0.84rem;
        font-weight: 900;
    }

/* Persisted communication language selected during registration. */
.bb-registration-language-card[b-vistzudvgz] {
    display: grid;
    gap: 0.85rem;
    padding: 0.95rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-secondary) 25%, var(--mud-palette-divider));
    border-radius: 18px;
    background: radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--mud-palette-secondary) 12%, transparent), transparent 32%), color-mix(in srgb, var(--mud-palette-secondary) 6%, var(--mud-palette-surface));
}

.bb-registration-language-heading[b-vistzudvgz] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.72rem;
    align-items: center;
}

.bb-registration-language-icon[b-vistzudvgz] {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    color: var(--mud-palette-primary);
    border-radius: 14px;
    background: color-mix(in srgb, var(--mud-palette-secondary) 20%, var(--mud-palette-surface));
}

.bb-registration-language-heading > div[b-vistzudvgz] {
    min-width: 0;
    display: grid;
    gap: 0.14rem;
}

.bb-registration-language-heading strong[b-vistzudvgz] {
    color: var(--mud-palette-primary);
    font-size: 0.86rem;
    font-weight: 950;
}

.bb-registration-language-heading p[b-vistzudvgz],
.bb-registration-language-card > small[b-vistzudvgz] {
    margin: 0;
    color: var(--mud-palette-text-secondary);
    font-size: 0.73rem;
    font-weight: 650;
    line-height: 1.45;
}

[b-vistzudvgz] .bb-registration-language-select .mud-input-outlined-border {
    border-radius: 14px;
}


.bb-registration-consent-card[b-vistzudvgz] {
    display: grid;
    gap: 12px;
    margin: 8px 0 4px;
    padding: 18px;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 14%, var(--mud-palette-lines-default));
    border-radius: 16px;
    background: linear-gradient(145deg, color-mix(in srgb, var(--mud-palette-primary) 4%, var(--mud-palette-surface)), var(--mud-palette-surface));
}

.bb-registration-consent-heading[b-vistzudvgz] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid color-mix(in srgb, var(--mud-palette-lines-default) 78%, transparent);
}

    .bb-registration-consent-heading .mud-icon-root[b-vistzudvgz] {
        color: var(--mud-palette-primary);
    }

    .bb-registration-consent-heading div[b-vistzudvgz] {
        display: grid;
        gap: 3px;
    }

    .bb-registration-consent-heading strong[b-vistzudvgz] {
        color: var(--mud-palette-text-primary);
        font-weight: 900;
    }

    .bb-registration-consent-heading span[b-vistzudvgz] {
        color: var(--mud-palette-text-secondary);
        font-size: .83rem;
        line-height: 1.45;
    }

.bb-registration-consent-item[b-vistzudvgz] {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    align-items: start;
    gap: 8px;
}

    .bb-registration-consent-item > div:last-child[b-vistzudvgz] {
        min-width: 0;
        padding-top: 8px;
        color: var(--mud-palette-text-primary);
        font-size: .89rem;
        line-height: 1.5;
    }

    .bb-registration-consent-item small[b-vistzudvgz] {
        display: block;
        margin-top: 3px;
        color: var(--mud-palette-text-secondary);
    }

    .bb-registration-consent-item[b-vistzudvgz]  .mud-link {
        font-weight: 850;
    }

.bb-consent-required[b-vistzudvgz],
.bb-consent-optional[b-vistzudvgz] {
    display: inline-flex;
    margin-left: 6px;
    padding: 2px 7px;
    border-radius: 999px;
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.bb-consent-required[b-vistzudvgz] {
    color: var(--mud-palette-error-darken);
    background: color-mix(in srgb, var(--mud-palette-error) 10%, transparent);
}

.bb-consent-optional[b-vistzudvgz] {
    color: var(--mud-palette-primary);
    background: color-mix(in srgb, var(--mud-palette-primary) 9%, transparent);
}

.bb-consent-validation[b-vistzudvgz] {
    display: block;
    margin: -8px 0 0 40px;
    color: var(--mud-palette-error);
    font-size: .78rem;
    font-weight: 700;
}
/* /Components/Pages/Auth/ResetPassword.razor.rz.scp.css */
.auth-recovery-page[b-jleoib6onk] {
    min-height: calc(100vh - 150px);
    display: grid;
    place-items: center;
    padding: 3rem 1rem 4rem;
    background: radial-gradient( circle at 12% 12%, color-mix(in srgb, #B89B5E 15%, transparent), transparent 28%), radial-gradient( circle at 88% 84%, color-mix(in srgb, var(--mud-palette-primary) 12%, transparent), transparent 30%), var(--mud-palette-background);
}

.auth-recovery-card[b-jleoib6onk] {
    width: min(100%, 520px);
    display: grid;
    gap: 1.1rem;
    padding: 2.35rem;
    text-align: center;
    border: 1px solid color-mix( in srgb, var(--mud-palette-primary) 12%, var(--mud-palette-divider));
    border-radius: 30px;
    background: var(--mud-palette-surface);
    box-shadow: 0 28px 80px color-mix( in srgb, var(--mud-palette-primary) 14%, transparent);
}

.auth-recovery-brand[b-jleoib6onk] {
    display: inline-flex;
    justify-self: center;
    margin-bottom: .25rem;
}

    .auth-recovery-brand img[b-jleoib6onk] {
        display: block;
        width: 154px;
        height: auto;
    }

.auth-recovery-icon[b-jleoib6onk] {
    width: 78px;
    height: 78px;
    display: grid;
    place-items: center;
    justify-self: center;
    color: #15324B;
    border-radius: 25px;
    background: #EFE2C6;
}

.auth-recovery-icon-success[b-jleoib6onk] {
    color: #2F7D72;
    background: #DDEFEA;
}

.auth-recovery-icon-error[b-jleoib6onk] {
    color: var(--mud-palette-error);
    background: color-mix( in srgb, var(--mud-palette-error) 10%, var(--mud-palette-surface));
}

.auth-recovery-page[b-jleoib6onk]  .auth-recovery-title {
    color: var(--mud-palette-primary);
    font-weight: 950;
    letter-spacing: -.035em;
}

.auth-recovery-page[b-jleoib6onk]  .auth-recovery-copy {
    max-width: 420px;
    justify-self: center;
    color: var(--mud-palette-text-secondary);
    line-height: 1.7;
}

.auth-recovery-page[b-jleoib6onk]  form {
    width: 100%;
}

.auth-recovery-page[b-jleoib6onk]  .auth-recovery-primary {
    min-height: 52px;
    border-radius: 16px;
    font-weight: 900;
}

.auth-recovery-page[b-jleoib6onk]  .auth-recovery-security {
    color: var(--mud-palette-text-secondary);
    line-height: 1.55;
}

@media (max-width: 600px) {
    .auth-recovery-page[b-jleoib6onk] {
        padding: 1.25rem .75rem 2.5rem;
    }

    .auth-recovery-card[b-jleoib6onk] {
        padding: 1.45rem;
        border-radius: 24px;
    }
}

.auth-recovery-password-checklist[b-jleoib6onk] {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: .55rem;
}

    .auth-recovery-password-checklist div[b-jleoib6onk] {
        display: flex;
        align-items: center;
        gap: .4rem;
        padding: .55rem .65rem;
        color: var(--mud-palette-text-secondary);
        font-size: .75rem;
        font-weight: 750;
        border: 1px solid #E5DCCE;
        border-radius: 13px;
        background: #F7F3EA;
    }

    .auth-recovery-password-checklist .is-complete[b-jleoib6onk] {
        color: var(--mud-palette-success);
        border-color: color-mix(in srgb,var(--mud-palette-success) 25%,#E5DCCE);
        background: color-mix(in srgb,var(--mud-palette-success) 7%,#FFFDF8);
    }

@media(max-width:520px) {
    .auth-recovery-password-checklist[b-jleoib6onk] {
        grid-template-columns: 1fr
    }
}
/* /Components/Pages/Auth/VerifyYourEmail.razor.rz.scp.css */
.verify-email-copy[b-7j6sc6gy2t],
.verify-email-security[b-7j6sc6gy2t] {
    color: var(--mud-palette-text-secondary);
    line-height: 1.65;
}

.verify-email-expiry-note[b-7j6sc6gy2t] {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
    padding: 0.85rem;
    color: var(--mud-palette-text-secondary);
    border: 1px solid #E5DCCE;
    border-radius: 15px;
    background: #F7F3EA;
    font-size: 0.82rem;
    line-height: 1.5;
}

    .verify-email-expiry-note[b-7j6sc6gy2t]  .mud-icon-root {
        flex: 0 0 auto;
        color: var(--mud-palette-secondary);
        margin-top: 0.05rem;
    }
/* /Components/Pages/Errors/ErrorPage.razor.rz.scp.css */
.bb-error-page[b-98z8fxcd3m] {
    --bb-error-border: color-mix( in srgb, var(--mud-palette-primary) 12%, var(--mud-palette-divider));
    --bb-error-primary-soft: color-mix( in srgb, var(--mud-palette-primary) 7%, var(--mud-palette-surface));
    --bb-error-secondary-soft: color-mix( in srgb, var(--mud-palette-secondary) 10%, var(--mud-palette-surface));
    width: 100%;
    min-height: calc(100vh - 150px);
    display: grid;
    align-items: center;
    padding: clamp(1.2rem, 4vw, 3.5rem) 0;
    color: var(--mud-palette-text-primary);
    font-family: inherit;
    background: radial-gradient( circle at 8% 12%, color-mix( in srgb, var(--mud-palette-secondary) 10%, transparent), transparent 30%), radial-gradient( circle at 92% 88%, color-mix( in srgb, var(--mud-palette-primary) 9%, transparent), transparent 32%), var(--mud-palette-background);
}

    .bb-error-page[b-98z8fxcd3m],
    .bb-error-page *[b-98z8fxcd3m],
    .bb-error-page *[b-98z8fxcd3m]::before,
    .bb-error-page *[b-98z8fxcd3m]::after {
        box-sizing: border-box;
    }

        .bb-error-page[b-98z8fxcd3m]  .mud-typography,
        .bb-error-page[b-98z8fxcd3m]  .mud-button-root,
        .bb-error-page[b-98z8fxcd3m]  .mud-button-label,
        .bb-error-page[b-98z8fxcd3m]  .mud-input,
        .bb-error-page[b-98z8fxcd3m]  .mud-input-control,
        .bb-error-page[b-98z8fxcd3m]  .mud-input-label,
        .bb-error-page[b-98z8fxcd3m]  .mud-input-helper-text,
        .bb-error-page[b-98z8fxcd3m]  input,
        .bb-error-page[b-98z8fxcd3m]  textarea,
        .bb-error-page button[b-98z8fxcd3m],
        .bb-error-page a[b-98z8fxcd3m],
        .bb-error-page summary[b-98z8fxcd3m] {
            font-family: inherit !important;
        }

/* ========================================================================== */
/* SHELL                                                                      */
/* ========================================================================== */

.bb-error-shell[b-98z8fxcd3m] {
    width: min(1120px, 100%);
    min-height: 650px;
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1.1fr);
    margin: 0 auto;
    overflow: hidden;
    border: 1px solid var(--bb-error-border);
    border-radius: 34px;
    background: var(--mud-palette-surface);
    box-shadow: 0 34px 90px color-mix( in srgb, var(--mud-palette-primary) 15%, transparent);
}

/* ========================================================================== */
/* LEFT AUTH-STYLE STORY PANEL                                                */
/* ========================================================================== */

.bb-error-visual[b-98z8fxcd3m] {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
    padding: clamp(2rem, 4vw, 3.4rem);
    color: #ffffff;
    background: radial-gradient( circle at 12% 10%, rgba(184, 155, 94, 0.34), transparent 29%), radial-gradient( circle at 92% 86%, rgba(184, 155, 94, 0.22), transparent 28%), linear-gradient( 145deg, #10283c, var(--mud-palette-primary));
}

    .bb-error-visual[b-98z8fxcd3m]::after {
        content: "";
        position: absolute;
        inset: 0;
        z-index: -1;
        pointer-events: none;
        background: repeating-linear-gradient( 135deg, rgba(255, 255, 255, 0.035) 0 1px, transparent 1px 22px);
    }

.bb-error-brand[b-98z8fxcd3m] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    color: #ffffff;
    text-decoration: none;
    border-radius: 12px;
}

    .bb-error-brand:hover[b-98z8fxcd3m],
    .bb-error-brand:focus-visible[b-98z8fxcd3m] {
        color: #ffffff;
        text-decoration: none;
    }

    .bb-error-brand img[b-98z8fxcd3m] {
        display: block;
        width: auto;
        max-width: 180px;
        height: 42px;
        object-fit: contain;
        border: 0;
        background: transparent;
        box-shadow: none;
    }

.bb-error-status-pill[b-98z8fxcd3m] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    margin-top: clamp(1.2rem, 3vw, 2.4rem);
    padding: 0.48rem 0.72rem;
    color: #ffffff;
    font-size: 0.7rem;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.09);
    backdrop-filter: blur(12px);
}

.bb-error-status-dot[b-98z8fxcd3m] {
    width: 8px;
    height: 8px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: var(--mud-palette-secondary);
    box-shadow: 0 0 0 5px color-mix( in srgb, var(--mud-palette-secondary) 18%, transparent);
}

.bb-error-code[b-98z8fxcd3m] {
    margin-top: -0.1rem;
    color: rgba(255, 255, 255, 0.98);
    font-size: clamp(4.5rem, 10vw, 7.4rem);
    font-weight: 950;
    line-height: 0.92;
    letter-spacing: -0.075em;
    text-shadow: 0 20px 44px rgba(0, 0, 0, 0.18);
}

/* ========================================================================== */
/* ORBIT ANIMATION — PRESERVED                                                */
/* ========================================================================== */

.bb-error-illustration[b-98z8fxcd3m] {
    position: relative;
    min-height: 215px;
    display: grid;
    place-items: center;
    margin: auto 0;
}

.bb-error-orbit[b-98z8fxcd3m] {
    position: absolute;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 50%;
}

.bb-error-orbit-one[b-98z8fxcd3m] {
    width: 188px;
    height: 188px;
    animation: bb-error-orbit-rotation-b-98z8fxcd3m 18s linear infinite;
}

.bb-error-orbit-two[b-98z8fxcd3m] {
    width: 138px;
    height: 138px;
    border-style: dashed;
    opacity: 0.75;
    animation: bb-error-orbit-rotation-b-98z8fxcd3m 13s linear infinite reverse;
}

    .bb-error-orbit-one[b-98z8fxcd3m]::before,
    .bb-error-orbit-two[b-98z8fxcd3m]::before {
        content: "";
        position: absolute;
        top: 50%;
        left: -5px;
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background: var(--mud-palette-secondary);
        box-shadow: 0 0 18px color-mix( in srgb, var(--mud-palette-secondary) 70%, transparent);
    }

.bb-error-icon-shell[b-98z8fxcd3m] {
    position: relative;
    z-index: 2;
    width: 92px;
    height: 92px;
    display: grid;
    place-items: center;
    color: var(--mud-palette-primary);
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 29px;
    background: linear-gradient( 145deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.07));
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(16px);
    transform: rotate(-4deg);
}

    .bb-error-icon-shell[b-98z8fxcd3m]  .mud-icon-root {
        color: var(--mud-palette-secondary) !important;
        font-size: 3rem;
    }

.bb-error-spark[b-98z8fxcd3m] {
    position: absolute;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.78);
    box-shadow: 0 0 13px rgba(255, 255, 255, 0.48);
}

.bb-error-spark-one[b-98z8fxcd3m] {
    top: 18%;
    left: 23%;
}

.bb-error-spark-two[b-98z8fxcd3m] {
    top: 32%;
    right: 20%;
    width: 5px;
    height: 5px;
}

.bb-error-spark-three[b-98z8fxcd3m] {
    right: 28%;
    bottom: 18%;
    width: 9px;
    height: 9px;
    background: var(--mud-palette-secondary);
}

.bb-error-visual-note[b-98z8fxcd3m] {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
    margin-top: auto;
    padding: 0.78rem 0.82rem;
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.72rem;
    font-weight: 600;
    line-height: 1.5;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.07);
}

    .bb-error-visual-note[b-98z8fxcd3m]  .mud-icon-root {
        flex: 0 0 auto;
        margin-top: 0.05rem;
        color: var(--mud-palette-secondary) !important;
    }

/* ========================================================================== */
/* RIGHT AUTH-STYLE CONTENT PANEL                                             */
/* ========================================================================== */

.bb-error-content[b-98z8fxcd3m] {
    min-width: 0;
    display: grid;
    align-content: center;
    gap: 1.15rem;
    padding: clamp(1.5rem, 4vw, 3.4rem);
    background: radial-gradient( circle at 92% 8%, color-mix( in srgb, var(--mud-palette-secondary) 10%, transparent), transparent 26%), var(--mud-palette-surface);
}

.bb-error-heading[b-98z8fxcd3m] {
    display: grid;
    gap: 0.35rem;
}

.bb-error-eyebrow[b-98z8fxcd3m] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    color: var(--mud-palette-secondary);
    font-size: 0.7rem;
    font-weight: 950;
    line-height: 1;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.bb-error-content[b-98z8fxcd3m]  .bb-error-title {
    max-width: 720px;
    margin: 0;
    color: var(--mud-palette-primary) !important;
    font-size: clamp( 1.85rem, 4vw, 2.75rem) !important;
    font-weight: 950 !important;
    line-height: 1.08 !important;
    letter-spacing: -0.04em !important;
}

.bb-error-content[b-98z8fxcd3m]  .bb-error-description {
    max-width: 720px;
    color: var(--mud-palette-text-secondary) !important;
    font-size: 0.94rem !important;
    font-weight: 500 !important;
    line-height: 1.6 !important;
}

/* ========================================================================== */
/* PRIMARY ACTIONS                                                           */
/* ========================================================================== */

.bb-error-actions[b-98z8fxcd3m] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.72rem;
    margin-top: 0.15rem;
}

    .bb-error-actions[b-98z8fxcd3m]  .mud-button-root {
        min-height: 50px;
        padding-inline: 1.05rem;
        font-size: 0.8rem;
        font-weight: 950;
        line-height: 1;
        letter-spacing: 0;
        text-transform: none;
        border-radius: 14px !important;
        transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease, border-color 160ms ease;
    }

        .bb-error-actions[b-98z8fxcd3m]  .mud-button-root:hover {
            transform: translateY(-2px);
        }

    .bb-error-actions[b-98z8fxcd3m]  .bb-error-primary-action {
        box-shadow: 0 16px 34px color-mix( in srgb, var(--mud-palette-primary) 20%, transparent);
    }

        .bb-error-actions[b-98z8fxcd3m]  .bb-error-primary-action:hover {
            box-shadow: 0 19px 38px color-mix( in srgb, var(--mud-palette-primary) 27%, transparent);
        }

    .bb-error-actions[b-98z8fxcd3m]  .bb-error-secondary-action {
        background: var(--mud-palette-surface);
    }

    .bb-error-actions[b-98z8fxcd3m]  .mud-button-icon-start,
    .bb-error-actions[b-98z8fxcd3m]  .mud-button-start-icon {
        margin-inline-start: 0;
        margin-inline-end: 0.46rem;
    }

/* ========================================================================== */
/* SUPPORT CARD                                                              */
/* ========================================================================== */

.bb-error-support-card[b-98z8fxcd3m] {
    display: grid;
    gap: 1rem;
    padding: clamp(1rem, 2vw, 1.25rem);
    border: 1px solid color-mix( in srgb, var(--mud-palette-primary) 11%, var(--mud-palette-divider));
    border-radius: 18px;
    background: linear-gradient( 135deg, color-mix( in srgb, var(--mud-palette-primary) 4%, var(--mud-palette-surface)), color-mix( in srgb, var(--mud-palette-secondary) 5%, var(--mud-palette-surface)));
    box-shadow: 0 14px 30px color-mix( in srgb, var(--mud-palette-primary) 8%, transparent);
}

.bb-error-support-header[b-98z8fxcd3m] {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 0.8rem;
    align-items: center;
}

.bb-error-support-icon[b-98z8fxcd3m] {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    color: var(--mud-palette-primary);
    border-radius: 14px;
    background: #efe2c6;
    box-shadow: 0 12px 26px color-mix( in srgb, var(--mud-palette-secondary) 16%, transparent);
}

    .bb-error-support-icon[b-98z8fxcd3m]  .mud-icon-root {
        color: var(--mud-palette-primary) !important;
        font-size: 1.35rem;
    }

.bb-error-support-header > div[b-98z8fxcd3m] {
    min-width: 0;
}

.bb-error-support-header strong[b-98z8fxcd3m] {
    display: block;
    color: var(--mud-palette-primary);
    font-size: 0.86rem;
    font-weight: 950;
    line-height: 1.3;
}

.bb-error-support-header p[b-98z8fxcd3m] {
    margin: 0.18rem 0 0;
    color: var(--mud-palette-text-secondary);
    font-size: 0.74rem;
    font-weight: 600;
    line-height: 1.5;
}

.bb-error-explanation[b-98z8fxcd3m] {
    width: 100%;
}

.bb-error-support-card[b-98z8fxcd3m]  .bb-error-explanation {
    width: 100%;
}

    .bb-error-support-card[b-98z8fxcd3m]  .bb-error-explanation .mud-input-control {
        width: 100%;
    }

    .bb-error-support-card[b-98z8fxcd3m]  .bb-error-explanation .mud-input-outlined-border {
        border-radius: 14px;
        border-color: color-mix( in srgb, var(--mud-palette-primary) 13%, var(--mud-palette-divider));
    }

    .bb-error-support-card[b-98z8fxcd3m]  .bb-error-explanation:hover .mud-input-outlined-border {
        border-color: color-mix( in srgb, var(--mud-palette-primary) 30%, var(--mud-palette-divider));
    }

    .bb-error-support-card[b-98z8fxcd3m]  .bb-error-explanation .mud-input-root:focus-within
    .mud-input-outlined-border {
        border-color: var(--mud-palette-primary);
    }

    .bb-error-support-card[b-98z8fxcd3m]  .bb-error-explanation textarea {
        min-height: 102px;
        color: var(--mud-palette-text-primary);
        font-size: 0.82rem;
        font-weight: 500;
        line-height: 1.55;
    }

    .bb-error-support-card[b-98z8fxcd3m]  .bb-error-explanation .mud-input-label {
        color: var(--mud-palette-text-secondary);
        font-size: 0.79rem;
        font-weight: 750;
    }

    .bb-error-support-card[b-98z8fxcd3m]  .bb-error-explanation .mud-input-helper-text {
        color: var(--mud-palette-text-secondary);
        font-size: 0.67rem;
        font-weight: 700;
    }

.bb-error-privacy-note[b-98z8fxcd3m] {
    display: flex;
    align-items: flex-start;
    gap: 0.42rem;
    color: var(--mud-palette-text-secondary);
    font-size: 0.7rem;
    font-weight: 600;
    line-height: 1.48;
}

    .bb-error-privacy-note[b-98z8fxcd3m]  .mud-icon-root {
        flex: 0 0 auto;
        margin-top: 0.03rem;
        color: var(--mud-palette-success) !important;
    }

.bb-error-support-action-row[b-98z8fxcd3m] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem;
}

    .bb-error-support-action-row[b-98z8fxcd3m]  .bb-error-support-button {
        min-height: 50px;
        padding-inline: 1rem;
        font-size: 0.8rem;
        font-weight: 950;
        line-height: 1;
        text-transform: none;
        border-radius: 14px !important;
        box-shadow: 0 16px 34px color-mix( in srgb, var(--mud-palette-secondary) 22%, transparent);
        transition: transform 160ms ease, box-shadow 160ms ease, filter 160ms ease;
    }

        .bb-error-support-action-row[b-98z8fxcd3m]  .bb-error-support-button:hover {
            transform: translateY(-2px);
            filter: brightness(1.03);
            box-shadow: 0 19px 38px color-mix( in srgb, var(--mud-palette-secondary) 30%, transparent);
        }

    .bb-error-support-action-row[b-98z8fxcd3m]  .mud-button-icon-start,
    .bb-error-support-action-row[b-98z8fxcd3m]  .mud-button-start-icon {
        margin-inline-start: 0;
        margin-inline-end: 0.46rem;
    }

.bb-error-support-email[b-98z8fxcd3m] {
    min-width: 0;
    color: var(--mud-palette-text-secondary);
    font-size: 0.72rem;
    font-weight: 750;
    overflow-wrap: anywhere;
}

/* ========================================================================== */
/* TECHNICAL DETAILS                                                         */
/* ========================================================================== */

.bb-error-technical-details[b-98z8fxcd3m] {
    border: 1px solid color-mix( in srgb, var(--mud-palette-primary) 11%, var(--mud-palette-divider));
    border-radius: 15px;
    background: color-mix( in srgb, var(--mud-palette-primary) 4%, var(--mud-palette-surface));
}

    .bb-error-technical-details summary[b-98z8fxcd3m] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.85rem 1rem;
        color: var(--mud-palette-primary);
        font-size: 0.76rem;
        font-weight: 900;
        list-style: none;
        cursor: pointer;
        user-select: none;
    }

        .bb-error-technical-details summary[b-98z8fxcd3m]::-webkit-details-marker {
            display: none;
        }

        .bb-error-technical-details summary[b-98z8fxcd3m]::after {
            content: "+";
            margin-left: auto;
            color: var(--mud-palette-secondary);
            font-size: 1.1rem;
            font-weight: 900;
            line-height: 1;
            transition: transform 160ms ease;
        }

    .bb-error-technical-details[open] summary[b-98z8fxcd3m]::after {
        transform: rotate(45deg);
    }

    .bb-error-technical-details summary[b-98z8fxcd3m]  .mud-icon-root {
        color: var(--mud-palette-secondary) !important;
    }

    .bb-error-technical-details dl[b-98z8fxcd3m] {
        display: grid;
        gap: 0;
        margin: 0;
        padding: 0 1rem 0.9rem;
    }

        .bb-error-technical-details dl > div[b-98z8fxcd3m] {
            min-width: 0;
            display: grid;
            grid-template-columns: minmax(120px, 0.42fr) minmax(0, 1fr);
            gap: 0.8rem;
            padding: 0.62rem 0;
            border-top: 1px solid color-mix( in srgb, var(--mud-palette-primary) 9%, var(--mud-palette-divider));
        }

    .bb-error-technical-details dt[b-98z8fxcd3m] {
        color: var(--mud-palette-text-secondary);
        font-size: 0.69rem;
        font-weight: 800;
        line-height: 1.45;
    }

    .bb-error-technical-details dd[b-98z8fxcd3m] {
        min-width: 0;
        margin: 0;
        color: var(--mud-palette-text-primary);
        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
        font-size: 0.68rem;
        font-weight: 650;
        line-height: 1.52;
        overflow-wrap: anywhere;
    }

    /* ========================================================================== */
    /* ACCESSIBILITY                                                              */
    /* ========================================================================== */

    .bb-error-brand:focus-visible[b-98z8fxcd3m],
    .bb-error-technical-details summary:focus-visible[b-98z8fxcd3m] {
        outline: 3px solid color-mix( in srgb, var(--mud-palette-secondary) 42%, transparent);
        outline-offset: 4px;
    }

.bb-error-actions[b-98z8fxcd3m]  .mud-button-root:focus-visible,
.bb-error-support-action-row[b-98z8fxcd3m]  .mud-button-root:focus-visible {
    outline: 3px solid color-mix( in srgb, var(--mud-palette-secondary) 35%, transparent);
    outline-offset: 3px;
}

/* ========================================================================== */
/* ANIMATION                                                                  */
/* ========================================================================== */

@keyframes bb-error-orbit-rotation-b-98z8fxcd3m {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .bb-error-orbit[b-98z8fxcd3m],
    .bb-error-actions[b-98z8fxcd3m]  .mud-button-root,
    .bb-error-support-action-row[b-98z8fxcd3m]  .mud-button-root,
    .bb-error-technical-details summary[b-98z8fxcd3m]::after {
        animation: none;
        transition: none;
    }
}

/* ========================================================================== */
/* TABLET                                                                     */
/* ========================================================================== */

@media (max-width: 900px) {
    .bb-error-shell[b-98z8fxcd3m] {
        grid-template-columns: 1fr;
    }

    .bb-error-visual[b-98z8fxcd3m] {
        min-height: 345px;
        padding: 1.5rem;
    }

    .bb-error-status-pill[b-98z8fxcd3m] {
        margin-top: 1rem;
    }

    .bb-error-code[b-98z8fxcd3m] {
        font-size: clamp(4rem, 17vw, 6.4rem);
    }

    .bb-error-illustration[b-98z8fxcd3m] {
        position: absolute;
        right: clamp(1.5rem, 6vw, 4rem);
        bottom: 2rem;
        width: 190px;
        min-height: 190px;
        opacity: 0.9;
    }

    .bb-error-visual-note[b-98z8fxcd3m] {
        max-width: calc(100% - 215px);
        margin-top: 1.2rem;
    }
}

/* ========================================================================== */
/* MOBILE                                                                     */
/* ========================================================================== */

@media (max-width: 600px) {
    .bb-error-page[b-98z8fxcd3m] {
        min-height: 100vh;
        padding: 0.7rem 0 2rem;
    }

    .bb-error-shell[b-98z8fxcd3m] {
        min-height: 0;
        border-radius: 22px;
    }

    .bb-error-visual[b-98z8fxcd3m] {
        min-height: 290px;
        padding: 1.25rem;
    }

    .bb-error-brand img[b-98z8fxcd3m] {
        max-width: 150px;
        height: 36px;
    }

    .bb-error-status-pill[b-98z8fxcd3m] {
        margin-top: 0.8rem;
        font-size: 0.64rem;
    }

    .bb-error-code[b-98z8fxcd3m] {
        margin-top: -0.2rem;
        font-size: 4.25rem;
    }

    .bb-error-illustration[b-98z8fxcd3m] {
        right: 0.7rem;
        bottom: 2rem;
        width: 145px;
        min-height: 145px;
    }

    .bb-error-orbit-one[b-98z8fxcd3m] {
        width: 135px;
        height: 135px;
    }

    .bb-error-orbit-two[b-98z8fxcd3m] {
        width: 98px;
        height: 98px;
    }

    .bb-error-icon-shell[b-98z8fxcd3m] {
        width: 70px;
        height: 70px;
        border-radius: 22px;
    }

        .bb-error-icon-shell[b-98z8fxcd3m]  .mud-icon-root {
            font-size: 2.3rem;
        }

    .bb-error-visual-note[b-98z8fxcd3m] {
        max-width: calc(100% - 148px);
        padding: 0.65rem;
        font-size: 0.68rem;
    }

    .bb-error-content[b-98z8fxcd3m] {
        gap: 1rem;
        padding: 1.25rem;
    }

        .bb-error-content[b-98z8fxcd3m]  .bb-error-title {
            font-size: 1.85rem !important;
        }

        .bb-error-content[b-98z8fxcd3m]  .bb-error-description {
            font-size: 0.87rem !important;
            line-height: 1.6 !important;
        }

    .bb-error-actions[b-98z8fxcd3m] {
        display: grid;
        grid-template-columns: 1fr;
    }

        .bb-error-actions[b-98z8fxcd3m]  .mud-button-root {
            width: 100%;
        }

    .bb-error-support-card[b-98z8fxcd3m] {
        padding: 0.9rem;
        border-radius: 16px;
    }

    .bb-error-support-header[b-98z8fxcd3m] {
        grid-template-columns: 40px minmax(0, 1fr);
        gap: 0.65rem;
    }

    .bb-error-support-icon[b-98z8fxcd3m] {
        width: 40px;
        height: 40px;
        border-radius: 13px;
    }

    .bb-error-support-action-row[b-98z8fxcd3m] {
        display: grid;
        grid-template-columns: 1fr;
    }

        .bb-error-support-action-row[b-98z8fxcd3m]  .bb-error-support-button {
            width: 100%;
        }

    .bb-error-support-email[b-98z8fxcd3m] {
        text-align: center;
    }

    .bb-error-technical-details dl > div[b-98z8fxcd3m] {
        grid-template-columns: 1fr;
        gap: 0.18rem;
    }
}

/* ========================================================================== */
/* VERY SMALL DEVICES                                                         */
/* ========================================================================== */

@media (max-width: 390px) {
    .bb-error-visual[b-98z8fxcd3m] {
        min-height: 275px;
    }

    .bb-error-illustration[b-98z8fxcd3m] {
        right: 0.15rem;
        opacity: 0.76;
    }

    .bb-error-visual-note[b-98z8fxcd3m] {
        max-width: calc(100% - 124px);
        font-size: 0.64rem;
    }

    .bb-error-content[b-98z8fxcd3m] {
        padding-inline: 1rem;
    }
}

/* ========================================================================== */
/* LOCAL AND UTC ERROR TIME                                                   */
/* ========================================================================== */

.bb-error-time-value[b-98z8fxcd3m] {
    display: grid;
    gap: 0.16rem;
}

.bb-error-time-local-row[b-98z8fxcd3m] {
    min-width: 0;
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.28rem 0.45rem;
}

    .bb-error-time-local-row time[b-98z8fxcd3m] {
        min-width: 0;
        color: var(--mud-palette-text-primary);
        font: inherit;
        font-weight: 700;
        overflow-wrap: anywhere;
    }

.bb-error-time-zone[b-98z8fxcd3m] {
    color: var(--mud-palette-secondary);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
    font-size: 0.62rem;
    font-weight: 800;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.bb-error-time-utc[b-98z8fxcd3m] {
    color: var(--mud-palette-text-secondary);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
    font-size: 0.61rem;
    font-weight: 650;
    line-height: 1.45;
    opacity: 0.84;
    overflow-wrap: anywhere;
}
/* /Components/Pages/Home.razor.rz.scp.css */
.bb-home-page[b-k9o8z149rt] {
    --bb-home-primary: var(--mud-palette-primary);
    --bb-home-secondary: var(--mud-palette-secondary);
    --bb-home-info: var(--mud-palette-info);
    --bb-home-success: var(--mud-palette-success);
    --bb-home-warning: var(--mud-palette-warning);
    --bb-home-error: var(--mud-palette-error);
    --bb-home-surface: var(--mud-palette-surface);
    --bb-home-background: var(--mud-palette-background);
    --bb-home-text-primary: var(--mud-palette-text-primary);
    --bb-home-text-secondary: var(--mud-palette-text-secondary);
    --bb-home-divider: var(--mud-palette-divider);
    --bb-home-gold: #B89B5E;
    --bb-home-shadow: color-mix(in srgb, var(--bb-home-primary) 12%, transparent);
    font-family: var(--mud-typography-default-family, inherit);
    padding-bottom: 5rem;
}

    .bb-home-page[b-k9o8z149rt]  .mud-button-root {
        border-radius: 10px !important;
        font-weight: 950;
        letter-spacing: 0.02em;
    }

.bb-home-hero-section[b-k9o8z149rt] {
    position: relative;
    overflow: visible;
    padding: 2.45rem 2.8rem 4.3rem;
    margin-bottom: 3.15rem;
    border-radius: 36px;
    background: radial-gradient(circle at 86% 14%, color-mix(in srgb, var(--bb-home-secondary) 20%, transparent), transparent 27%), radial-gradient(circle at 12% 92%, color-mix(in srgb, var(--bb-home-primary) 15%, transparent), transparent 30%), radial-gradient(circle at 34% 12%, color-mix(in srgb, var(--bb-home-secondary) 10%, transparent), transparent 26%), linear-gradient(135deg, color-mix(in srgb, var(--bb-home-surface) 98%, var(--bb-home-primary)) 0%, var(--bb-home-surface) 52%, color-mix(in srgb, var(--bb-home-secondary) 8%, var(--bb-home-surface)) 100%);
    border: 1px solid color-mix(in srgb, var(--bb-home-primary) 12%, var(--bb-home-divider));
    box-shadow: 0 30px 76px var(--bb-home-shadow);
}

    .bb-home-hero-section[b-k9o8z149rt]::before {
        content: "";
        position: absolute;
        inset: 0;
        border-radius: inherit;
        background: linear-gradient(112deg, color-mix(in srgb, var(--bb-home-surface) 80%, transparent), transparent 54%), radial-gradient(circle at 42% 14%, color-mix(in srgb, var(--bb-home-primary) 6%, transparent), transparent 25%), repeating-linear-gradient(135deg, color-mix(in srgb, var(--bb-home-primary) 4%, transparent) 0 1px, transparent 1px 22px);
        pointer-events: none;
    }

    .bb-home-hero-section[b-k9o8z149rt]::after {
        content: "";
        position: absolute;
        left: 2rem;
        right: 2rem;
        top: 1.8rem;
        height: 3px;
        border-radius: 999px;
        background: linear-gradient(90deg, color-mix(in srgb, var(--bb-home-primary) 0%, transparent), color-mix(in srgb, var(--bb-home-primary) 68%, transparent) 18%, color-mix(in srgb, var(--bb-home-secondary) 78%, transparent) 74%, color-mix(in srgb, var(--bb-home-secondary) 0%, transparent));
        opacity: 0.86;
        pointer-events: none;
    }

.bb-home-hero-glow[b-k9o8z149rt] {
    position: absolute;
    border-radius: 999px;
    filter: blur(10px);
    pointer-events: none;
}

.bb-home-hero-glow-one[b-k9o8z149rt] {
    top: 3rem;
    right: 9rem;
    width: 175px;
    height: 175px;
    background: color-mix(in srgb, var(--bb-home-secondary) 14%, transparent);
}

.bb-home-hero-glow-two[b-k9o8z149rt] {
    left: -3rem;
    bottom: -5rem;
    width: 285px;
    height: 285px;
    background: color-mix(in srgb, var(--bb-home-primary) 11%, transparent);
}

.bb-home-page[b-k9o8z149rt]  .bb-home-hero-grid {
    position: relative;
    z-index: 2;
    align-items: center;
}

.bb-home-hero-copy[b-k9o8z149rt] {
    position: relative;
    z-index: 3;
}

.bb-home-eyebrow[b-k9o8z149rt],
.bb-home-section-kicker[b-k9o8z149rt],
.bb-home-owner-chip[b-k9o8z149rt] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.62rem 1rem;
    color: #ffffff;
    font-size: 0.78rem;
    font-weight: 950;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--bb-home-primary), var(--bb-home-secondary));
    box-shadow: 0 16px 34px color-mix(in srgb, var(--bb-home-primary) 24%, transparent);
}

.bb-home-page[b-k9o8z149rt]  .bb-home-eyebrow .mud-icon-root,
.bb-home-page[b-k9o8z149rt]  .bb-home-section-kicker .mud-icon-root,
.bb-home-page[b-k9o8z149rt]  .bb-home-owner-chip .mud-icon-root {
    color: #ffffff !important;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-hero-title {
    max-width: 720px;
    color: var(--bb-home-text-primary);
    font-size: clamp(2.55rem, 4.5vw, 3.25rem);
    font-weight: 950;
    line-height: 1.03;
    letter-spacing: -0.055em;
}

    .bb-home-page[b-k9o8z149rt]  .bb-home-hero-title span {
        display: block;
        color: var(--bb-home-secondary);
        font-style: italic;
    }

.bb-home-page[b-k9o8z149rt]  .bb-home-hero-subtitle {
    max-width: 680px;
    color: var(--bb-home-text-secondary);
    font-size: 1.02rem;
    line-height: 1.72;
    font-weight: 600;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-hero-actions {
    flex-wrap: wrap;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-primary-cta,
.bb-home-page[b-k9o8z149rt]  .bb-home-card-cta {
    position: relative;
    overflow: hidden;
    min-height: 48px;
    color: #ffffff !important;
    border: 0 !important;
    background: linear-gradient(135deg, var(--bb-home-primary), color-mix(in srgb, var(--bb-home-primary) 78%, var(--bb-home-secondary))) !important;
    box-shadow: 0 18px 40px color-mix(in srgb, var(--bb-home-primary) 24%, transparent) !important;
    animation: bb-home-cta-pulse-b-k9o8z149rt 3.8s ease-in-out infinite;
}

    .bb-home-page[b-k9o8z149rt]  .bb-home-primary-cta::after,
    .bb-home-page[b-k9o8z149rt]  .bb-home-card-cta::after {
        content: "";
        position: absolute;
        top: -75%;
        bottom: -75%;
        left: -92%;
        width: 52%;
        opacity: 0;
        transform: rotate(18deg);
        background: linear-gradient(90deg, transparent, rgba(255,255,255,0.64), transparent);
        animation: bb-home-cta-shine-b-k9o8z149rt 4.5s ease-in-out infinite;
        pointer-events: none;
    }

    .bb-home-page[b-k9o8z149rt]  .bb-home-primary-cta .mud-button-label,
    .bb-home-page[b-k9o8z149rt]  .bb-home-primary-cta .mud-icon-root,
    .bb-home-page[b-k9o8z149rt]  .bb-home-card-cta .mud-button-label,
    .bb-home-page[b-k9o8z149rt]  .bb-home-card-cta .mud-icon-root {
        position: relative;
        z-index: 2;
        color: #ffffff !important;
    }

.bb-home-page[b-k9o8z149rt]  .bb-home-secondary-cta {
    min-height: 48px;
    border-color: color-mix(in srgb, var(--bb-home-primary) 28%, var(--bb-home-divider)) !important;
}

.bb-home-trust-row[b-k9o8z149rt] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.62rem;
}

    .bb-home-trust-row span[b-k9o8z149rt] {
        display: inline-flex;
        align-items: center;
        gap: 0.34rem;
        padding: 0.44rem 0.68rem;
        border-radius: 10px;
        color: var(--bb-home-text-primary);
        font-size: 0.76rem;
        font-weight: 850;
        background: color-mix(in srgb, var(--bb-home-surface) 83%, transparent);
        border: 1px solid color-mix(in srgb, var(--bb-home-primary) 8%, var(--bb-home-divider));
        box-shadow: 0 10px 22px color-mix(in srgb, var(--bb-home-primary) 5%, transparent);
    }

.bb-home-page[b-k9o8z149rt]  .bb-home-trust-row .mud-icon-root {
    color: var(--bb-home-primary);
}

.bb-home-page[b-k9o8z149rt]  .bb-home-showcase-card {
    position: relative;
    overflow: hidden;
    min-height: 100%;
    padding: 1.65rem;
    border-radius: 30px;
    background: radial-gradient(circle at 92% 12%, color-mix(in srgb, var(--bb-home-secondary) 12%, transparent), transparent 28%), linear-gradient(145deg, color-mix(in srgb, var(--bb-home-surface) 98%, transparent), color-mix(in srgb, var(--bb-home-background) 82%, var(--bb-home-surface)));
    border: 1px solid color-mix(in srgb, var(--bb-home-surface) 92%, var(--bb-home-divider));
    box-shadow: 0 24px 58px color-mix(in srgb, var(--bb-home-text-primary) 9%, transparent);
}

    .bb-home-page[b-k9o8z149rt]  .bb-home-showcase-card::after {
        content: "";
        position: absolute;
        right: -96px;
        bottom: -120px;
        width: 260px;
        height: 260px;
        border-radius: 999px;
        background: color-mix(in srgb, var(--bb-home-primary) 8%, transparent);
        pointer-events: none;
    }

.bb-home-showcase-accent[b-k9o8z149rt] {
    position: absolute;
    inset: 0 0 auto;
    height: 7px;
    background: linear-gradient(90deg, var(--bb-home-primary), var(--bb-home-secondary));
}

.bb-home-showcase-content[b-k9o8z149rt] {
    position: relative;
    z-index: 2;
}

.bb-home-showcase-top[b-k9o8z149rt] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.bb-home-showcase-icon[b-k9o8z149rt] {
    width: 50px;
    height: 50px;
    display: grid;
    place-items: center;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--bb-home-primary), var(--bb-home-secondary));
    box-shadow: 0 16px 34px color-mix(in srgb, var(--bb-home-primary) 20%, transparent);
}

.bb-home-page[b-k9o8z149rt]  .bb-home-showcase-icon .mud-icon-root {
    color: #ffffff !important;
    font-size: 1.55rem;
}

.bb-home-live-pill[b-k9o8z149rt] {
    width: fit-content;
    padding: 0.42rem 0.68rem;
    border-radius: 10px;
    color: var(--bb-home-text-primary);
    font-size: 0.72rem;
    font-weight: 950;
    background: color-mix(in srgb, var(--bb-home-secondary) 9%, var(--bb-home-surface));
    border: 1px solid color-mix(in srgb, var(--bb-home-secondary) 18%, var(--bb-home-divider));
}

.bb-home-page[b-k9o8z149rt]  .bb-home-showcase-title {
    color: var(--bb-home-text-primary);
    font-size: clamp(1.3rem, 1.75vw, 1.75rem);
    font-weight: 950;
    line-height: 1.1;
    letter-spacing: -0.03em;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-showcase-text {
    max-width: 500px;
    color: var(--bb-home-text-secondary);
    line-height: 1.5;
    font-weight: 600;
}

.bb-home-preview-salon-card[b-k9o8z149rt] {
    overflow: hidden;
    border-radius: 22px;
    background: linear-gradient(145deg, var(--bb-home-surface), color-mix(in srgb, var(--bb-home-background) 70%, var(--bb-home-surface)));
    border: 1px solid color-mix(in srgb, var(--bb-home-primary) 8%, var(--bb-home-divider));
    box-shadow: 0 18px 42px color-mix(in srgb, var(--bb-home-text-primary) 8%, transparent);
}

.bb-home-preview-media[b-k9o8z149rt] {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    min-height: 165px;
    padding: 1rem;
    background-image: linear-gradient(180deg, rgba(15, 23, 42, 0.10), rgba(15, 23, 42, 0.72)), radial-gradient(circle at 82% 16%, color-mix(in srgb, var(--bb-home-secondary) 34%, transparent), transparent 30%), radial-gradient(circle at 18% 92%, color-mix(in srgb, var(--bb-home-primary) 30%, transparent), transparent 34%), linear-gradient(135deg, #0f172a, color-mix(in srgb, var(--bb-home-primary) 80%, #020617));
    background-size: cover;
    background-position: center;
    background-color: #111827;
    border-bottom: 1px solid color-mix(in srgb, var(--bb-home-primary) 10%, var(--bb-home-divider));
    --home-shine-soft-opacity: 0.34;
    --home-shine-peak-opacity: 0.52;
    --home-sparkle-opacity: 0.72;
}

    .bb-home-preview-media[b-k9o8z149rt]::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 1;
        opacity: 1;
        background: linear-gradient(135deg, rgba(255, 255, 255, 0.12), transparent 56%), repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.09) 0 1px, transparent 1px 18px);
        pointer-events: none;
    }

    .bb-home-preview-media[b-k9o8z149rt]::after {
        content: "";
        position: absolute;
        top: -52%;
        left: -92%;
        width: 70%;
        height: 195%;
        z-index: 3;
        pointer-events: none;
        opacity: 0;
        transform: translateX(-25%) rotate(18deg);
        background: linear-gradient(90deg, transparent, rgba(255,255,255,0.50), transparent);
        filter: blur(1px);
        mix-blend-mode: screen;
        animation: bb-home-card-shine-b-k9o8z149rt 8.8s ease-in-out infinite;
    }

.bb-home-preview-media-overlay[b-k9o8z149rt] {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: radial-gradient(circle at 18% 25%, rgba(255, 255, 255, 0.16), transparent 23%), linear-gradient(180deg, rgba(15, 23, 42, 0.14), rgba(15, 23, 42, 0.68));
}

    .bb-home-preview-media-overlay[b-k9o8z149rt]::after {
        content: "";
        position: absolute;
        inset: 0;
        opacity: 0;
        background: radial-gradient(circle at 18% 25%, rgba(255,255,255,0.95) 0 1px, rgba(255,255,255,0.42) 2px, transparent 5px), radial-gradient(circle at 73% 24%, rgba(255,255,255,0.86) 0 1px, rgba(255,255,255,0.34) 2px, transparent 5px), radial-gradient(circle at 58% 43%, rgba(255,255,255,0.76) 0 1px, rgba(255,255,255,0.24) 2px, transparent 5px);
        animation: bb-home-card-sparkle-b-k9o8z149rt 8.8s ease-in-out infinite;
    }

.bb-home-preview-top-row[b-k9o8z149rt],
.bb-home-preview-media-bottom[b-k9o8z149rt] {
    position: relative;
    z-index: 4;
}

.bb-home-preview-top-row[b-k9o8z149rt] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.bb-home-preview-initials[b-k9o8z149rt] {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    color: #ffffff;
    font-size: 1.1rem;
    font-weight: 950;
    letter-spacing: -0.04em;
    border-radius: 20px;
    background: rgba(255,255,255,0.18);
    border: 1px solid rgba(255,255,255,0.28);
    backdrop-filter: blur(14px);
    box-shadow: 0 18px 38px rgba(15,23,42,0.28);
}

.bb-home-preview-badges[b-k9o8z149rt] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.4rem;
}

.bb-home-preview-badge[b-k9o8z149rt] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 26px;
    padding: 0.34rem 0.58rem;
    color: #ffffff;
    font-size: 0.66rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,0.22);
    background: rgba(15,23,42,0.40);
    backdrop-filter: blur(12px);
}

.bb-home-preview-badge-verified[b-k9o8z149rt] {
    background: color-mix(in srgb, var(--bb-home-secondary) 74%, rgba(15,23,42,0.34));
}

.bb-home-preview-badge-featured[b-k9o8z149rt] {
    background: color-mix(in srgb, var(--bb-home-primary) 70%, rgba(15,23,42,0.34));
}

.bb-home-preview-media-bottom[b-k9o8z149rt] {
    position: absolute;
    left: 1rem;
    right: 1rem;
    bottom: 1rem;
    color: rgba(255,255,255,0.86);
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.bb-home-preview-body[b-k9o8z149rt] {
    display: grid;
    gap: 0.85rem;
    padding: 1.05rem;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-preview-title {
    color: var(--bb-home-text-primary);
    font-weight: 950;
    line-height: 1.15;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-preview-location {
    color: var(--bb-home-secondary);
    font-weight: 750;
}

.bb-home-preview-highlight-row[b-k9o8z149rt] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.bb-home-preview-price-pill[b-k9o8z149rt],
.bb-home-preview-review-pill[b-k9o8z149rt],
.bb-home-salon-card-services span[b-k9o8z149rt],
.bb-home-preview-service-chips span[b-k9o8z149rt] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 0.34rem;
    padding: 0.42rem 0.62rem;
    font-size: 0.72rem;
    font-weight: 950;
    line-height: 1;
    border-radius: 999px;
    white-space: nowrap;
}

.bb-home-preview-price-pill[b-k9o8z149rt] {
    color: var(--bb-home-primary);
    background: color-mix(in srgb, var(--bb-home-primary) 8%, var(--bb-home-surface));
    border: 1px solid color-mix(in srgb, var(--bb-home-primary) 14%, var(--bb-home-divider));
}

.bb-home-preview-review-pill[b-k9o8z149rt] {
    color: color-mix(in srgb, var(--bb-home-warning) 78%, #7c2d12);
    background: color-mix(in srgb, var(--bb-home-warning) 12%, var(--bb-home-surface));
    border: 1px solid color-mix(in srgb, var(--bb-home-warning) 18%, var(--bb-home-divider));
}

.bb-home-preview-address[b-k9o8z149rt] {
    display: flex;
    align-items: flex-start;
    gap: 0.42rem;
    color: var(--bb-home-text-secondary);
    font-size: 0.82rem;
    font-weight: 700;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-preview-address .mud-icon-root {
    color: var(--bb-home-primary);
    margin-top: 0.05rem;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-preview-description,
.bb-home-salon-card-copy[b-k9o8z149rt] {
    color: var(--bb-home-text-secondary);
    font-size: 0.86rem;
    line-height: 1.48;
    font-weight: 600;
}

.bb-home-preview-service-chips[b-k9o8z149rt],
.bb-home-salon-card-services[b-k9o8z149rt] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

    .bb-home-preview-service-chips span[b-k9o8z149rt],
    .bb-home-salon-card-services span[b-k9o8z149rt] {
        color: var(--bb-home-primary);
        background: color-mix(in srgb, var(--bb-home-primary) 7%, var(--bb-home-surface));
        border: 1px solid color-mix(in srgb, var(--bb-home-primary) 11%, var(--bb-home-divider));
    }

.bb-home-preview-mini-actions[b-k9o8z149rt] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.45rem;
}

    .bb-home-preview-mini-actions span[b-k9o8z149rt] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.3rem;
        min-width: 0;
        padding: 0.48rem 0.4rem;
        color: var(--bb-home-text-primary);
        font-size: 0.68rem;
        font-weight: 900;
        border-radius: 10px;
        background: color-mix(in srgb, var(--bb-home-secondary) 6%, var(--bb-home-surface));
        border: 1px solid color-mix(in srgb, var(--bb-home-secondary) 10%, var(--bb-home-divider));
    }

.bb-home-page[b-k9o8z149rt]  .bb-home-search-card {
    position: relative;
    z-index: 7;
    width: min(1120px, calc(100% - 2.5rem));
    margin: -5.2rem auto 3.4rem;
    padding: 1.15rem;
    border-radius: 28px;
    background: color-mix(in srgb, var(--bb-home-surface) 98%, transparent);
    border: 1px solid color-mix(in srgb, var(--bb-home-primary) 10%, var(--bb-home-divider));
    box-shadow: 0 18px 48px color-mix(in srgb, var(--bb-home-text-primary) 7%, transparent);
    backdrop-filter: blur(18px);
}

.bb-home-page[b-k9o8z149rt]  .bb-home-search-grid {
    align-items: end;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-search-field .mud-input-control {
    margin-top: 0;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-search-field .mud-input-control-input-container,
.bb-home-page[b-k9o8z149rt]  .bb-home-search-field .mud-input-root,
.bb-home-page[b-k9o8z149rt]  .bb-home-search-field .mud-input,
.bb-home-page[b-k9o8z149rt]  .bb-home-search-field .mud-input-slot {
    height: 48px;
    min-height: 48px;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-search-field .mud-input-root {
    border-radius: 10px !important;
    background: color-mix(in srgb, var(--bb-home-surface) 98%, transparent);
}

.bb-home-page[b-k9o8z149rt]  .bb-home-search-field .mud-input-slot {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    display: flex;
    align-items: center;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-search-field .mud-input-adornment,
.bb-home-page[b-k9o8z149rt]  .bb-home-search-field .mud-input-adornment-start {
    align-self: center;
    margin-top: 0 !important;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-search-field input {
    color: var(--bb-home-text-primary) !important;
    font-family: inherit !important;
    font-size: 0.92rem !important;
    font-weight: 600 !important;
}

.bb-home-search-action[b-k9o8z149rt] {
    height: 100%;
    min-height: 48px;
    display: flex;
    align-items: stretch;
    justify-content: flex-end;
}

.bb-home-search-icon-button[b-k9o8z149rt] {
    position: relative;
    overflow: hidden;
    width: 100%;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    color: #ffffff;
    font-family: inherit;
    font-size: 0.82rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    border: 0;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--bb-home-primary), var(--bb-home-secondary));
    box-shadow: 0 14px 30px color-mix(in srgb, var(--bb-home-primary) 20%, transparent);
    cursor: pointer;
    transition: transform 160ms ease, box-shadow 160ms ease;
}

    .bb-home-search-icon-button:hover[b-k9o8z149rt],
    .bb-home-search-icon-button:focus-visible[b-k9o8z149rt] {
        transform: translateY(-2px);
        box-shadow: 0 20px 44px color-mix(in srgb, var(--bb-home-primary) 26%, transparent);
        outline: none;
    }

.bb-home-page[b-k9o8z149rt]  .bb-home-search-icon-button .mud-icon-root {
    color: #ffffff !important;
}

.bb-home-quick-search[b-k9o8z149rt] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem 0.9rem;
    margin-top: 0.85rem;
}

.bb-home-quick-search-label[b-k9o8z149rt],
.bb-home-service-chip[b-k9o8z149rt] {
    display: inline-flex;
    align-items: center;
    gap: 0.42rem;
}

.bb-home-quick-search-label[b-k9o8z149rt] {
    color: var(--bb-home-text-secondary);
    font-size: 0.76rem;
    font-weight: 900;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.bb-home-quick-search-row[b-k9o8z149rt] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.bb-home-service-chip[b-k9o8z149rt] {
    min-height: 38px;
    padding: 0.5rem 0.78rem;
    color: var(--bb-home-text-primary);
    font-family: inherit;
    font-size: 0.8rem;
    font-weight: 900;
    border: 1px solid color-mix(in srgb, var(--bb-home-primary) 9%, var(--bb-home-divider));
    border-radius: 999px;
    background: color-mix(in srgb, var(--bb-home-surface) 95%, transparent);
    cursor: pointer;
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

    .bb-home-service-chip:hover[b-k9o8z149rt],
    .bb-home-service-chip:focus-visible[b-k9o8z149rt] {
        transform: translateY(-1px);
        border-color: color-mix(in srgb, var(--bb-home-primary) 28%, var(--bb-home-divider));
        box-shadow: 0 12px 26px color-mix(in srgb, var(--bb-home-primary) 8%, transparent);
        outline: none;
    }

.bb-home-story-intro[b-k9o8z149rt],
.bb-home-section-heading-centered[b-k9o8z149rt] {
    display: grid;
    justify-items: center;
    gap: 1rem;
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-section-title {
    color: var(--bb-home-text-primary);
    font-size: clamp(2rem, 3.2vw, 3.1rem);
    font-weight: 950;
    line-height: 1.06;
    letter-spacing: -0.055em;
    text-wrap: balance;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-section-text {
    color: var(--bb-home-text-secondary);
    font-size: 1.02rem;
    font-weight: 620;
    line-height: 1.64;
}

.bb-home-product-strip[b-k9o8z149rt] {
    width: min(1180px, 100%);
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.9rem;
    margin: 2.4rem auto 0;
}

.bb-home-product-strip-card[b-k9o8z149rt] {
    display: grid;
    gap: 0.45rem;
    min-height: 165px;
    padding: 1.1rem;
    border-radius: 22px;
    background: linear-gradient(145deg, var(--bb-home-surface), color-mix(in srgb, var(--bb-home-background) 70%, var(--bb-home-surface)));
    border: 1px solid color-mix(in srgb, var(--bb-home-primary) 9%, var(--bb-home-divider));
    box-shadow: 0 16px 40px color-mix(in srgb, var(--bb-home-text-primary) 6%, transparent);
}

    .bb-home-product-strip-card .mud-icon-root[b-k9o8z149rt] {
        color: var(--bb-home-primary);
        font-size: 1.6rem;
    }

    .bb-home-product-strip-card strong[b-k9o8z149rt] {
        color: var(--bb-home-text-primary);
        font-size: 0.98rem;
        font-weight: 950;
        line-height: 1.18;
    }

    .bb-home-product-strip-card span[b-k9o8z149rt] {
        color: var(--bb-home-text-secondary);
        font-size: 0.84rem;
        font-weight: 630;
        line-height: 1.42;
    }

.bb-home-guided-section[b-k9o8z149rt],
.bb-home-customer-section[b-k9o8z149rt] {
    display: grid;
    gap: 4.4rem;
    margin-top: 5rem;
}

.bb-home-walkthrough[b-k9o8z149rt] {
    display: grid;
    grid-template-columns: minmax(0, 1.04fr) minmax(0, 0.96fr);
    gap: clamp(1.4rem, 4vw, 4rem);
    align-items: center;
}

.bb-home-walkthrough-reverse .bb-home-walkthrough-visual[b-k9o8z149rt] {
    order: 2;
}

.bb-home-walkthrough-reverse .bb-home-walkthrough-copy[b-k9o8z149rt] {
    order: 1;
}

.bb-home-walkthrough-visual[b-k9o8z149rt] {
    min-width: 0;
}

.bb-home-walkthrough-copy[b-k9o8z149rt] {
    display: grid;
    gap: 1rem;
    min-width: 0;
}

.bb-home-step-label[b-k9o8z149rt] {
    width: fit-content;
    padding: 0.38rem 0.72rem;
    color: var(--bb-home-secondary);
    font-size: 0.72rem;
    font-weight: 950;
    line-height: 1;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    border-radius: 999px;
    background: color-mix(in srgb, var(--bb-home-secondary) 8%, var(--bb-home-surface));
    border: 1px solid color-mix(in srgb, var(--bb-home-secondary) 14%, var(--bb-home-divider));
}

.bb-home-page[b-k9o8z149rt]  .bb-home-walkthrough-title,
.bb-home-page[b-k9o8z149rt]  .bb-home-mobile-title,
.bb-home-page[b-k9o8z149rt]  .bb-home-final-title {
    color: var(--bb-home-text-primary);
    font-size: clamp(1.85rem, 3vw, 2.85rem);
    font-weight: 950;
    line-height: 1.08;
    letter-spacing: -0.052em;
    text-wrap: balance;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-walkthrough-text,
.bb-home-page[b-k9o8z149rt]  .bb-home-mobile-text,
.bb-home-page[b-k9o8z149rt]  .bb-home-final-text {
    color: var(--bb-home-text-secondary);
    font-size: 1rem;
    font-weight: 620;
    line-height: 1.64;
}

.bb-home-feature-list[b-k9o8z149rt] {
    display: grid;
    gap: 0.55rem;
}

    .bb-home-feature-list span[b-k9o8z149rt] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        color: var(--bb-home-text-primary);
        font-size: 0.9rem;
        font-weight: 820;
    }

    .bb-home-feature-list .mud-icon-root[b-k9o8z149rt] {
        flex: 0 0 auto;
        color: var(--bb-home-secondary);
    }

.bb-home-page[b-k9o8z149rt]  .bb-home-inline-cta {
    width: fit-content;
    min-height: 46px;
    margin-top: 0.35rem;
}

/* Real salon card preview borrowed from Salons visual language */
.bb-home-salon-card-demo[b-k9o8z149rt] {
    max-width: 430px;
    margin-inline: auto;
}

    .bb-home-salon-card-demo .salon-card[b-k9o8z149rt] {
        overflow: hidden;
        border-radius: 26px;
        background: var(--bb-home-surface);
        border: 1px solid color-mix(in srgb, var(--bb-home-primary) 8%, var(--bb-home-divider));
        box-shadow: 0 26px 66px color-mix(in srgb, var(--bb-home-text-primary) 12%, transparent);
        transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
    }

    .bb-home-salon-card-demo:hover .salon-card[b-k9o8z149rt] {
        transform: translateY(-4px);
        border-color: color-mix(in srgb, var(--bb-home-primary) 26%, var(--bb-home-divider));
        box-shadow: 0 32px 78px color-mix(in srgb, var(--bb-home-text-primary) 15%, transparent);
    }

    .bb-home-salon-card-demo .salon-card-media[b-k9o8z149rt] {
        position: relative;
        overflow: hidden;
        min-height: 200px;
        padding: 1.25rem;
        background: radial-gradient(circle at 82% 16%, color-mix(in srgb, var(--bb-home-secondary) 28%, transparent), transparent 34%), radial-gradient(circle at 15% 92%, color-mix(in srgb, var(--bb-home-primary) 24%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--bb-home-primary) 18%, var(--bb-home-surface)), color-mix(in srgb, var(--bb-home-secondary) 12%, var(--bb-home-surface)));
        border-bottom: 1px solid color-mix(in srgb, var(--bb-home-primary) 10%, var(--bb-home-divider));
    }

    .bb-home-salon-card-demo .salon-card-media-with-image[b-k9o8z149rt] {
        isolation: isolate;
        background: #111827;
    }

        .bb-home-salon-card-demo .salon-card-media-with-image[b-k9o8z149rt]::after {
            content: "";
            position: absolute;
            top: -52%;
            left: -92%;
            width: 70%;
            height: 195%;
            z-index: 2;
            pointer-events: none;
            opacity: 0;
            transform: translateX(-25%) rotate(18deg);
            background: linear-gradient(90deg, transparent, rgba(255,255,255,0.48), transparent);
            filter: blur(1.25px);
            mix-blend-mode: screen;
            animation: bb-home-card-shine-b-k9o8z149rt 9.2s ease-in-out infinite;
        }

.bb-home-salon-demo-gradient[b-k9o8z149rt] {
    position: absolute;
    inset: 0;
    z-index: 0;
    background: radial-gradient(circle at 25% 20%, rgba(255,255,255,0.16), transparent 22%), radial-gradient(circle at 78% 10%, color-mix(in srgb, var(--bb-home-secondary) 38%, transparent), transparent 25%), radial-gradient(circle at 30% 92%, color-mix(in srgb, var(--bb-home-primary) 46%, transparent), transparent 32%), linear-gradient(135deg, #0f172a, color-mix(in srgb, var(--bb-home-primary) 76%, #020617));
}

.bb-home-salon-card-demo .salon-card-image-overlay[b-k9o8z149rt] {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.50) 0%, rgba(15, 23, 42, 0.08) 42%, rgba(15, 23, 42, 0.72) 100%), linear-gradient(135deg, rgba(91,75,255,0.18), rgba(20,184,166,0.16));
    pointer-events: none;
}

.bb-home-salon-card-demo .salon-card-media-top[b-k9o8z149rt] {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.bb-home-salon-card-demo .salon-card-initials[b-k9o8z149rt] {
    width: 68px;
    height: 68px;
    display: grid;
    place-items: center;
    color: #ffffff;
    font-size: 1.3rem;
    font-weight: 950;
    letter-spacing: -0.04em;
    border-radius: 24px;
    background: rgba(255,255,255,0.18);
    border: 1px solid rgba(255,255,255,0.28);
    backdrop-filter: blur(14px);
    box-shadow: 0 18px 38px rgba(15,23,42,0.28);
}

.bb-home-salon-card-demo .salon-card-media-bottom[b-k9o8z149rt] {
    position: absolute;
    left: 1.25rem;
    right: 1.25rem;
    bottom: 1rem;
    z-index: 3;
}

    .bb-home-salon-card-demo .salon-card-media-bottom .mud-typography[b-k9o8z149rt] {
        color: rgba(255,255,255,0.86);
        font-weight: 900;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

.bb-home-salon-card-demo .salon-card-content[b-k9o8z149rt] {
    display: grid;
    gap: 0.8rem;
    padding: 1.25rem 1.25rem 0.9rem;
}

.bb-home-salon-card-demo .salon-card-title[b-k9o8z149rt] {
    color: var(--bb-home-text-primary);
    font-weight: 950;
    letter-spacing: -0.028em;
    line-height: 1.15;
}

.bb-home-salon-card-demo .salon-card-location-line[b-k9o8z149rt] {
    color: var(--bb-home-secondary);
    font-weight: 750;
}

.bb-home-salon-card-demo .salon-card-address[b-k9o8z149rt] {
    display: flex;
    align-items: flex-start;
    gap: 0.4rem;
    color: var(--bb-home-text-secondary);
    font-size: 0.84rem;
    font-weight: 720;
}

.bb-home-salon-card-demo .salon-card-footer[b-k9o8z149rt] {
    padding: 0 1.25rem 1.2rem;
}

/* Owner setup preview */
.bb-home-owner-setup-demo[b-k9o8z149rt] {
    display: grid;
    gap: 1rem;
    max-width: 720px;
    margin-inline: auto;
}

.owner-premium-stepper-page[b-k9o8z149rt] {
    --bb-owner-primary: var(--mud-palette-primary);
    --bb-owner-accent: #B89B5E;
    --bb-owner-surface: var(--mud-palette-surface);
    --bb-owner-background: var(--mud-palette-background);
    --bb-owner-text: var(--mud-palette-text-primary);
    --bb-owner-muted: var(--mud-palette-text-secondary);
    --bb-owner-line: color-mix(in srgb, var(--mud-palette-primary) 12%, var(--mud-palette-divider));
}

.owner-premium-hero-shell-final[b-k9o8z149rt] {
    display: block;
    min-height: 0;
    height: auto;
    padding: 1.05rem;
    border-radius: 20px;
    color: #ffffff;
    border: 1px solid color-mix(in srgb, var(--bb-owner-accent) 28%, transparent);
    background: radial-gradient(circle at 9% 12%, color-mix(in srgb, var(--bb-owner-accent) 17%, transparent), transparent 25%), linear-gradient(135deg, color-mix(in srgb, var(--bb-owner-primary) 96%, #020617) 0%, var(--bb-owner-primary) 100%);
    box-shadow: 0 16px 38px color-mix(in srgb, var(--bb-owner-primary) 17%, transparent), inset 0 1px 0 rgba(255,255,255,0.14);
}

.owner-premium-hero-compact-grid[b-k9o8z149rt] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
    gap: 1rem;
    align-items: stretch;
}

.owner-premium-hero-main[b-k9o8z149rt] {
    min-width: 0;
    display: grid;
    align-content: center;
    gap: 0.72rem;
    padding: 0.1rem;
}

.owner-premium-kicker-row[b-k9o8z149rt] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.owner-premium-kicker-icon[b-k9o8z149rt] {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    color: #ffffff;
    border-radius: 12px;
    background: linear-gradient(135deg, var(--bb-owner-accent), color-mix(in srgb, var(--bb-owner-accent) 76%, var(--bb-owner-primary)));
    box-shadow: 0 12px 24px rgba(0,0,0,0.18);
}

    .owner-premium-kicker-icon .mud-icon-root[b-k9o8z149rt] {
        color: #ffffff !important;
        font-size: 1rem !important;
    }

.owner-premium-kicker-pill[b-k9o8z149rt] {
    display: inline-flex;
    width: fit-content;
    padding: 0.24rem 0.62rem;
    color: #ffffff;
    font-size: 0.56rem;
    font-weight: 950;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    border-radius: 999px;
    background: color-mix(in srgb, var(--bb-owner-accent) 82%, transparent);
    border: 1px solid rgba(255,255,255,0.18);
}

.owner-premium-kicker-row strong[b-k9o8z149rt],
.owner-premium-hero-title[b-k9o8z149rt],
.owner-premium-hero-subtitle[b-k9o8z149rt] {
    color: #ffffff !important;
}

.owner-premium-kicker-row strong[b-k9o8z149rt] {
    display: block;
    margin-top: 0.2rem;
    font-size: 0.62rem;
    font-weight: 950;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    opacity: 0.84;
}

.owner-premium-hero-title[b-k9o8z149rt] {
    max-width: 620px;
    margin: 0;
    font-size: clamp(1.55rem, 2.4vw, 2.35rem) !important;
    line-height: 1.04 !important;
    letter-spacing: -0.045em !important;
}

.owner-premium-hero-subtitle[b-k9o8z149rt] {
    max-width: 660px;
    margin: 0;
    font-size: 0.84rem;
    line-height: 1.45;
    opacity: 0.88;
}

.bb-home-owner-mini-actions[b-k9o8z149rt] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

    .bb-home-owner-mini-actions span[b-k9o8z149rt] {
        display: inline-flex;
        align-items: center;
        gap: 0.34rem;
        padding: 0.36rem 0.52rem;
        color: #ffffff;
        font-size: 0.64rem;
        font-weight: 900;
        border-radius: 10px;
        background: rgba(255,255,255,0.10);
        border: 1px solid rgba(255,255,255,0.14);
    }

.owner-premium-hero-status-card-final[b-k9o8z149rt] {
    width: 100%;
    min-height: 0;
    height: auto;
    display: grid;
    align-content: start;
    gap: 0.48rem;
    padding: 0.85rem;
    color: var(--bb-owner-primary);
    border-radius: 16px;
    background: rgba(255,255,255,0.92);
    border: 1px solid rgba(255,255,255,0.22);
    box-shadow: 0 16px 34px rgba(0,0,0,0.16);
}

.owner-premium-status-card-top[b-k9o8z149rt] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.65rem;
}

    .owner-premium-status-card-top div[b-k9o8z149rt] {
        display: grid;
        gap: 0.12rem;
    }

    .owner-premium-status-card-top span[b-k9o8z149rt] {
        color: color-mix(in srgb, var(--bb-owner-primary) 64%, transparent);
        font-size: 0.55rem;
        font-weight: 950;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .owner-premium-status-card-top strong[b-k9o8z149rt] {
        color: var(--bb-owner-primary);
        font-size: 1.45rem;
        line-height: 1;
        font-weight: 950;
    }

.owner-premium-status-avatar[b-k9o8z149rt] {
    width: 34px !important;
    height: 34px !important;
    background: var(--bb-owner-accent) !important;
}

    .owner-premium-status-avatar .mud-icon-root[b-k9o8z149rt] {
        color: #ffffff !important;
        font-size: 1rem !important;
    }

.owner-premium-status-progress[b-k9o8z149rt] {
    height: 5px !important;
}

.owner-premium-hero-status-card-final p[b-k9o8z149rt] {
    margin: 0;
    color: color-mix(in srgb, var(--bb-owner-primary) 78%, transparent);
    font-size: 0.7rem;
    line-height: 1.28;
    font-weight: 760;
}

.owner-premium-readiness-checklist[b-k9o8z149rt] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.25rem;
}

    .owner-premium-readiness-checklist div[b-k9o8z149rt] {
        min-height: 24px;
        display: flex;
        align-items: center;
        gap: 0.32rem;
        padding: 0.26rem 0.36rem;
        color: var(--bb-owner-primary);
        font-size: 0.56rem;
        font-weight: 900;
        border-radius: 8px;
        background: color-mix(in srgb, var(--bb-owner-accent) 8%, white);
        border: 1px solid color-mix(in srgb, var(--bb-owner-accent) 16%, transparent);
    }

    .owner-premium-readiness-checklist .owner-premium-readiness-check-complete[b-k9o8z149rt] {
        background: color-mix(in srgb, var(--bb-home-success) 10%, white);
        border-color: color-mix(in srgb, var(--bb-home-success) 20%, transparent);
    }

    .owner-premium-readiness-checklist .mud-icon-root[b-k9o8z149rt] {
        flex: 0 0 auto;
        color: var(--bb-owner-accent);
        font-size: 0.82rem;
    }

.owner-premium-step-nav-shell[b-k9o8z149rt] {
    padding: 0.85rem;
    border-radius: 22px;
    border: 1px solid color-mix(in srgb, var(--bb-owner-primary) 12%, var(--bb-home-divider));
    background: linear-gradient(135deg, color-mix(in srgb, var(--bb-owner-surface) 96%, var(--bb-owner-primary)), color-mix(in srgb, var(--bb-owner-background) 72%, var(--bb-owner-surface)));
    box-shadow: 0 18px 46px color-mix(in srgb, var(--bb-owner-primary) 9%, transparent);
}

.owner-premium-step-nav[b-k9o8z149rt] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.55rem;
}

.owner-premium-step-nav-button[b-k9o8z149rt] {
    position: relative;
    min-width: 0;
    min-height: 72px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.55rem;
    align-items: center;
    padding: 0.65rem;
    color: var(--bb-owner-text);
    background: rgba(255,255,255,0.76);
    border: 1px solid color-mix(in srgb, var(--bb-owner-primary) 10%, transparent);
    border-radius: 16px;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--bb-owner-primary) 4%, transparent);
}

.owner-premium-step-nav-button-active[b-k9o8z149rt] {
    color: #ffffff;
    background: linear-gradient(135deg, var(--bb-owner-accent), color-mix(in srgb, var(--bb-owner-primary) 84%, var(--bb-owner-accent)));
    border-color: color-mix(in srgb, var(--bb-owner-accent) 58%, transparent);
    box-shadow: 0 18px 38px color-mix(in srgb, var(--bb-owner-accent) 20%, transparent);
}

.owner-premium-step-nav-button-complete:not(.owner-premium-step-nav-button-active)[b-k9o8z149rt] {
    background: linear-gradient(135deg, color-mix(in srgb, var(--bb-home-success) 10%, white), rgba(255,255,255,0.82));
    border-color: color-mix(in srgb, var(--bb-home-success) 22%, transparent);
}

    .owner-premium-step-nav-button-complete:not(.owner-premium-step-nav-button-active)[b-k9o8z149rt]::after {
        content: "✓";
        position: absolute;
        right: 0.48rem;
        top: 0.42rem;
        width: 18px;
        height: 18px;
        display: grid;
        place-items: center;
        color: #ffffff;
        font-size: 0.68rem;
        font-weight: 950;
        border-radius: 999px;
        background: var(--bb-home-success);
    }

.owner-premium-step-nav-icon[b-k9o8z149rt] {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    color: var(--bb-owner-accent);
    border-radius: 12px;
    background: color-mix(in srgb, var(--bb-owner-accent) 10%, white);
}

.owner-premium-step-nav-button-active .owner-premium-step-nav-icon[b-k9o8z149rt] {
    color: #ffffff;
    background: rgba(255,255,255,0.18);
}

.owner-premium-step-nav-button-active strong[b-k9o8z149rt],
.owner-premium-step-nav-button-active small[b-k9o8z149rt],
.owner-premium-step-nav-button-active .mud-icon-root[b-k9o8z149rt] {
    color: #ffffff !important;
}

.owner-premium-step-nav-copy[b-k9o8z149rt] {
    min-width: 0;
    display: grid;
    gap: 0.08rem;
}

    .owner-premium-step-nav-copy strong[b-k9o8z149rt] {
        display: block;
        overflow: hidden;
        color: var(--bb-owner-text);
        font-size: 0.78rem;
        font-weight: 950;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .owner-premium-step-nav-copy small[b-k9o8z149rt] {
        display: block;
        overflow: hidden;
        color: color-mix(in srgb, var(--bb-owner-text) 60%, transparent);
        font-size: 0.66rem;
        font-weight: 850;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

/* Services and professionals demo */
.bb-home-service-team-demo[b-k9o8z149rt],
.bb-home-review-demo[b-k9o8z149rt],
.bb-home-notification-and-appointment-demo[b-k9o8z149rt] {
    display: grid;
    gap: 1rem;
    padding: 1.1rem;
    border-radius: 28px;
    background: radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--bb-home-secondary) 9%, transparent), transparent 30%), linear-gradient(135deg, var(--bb-home-surface), color-mix(in srgb, var(--bb-home-background) 76%, var(--bb-home-surface)));
    border: 1px solid color-mix(in srgb, var(--bb-home-primary) 10%, var(--bb-home-divider));
    box-shadow: 0 24px 58px color-mix(in srgb, var(--bb-home-text-primary) 9%, transparent);
}

.bb-home-demo-panel-heading[b-k9o8z149rt],
.bb-home-admin-note-card[b-k9o8z149rt],
.bb-home-notification-header[b-k9o8z149rt] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 0.8rem;
}

    .bb-home-demo-panel-heading > span[b-k9o8z149rt],
    .bb-home-admin-note-card > .mud-icon-root[b-k9o8z149rt] {
        width: 50px;
        height: 50px;
        display: grid;
        place-items: center;
        color: #ffffff;
        border-radius: 17px;
        background: linear-gradient(135deg, var(--bb-home-primary), var(--bb-home-secondary));
        box-shadow: 0 14px 30px color-mix(in srgb, var(--bb-home-primary) 18%, transparent);
    }

    .bb-home-demo-panel-heading .mud-icon-root[b-k9o8z149rt] {
        color: #ffffff !important;
    }

    .bb-home-demo-panel-heading strong[b-k9o8z149rt],
    .bb-home-admin-note-card strong[b-k9o8z149rt],
    .bb-home-notification-header strong[b-k9o8z149rt],
    .bb-home-review-status-card strong[b-k9o8z149rt],
    .bb-home-appointment-status-card strong[b-k9o8z149rt] {
        color: var(--bb-home-text-primary);
        font-weight: 950;
        line-height: 1.18;
    }

    .bb-home-demo-panel-heading small[b-k9o8z149rt],
    .bb-home-admin-note-card span[b-k9o8z149rt],
    .bb-home-notification-header span[b-k9o8z149rt],
    .bb-home-review-status-card p[b-k9o8z149rt],
    .bb-home-appointment-status-card p[b-k9o8z149rt] {
        color: var(--bb-home-text-secondary);
        font-size: 0.84rem;
        font-weight: 640;
        line-height: 1.42;
    }

.bb-home-service-list-demo[b-k9o8z149rt] {
    display: grid;
    gap: 0.7rem;
}

.bb-home-service-row-demo[b-k9o8z149rt] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.75rem;
    padding: 0.9rem;
    border-radius: 18px;
    background: rgba(255,255,255,0.78);
    border: 1px solid color-mix(in srgb, var(--bb-home-primary) 9%, var(--bb-home-divider));
    box-shadow: 0 12px 28px color-mix(in srgb, var(--bb-home-text-primary) 5%, transparent);
}

    .bb-home-service-row-demo > span[b-k9o8z149rt] {
        width: 44px;
        height: 44px;
        display: grid;
        place-items: center;
        border-radius: 15px;
        background: color-mix(in srgb, var(--bb-home-primary) 8%, var(--bb-home-surface));
    }

    .bb-home-service-row-demo .mud-icon-root[b-k9o8z149rt] {
        color: var(--bb-home-primary);
    }

    .bb-home-service-row-demo strong[b-k9o8z149rt] {
        color: var(--bb-home-text-primary);
        font-weight: 950;
        line-height: 1.18;
    }

    .bb-home-service-row-demo small[b-k9o8z149rt] {
        color: var(--bb-home-text-secondary);
        font-size: 0.78rem;
        font-weight: 700;
    }

    .bb-home-service-row-demo em[b-k9o8z149rt] {
        padding: 0.34rem 0.55rem;
        color: var(--bb-home-secondary);
        font-style: normal;
        font-size: 0.68rem;
        font-weight: 950;
        letter-spacing: 0.04em;
        text-transform: uppercase;
        border-radius: 999px;
        background: color-mix(in srgb, var(--bb-home-secondary) 8%, white);
        border: 1px solid color-mix(in srgb, var(--bb-home-secondary) 16%, transparent);
    }

.bb-home-professional-grid-demo[b-k9o8z149rt] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.8rem;
}

    .bb-home-professional-grid-demo div[b-k9o8z149rt] {
        display: grid;
        gap: 0.28rem;
        padding: 1rem;
        border-radius: 20px;
        background: linear-gradient(135deg, color-mix(in srgb, var(--bb-home-primary) 5%, white), rgba(255,255,255,0.84));
        border: 1px solid color-mix(in srgb, var(--bb-home-primary) 9%, var(--bb-home-divider));
    }

    .bb-home-professional-grid-demo strong[b-k9o8z149rt] {
        width: 52px;
        height: 52px;
        display: grid;
        place-items: center;
        color: #ffffff;
        border-radius: 18px;
        background: linear-gradient(135deg, var(--bb-home-primary), var(--bb-home-secondary));
    }

    .bb-home-professional-grid-demo span[b-k9o8z149rt] {
        color: var(--bb-home-text-primary);
        font-weight: 950;
    }

    .bb-home-professional-grid-demo small[b-k9o8z149rt] {
        color: var(--bb-home-text-secondary);
        font-weight: 700;
        line-height: 1.35;
    }

/* Review */
.bb-home-review-status-card[b-k9o8z149rt],
.bb-home-appointment-status-card[b-k9o8z149rt] {
    display: grid;
    gap: 0.85rem;
    padding: 1rem;
    border-radius: 22px;
    background: rgba(255,255,255,0.86);
    border: 1px solid color-mix(in srgb, var(--bb-home-primary) 9%, var(--bb-home-divider));
    box-shadow: 0 14px 34px color-mix(in srgb, var(--bb-home-text-primary) 6%, transparent);
}

.bb-home-review-badge[b-k9o8z149rt] {
    width: fit-content;
    padding: 0.36rem 0.62rem;
    color: #ffffff;
    font-size: 0.64rem;
    font-weight: 950;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--bb-home-primary), var(--bb-home-secondary));
}

.bb-home-review-timeline[b-k9o8z149rt] {
    display: grid;
    gap: 0.7rem;
}

    .bb-home-review-timeline > div[b-k9o8z149rt] {
        position: relative;
        display: grid;
        grid-template-columns: 18px minmax(0, 1fr);
        gap: 0.75rem;
        color: color-mix(in srgb, var(--bb-home-text-secondary) 82%, transparent);
    }

        .bb-home-review-timeline > div:not(:last-child)[b-k9o8z149rt]::after {
            content: "";
            position: absolute;
            left: 8px;
            top: 23px;
            bottom: -8px;
            width: 2px;
            background: color-mix(in srgb, var(--bb-home-divider) 80%, transparent);
        }

    .bb-home-review-timeline span[b-k9o8z149rt] {
        width: 18px;
        height: 18px;
        margin-top: 0.16rem;
        border-radius: 999px;
        border: 3px solid color-mix(in srgb, var(--bb-home-divider) 86%, #cbd5e1);
        background: #ffffff;
        z-index: 1;
    }

    .bb-home-review-timeline .is-complete span[b-k9o8z149rt] {
        border-color: var(--bb-home-success);
        background: var(--bb-home-success);
        box-shadow: 0 0 0 5px color-mix(in srgb, var(--bb-home-success) 12%, transparent);
    }

    .bb-home-review-timeline .is-active span[b-k9o8z149rt] {
        border-color: var(--bb-home-primary);
        background: #ffffff;
        box-shadow: 0 0 0 6px color-mix(in srgb, var(--bb-home-primary) 14%, transparent);
    }

    .bb-home-review-timeline strong[b-k9o8z149rt] {
        color: var(--bb-home-text-primary);
        font-size: 0.9rem;
        font-weight: 950;
    }

    .bb-home-review-timeline small[b-k9o8z149rt] {
        color: var(--bb-home-text-secondary);
        font-size: 0.78rem;
        font-weight: 700;
    }

.bb-home-admin-note-card[b-k9o8z149rt] {
    padding: 0.95rem;
    border-radius: 20px;
    background: color-mix(in srgb, var(--bb-home-secondary) 7%, white);
    border: 1px solid color-mix(in srgb, var(--bb-home-secondary) 14%, transparent);
}

/* Mobile app */
.bb-home-mobile-app-section[b-k9o8z149rt] {
    position: relative;
    overflow: hidden;
    margin-top: 5rem;
    padding: clamp(1.5rem, 4vw, 3rem);
    border-radius: 34px;
    color: #ffffff;
    background: radial-gradient(circle at 12% 18%, color-mix(in srgb, var(--bb-home-secondary) 34%, transparent), transparent 32%), radial-gradient(circle at 86% 12%, color-mix(in srgb, var(--bb-home-gold) 26%, transparent), transparent 28%), linear-gradient(135deg, color-mix(in srgb, var(--bb-home-primary) 96%, #020617), var(--bb-home-primary));
    box-shadow: 0 30px 82px color-mix(in srgb, var(--bb-home-primary) 22%, transparent);
}

    .bb-home-mobile-app-section[b-k9o8z149rt]::before {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(115deg, rgba(255,255,255,0.14), transparent 38%), repeating-linear-gradient(135deg, rgba(255,255,255,0.045) 0 1px, transparent 1px 18px);
        pointer-events: none;
    }

.bb-home-mobile-glow[b-k9o8z149rt] {
    position: absolute;
    border-radius: 999px;
    pointer-events: none;
    filter: blur(8px);
}

.bb-home-mobile-glow-one[b-k9o8z149rt] {
    right: -70px;
    top: -90px;
    width: 250px;
    height: 250px;
    background: color-mix(in srgb, var(--bb-home-secondary) 24%, transparent);
}

.bb-home-mobile-glow-two[b-k9o8z149rt] {
    left: -140px;
    bottom: -170px;
    width: 330px;
    height: 330px;
    background: color-mix(in srgb, var(--bb-home-gold) 18%, transparent);
}

.bb-home-page[b-k9o8z149rt]  .bb-home-mobile-grid {
    position: relative;
    z-index: 2;
    align-items: center;
}

.bb-home-mobile-kicker[b-k9o8z149rt] {
    background: rgba(255,255,255,0.13);
    border: 1px solid rgba(255,255,255,0.16);
    box-shadow: none;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-mobile-title,
.bb-home-page[b-k9o8z149rt]  .bb-home-mobile-text {
    color: #ffffff;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-mobile-text {
    color: rgba(255,255,255,0.82);
}

.bb-home-store-badges[b-k9o8z149rt] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
}

    .bb-home-store-badges span[b-k9o8z149rt] {
        min-width: 170px;
        display: grid;
        grid-template-columns: auto 1fr;
        gap: 0.1rem 0.65rem;
        align-items: center;
        padding: 0.85rem 1rem;
        color: #ffffff;
        border-radius: 16px;
        background: rgba(255,255,255,0.12);
        border: 1px solid rgba(255,255,255,0.18);
        backdrop-filter: blur(14px);
    }

    .bb-home-store-badges .mud-icon-root[b-k9o8z149rt] {
        grid-row: 1 / span 2;
        color: #ffffff !important;
    }

    .bb-home-store-badges strong[b-k9o8z149rt] {
        color: #ffffff;
        font-weight: 950;
        line-height: 1.1;
    }

    .bb-home-store-badges small[b-k9o8z149rt] {
        color: rgba(255,255,255,0.7);
        font-size: 0.74rem;
        font-weight: 850;
    }

.bb-home-phone-preview[b-k9o8z149rt] {
    display: grid;
    place-items: center;
}

.bb-home-phone-shell[b-k9o8z149rt] {
    width: min(300px, 100%);
    padding: 0.8rem;
    border-radius: 38px;
    background: #0f172a;
    border: 1px solid rgba(255,255,255,0.18);
    box-shadow: 0 28px 70px rgba(0,0,0,0.28);
}

.bb-home-phone-speaker[b-k9o8z149rt] {
    width: 76px;
    height: 6px;
    margin: 0.15rem auto 0.7rem;
    border-radius: 999px;
    background: rgba(255,255,255,0.22);
}

.bb-home-phone-screen[b-k9o8z149rt] {
    overflow: hidden;
    display: grid;
    gap: 0.75rem;
    min-height: 430px;
    padding: 1rem;
    border-radius: 30px;
    background: linear-gradient(180deg, #f8fafc, #ffffff);
}

.bb-home-phone-topbar[b-k9o8z149rt] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: var(--bb-home-primary);
}

    .bb-home-phone-topbar .mud-icon-root[b-k9o8z149rt] {
        color: var(--bb-home-primary);
    }

.bb-home-phone-salon-card[b-k9o8z149rt],
.bb-home-phone-booking-card[b-k9o8z149rt] {
    display: grid;
    gap: 0.4rem;
    padding: 0.8rem;
    border-radius: 20px;
    background: var(--bb-home-surface);
    border: 1px solid color-mix(in srgb, var(--bb-home-primary) 10%, var(--bb-home-divider));
    box-shadow: 0 12px 28px color-mix(in srgb, var(--bb-home-text-primary) 7%, transparent);
}

.bb-home-phone-salon-media[b-k9o8z149rt] {
    height: 108px;
    border-radius: 16px;
    background: radial-gradient(circle at 20% 18%, rgba(255,255,255,0.22), transparent 24%), linear-gradient(135deg, var(--bb-home-primary), var(--bb-home-secondary));
}

.bb-home-phone-salon-card strong[b-k9o8z149rt],
.bb-home-phone-booking-card strong[b-k9o8z149rt] {
    color: var(--bb-home-text-primary);
    font-weight: 950;
    line-height: 1.2;
}

.bb-home-phone-salon-card span[b-k9o8z149rt],
.bb-home-phone-booking-card small[b-k9o8z149rt] {
    color: var(--bb-home-text-secondary);
    font-size: 0.78rem;
    font-weight: 750;
}

.bb-home-phone-booking-card > span[b-k9o8z149rt] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    width: fit-content;
    color: var(--bb-home-secondary);
    font-size: 0.7rem;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.bb-home-phone-booking-card .mud-icon-root[b-k9o8z149rt] {
    color: var(--bb-home-secondary);
}

.bb-home-phone-bottom-nav[b-k9o8z149rt] {
    margin-top: auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.45rem;
}

    .bb-home-phone-bottom-nav span[b-k9o8z149rt] {
        height: 42px;
        border-radius: 14px;
        background: color-mix(in srgb, var(--bb-home-primary) 8%, white);
    }

/* Booking widget preview */
.bb-home-booking-widget-demo[b-k9o8z149rt] {
    max-width: 490px;
    margin-inline: auto;
}

.salon-booking-widget[b-k9o8z149rt] {
    --booking-primary: var(--mud-palette-primary);
    --booking-secondary: var(--mud-palette-secondary);
    --booking-surface: var(--mud-palette-surface);
    --booking-background: var(--mud-palette-background);
    --booking-text-primary: var(--mud-palette-text-primary);
    --booking-text-secondary: var(--mud-palette-text-secondary);
    --booking-divider: var(--mud-palette-divider);
    --booking-focus-shadow: color-mix(in srgb, var(--booking-primary) 16%, transparent);
    width: 100%;
}

    .salon-booking-widget .booking-panel[b-k9o8z149rt] {
        position: relative;
        overflow: hidden;
        display: grid;
        gap: 1rem;
        padding: 1.15rem;
        border-radius: 24px;
        background: radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--booking-secondary) 9%, transparent), transparent 28%), radial-gradient(circle at 8% 94%, color-mix(in srgb, var(--booking-primary) 7%, transparent), transparent 30%), linear-gradient(135deg, color-mix(in srgb, var(--booking-surface) 98%, var(--booking-primary)), var(--booking-surface));
        border: 1px solid color-mix(in srgb, var(--booking-primary) 12%, var(--booking-divider));
        box-shadow: 0 18px 44px color-mix(in srgb, var(--booking-text-primary) 7%, transparent);
    }

        .salon-booking-widget .booking-panel[b-k9o8z149rt]::before {
            content: "";
            position: absolute;
            left: 1rem;
            right: 1rem;
            top: 0;
            height: 3px;
            border-radius: 0 0 999px 999px;
            background: linear-gradient(90deg, var(--booking-primary), var(--booking-secondary));
            pointer-events: none;
        }

.booking-widget-header[b-k9o8z149rt] {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.72rem;
    align-items: center;
}

.booking-widget-icon[b-k9o8z149rt] {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--booking-primary), var(--booking-secondary));
    box-shadow: 0 14px 30px color-mix(in srgb, var(--booking-primary) 18%, transparent);
}

.salon-booking-widget .booking-widget-icon .mud-icon-root[b-k9o8z149rt] {
    color: #ffffff;
    font-size: 1.28rem;
}

.salon-booking-widget .booking-widget-title[b-k9o8z149rt] {
    color: var(--booking-text-primary);
    font-size: 1.05rem;
    font-weight: 950;
    line-height: 1.1;
    letter-spacing: -0.025em;
}

.salon-booking-widget .booking-widget-subtitle[b-k9o8z149rt] {
    color: var(--booking-text-secondary);
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1.34;
}

.booking-widget-flow-note[b-k9o8z149rt],
.booking-widget-summary-card[b-k9o8z149rt],
.booking-widget-final-review[b-k9o8z149rt] {
    position: relative;
    z-index: 2;
    display: grid;
    gap: 0.55rem;
    padding: 0.68rem;
    border-radius: 18px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--booking-primary) 5%, var(--booking-surface)), color-mix(in srgb, var(--booking-secondary) 5%, var(--booking-surface)));
    border: 1px solid color-mix(in srgb, var(--booking-primary) 12%, var(--booking-divider));
}

.booking-widget-flow-heading[b-k9o8z149rt] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 0.55rem;
}

.booking-widget-flow-label[b-k9o8z149rt],
.booking-widget-summary-card span[b-k9o8z149rt],
.booking-widget-final-review span[b-k9o8z149rt] {
    width: fit-content;
    padding: 0.26rem 0.54rem;
    color: var(--booking-primary);
    font-size: 0.58rem;
    font-weight: 950;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 0.065em;
    border-radius: 999px;
    background: color-mix(in srgb, var(--booking-primary) 9%, var(--booking-surface));
    border: 1px solid color-mix(in srgb, var(--booking-primary) 10%, var(--booking-divider));
}

.booking-widget-flow-heading strong[b-k9o8z149rt] {
    min-width: 0;
    overflow: hidden;
    color: var(--booking-text-primary);
    font-size: 0.72rem;
    font-weight: 950;
    line-height: 1.16;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.booking-widget-flow-items[b-k9o8z149rt] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.48rem;
}

    .booking-widget-flow-items div[b-k9o8z149rt],
    .booking-widget-flow-item[b-k9o8z149rt] {
        min-width: 0;
        min-height: 58px;
        display: grid;
        grid-template-columns: 26px minmax(0, 1fr);
        grid-template-rows: auto auto;
        align-items: center;
        align-content: center;
        column-gap: 0.48rem;
        row-gap: 0.06rem;
        padding: 0.52rem;
        border-radius: 14px;
        background: color-mix(in srgb, var(--booking-surface) 92%, transparent);
        border: 1px solid color-mix(in srgb, var(--booking-primary) 9%, var(--booking-divider));
    }

    .booking-widget-flow-items span[b-k9o8z149rt] {
        grid-row: 1 / span 2;
        width: 26px;
        height: 26px;
        display: grid;
        place-items: center;
        color: #ffffff;
        font-size: 0.68rem;
        font-weight: 950;
        line-height: 1;
        border-radius: 999px;
        background: linear-gradient(135deg, var(--booking-primary), color-mix(in srgb, var(--booking-primary) 78%, var(--booking-secondary)));
    }

    .booking-widget-flow-items strong[b-k9o8z149rt] {
        min-width: 0;
        overflow: hidden;
        color: var(--booking-text-primary);
        font-size: 0.72rem;
        font-weight: 950;
        line-height: 1.05;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .booking-widget-flow-items small[b-k9o8z149rt] {
        min-width: 0;
        overflow: hidden;
        color: var(--booking-text-secondary);
        font-size: 0.61rem;
        font-weight: 800;
        line-height: 1.1;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.booking-widget-flow-item-active[b-k9o8z149rt] {
    color: #ffffff !important;
    background: linear-gradient(135deg, var(--booking-primary), color-mix(in srgb, var(--booking-primary) 78%, var(--booking-secondary))) !important;
    border-color: color-mix(in srgb, var(--booking-primary) 48%, var(--booking-secondary)) !important;
    box-shadow: 0 12px 26px var(--booking-focus-shadow);
}

    .booking-widget-flow-item-active span[b-k9o8z149rt] {
        background: rgba(255,255,255,0.18) !important;
        border: 1px solid rgba(255,255,255,0.18);
    }

    .booking-widget-flow-item-active strong[b-k9o8z149rt],
    .booking-widget-flow-item-active small[b-k9o8z149rt] {
        color: #ffffff !important;
    }

.booking-widget-summary-card strong[b-k9o8z149rt],
.booking-widget-final-review strong[b-k9o8z149rt] {
    overflow: hidden;
    color: var(--booking-text-primary);
    font-size: 0.78rem;
    font-weight: 950;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.booking-widget-date-shortcuts[b-k9o8z149rt],
.booking-slot-grid[b-k9o8z149rt] {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.48rem;
}

.booking-slot-grid[b-k9o8z149rt] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.booking-widget-date-shortcut[b-k9o8z149rt],
.booking-slot-card[b-k9o8z149rt] {
    min-width: 0;
    display: grid;
    gap: 0.16rem;
    padding: 0.58rem 0.64rem;
    color: var(--booking-text-primary);
    font-family: inherit;
    text-align: left;
    border-radius: 14px;
    background: color-mix(in srgb, var(--booking-surface) 92%, transparent);
    border: 1px solid color-mix(in srgb, var(--booking-primary) 10%, var(--booking-divider));
    cursor: pointer;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--booking-text-primary) 4%, transparent);
}

.booking-slot-card[b-k9o8z149rt] {
    min-height: 48px;
    align-content: center;
    background: linear-gradient(135deg, color-mix(in srgb, white 62%, var(--booking-surface)), color-mix(in srgb, var(--booking-primary) 5%, var(--booking-surface)));
}

    .booking-widget-date-shortcut strong[b-k9o8z149rt],
    .booking-slot-card span[b-k9o8z149rt] {
        color: var(--booking-text-primary);
        font-size: 0.74rem;
        font-weight: 950;
        line-height: 1.12;
    }

    .booking-widget-date-shortcut span[b-k9o8z149rt],
    .booking-slot-card small[b-k9o8z149rt] {
        color: var(--booking-text-secondary);
        font-size: 0.62rem;
        font-weight: 800;
        line-height: 1.1;
    }

.booking-widget-date-shortcut-active[b-k9o8z149rt],
.booking-slot-card-selected[b-k9o8z149rt] {
    color: #ffffff;
    background: linear-gradient(135deg, var(--booking-primary), color-mix(in srgb, var(--booking-primary) 84%, var(--booking-secondary)));
    border-color: color-mix(in srgb, var(--booking-primary) 56%, var(--booking-secondary));
    box-shadow: 0 16px 30px color-mix(in srgb, var(--booking-primary) 16%, transparent);
}

    .booking-widget-date-shortcut-active strong[b-k9o8z149rt],
    .booking-widget-date-shortcut-active span[b-k9o8z149rt],
    .booking-slot-card-selected span[b-k9o8z149rt],
    .booking-slot-card-selected small[b-k9o8z149rt] {
        color: #ffffff;
    }

.booking-widget-selected-slot[b-k9o8z149rt] {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.72rem;
    align-items: center;
    padding: 0.72rem;
    border-radius: 16px;
    color: var(--booking-text-primary);
    background: linear-gradient(135deg, color-mix(in srgb, var(--bb-home-success) 11%, var(--booking-surface)), color-mix(in srgb, white 62%, var(--booking-surface)));
    border: 1px solid color-mix(in srgb, var(--bb-home-success) 22%, var(--booking-divider));
}

    .booking-widget-selected-slot .mud-icon-root[b-k9o8z149rt] {
        color: var(--bb-home-success);
        font-size: 1.45rem;
    }

    .booking-widget-selected-slot div[b-k9o8z149rt] {
        display: grid;
        gap: 0.1rem;
        min-width: 0;
    }

    .booking-widget-selected-slot span[b-k9o8z149rt] {
        color: var(--booking-text-secondary);
        font-size: 0.7rem;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 0.06em;
    }

    .booking-widget-selected-slot strong[b-k9o8z149rt] {
        color: var(--booking-text-primary);
        font-size: 0.92rem;
        font-weight: 950;
        line-height: 1.22;
    }

.salon-booking-widget .booking-widget-confirm-button[b-k9o8z149rt] {
    position: relative;
    z-index: 2;
    min-height: 46px;
    border-radius: 14px !important;
    font-size: 0.78rem;
    font-weight: 950;
    box-shadow: 0 14px 30px color-mix(in srgb, var(--booking-secondary) 20%, transparent);
}

    .salon-booking-widget .booking-widget-confirm-button .mud-button-label[b-k9o8z149rt],
    .salon-booking-widget .booking-widget-confirm-button .mud-icon-root[b-k9o8z149rt] {
        color: #ffffff !important;
    }

/* Notifications and appointment status */
.bb-home-notification-preview[b-k9o8z149rt] {
    display: grid;
    gap: 0.65rem;
    padding: 1rem;
    border-radius: 24px;
    background: radial-gradient(circle at 18% 0%, color-mix(in srgb, var(--bb-home-primary) 10%, transparent), transparent 30%), radial-gradient(circle at 90% 8%, color-mix(in srgb, var(--bb-home-secondary) 12%, transparent), transparent 32%), var(--bb-home-surface);
    border: 1px solid color-mix(in srgb, var(--bb-home-primary) 12%, var(--bb-home-divider));
    box-shadow: 0 18px 46px color-mix(in srgb, var(--bb-home-primary) 12%, transparent);
}

.bb-home-notification-header[b-k9o8z149rt] {
    grid-template-columns: minmax(0, 1fr) auto;
    padding-bottom: 0.4rem;
    border-bottom: 1px solid color-mix(in srgb, var(--bb-home-divider) 72%, transparent);
}

    .bb-home-notification-header .mud-icon-root[b-k9o8z149rt] {
        color: var(--bb-home-primary);
    }

.bb-home-notification-item[b-k9o8z149rt] {
    position: relative;
    display: grid;
    gap: 0.3rem;
    padding: 0.85rem 2.2rem 0.85rem 0.85rem;
    border-radius: 14px;
    background: transparent;
}

    .bb-home-notification-item.is-unread[b-k9o8z149rt] {
        background: linear-gradient(135deg, color-mix(in srgb, var(--bb-home-primary) 8%, transparent), color-mix(in srgb, var(--bb-home-secondary) 6%, transparent));
    }

    .bb-home-notification-item strong[b-k9o8z149rt] {
        color: var(--bb-home-text-primary);
        font-size: 0.9rem;
        font-weight: 950;
        line-height: 1.25;
    }

    .bb-home-notification-item span[b-k9o8z149rt] {
        color: var(--bb-home-text-secondary);
        font-size: 0.82rem;
        font-weight: 650;
        line-height: 1.42;
    }

    .bb-home-notification-item small[b-k9o8z149rt] {
        color: color-mix(in srgb, var(--bb-home-text-secondary) 78%, transparent);
        font-size: 0.74rem;
        font-weight: 750;
    }

    .bb-home-notification-item i[b-k9o8z149rt] {
        position: absolute;
        top: 1rem;
        right: 1rem;
        width: 10px;
        height: 10px;
        border-radius: 999px;
        background: var(--bb-home-secondary);
        box-shadow: 0 0 0 5px color-mix(in srgb, var(--bb-home-secondary) 14%, transparent);
    }

.bb-home-appointment-timeline[b-k9o8z149rt] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.7rem;
}

    .bb-home-appointment-timeline div[b-k9o8z149rt] {
        display: grid;
        place-items: center;
        gap: 0.35rem;
        text-align: center;
        color: color-mix(in srgb, var(--bb-home-text-secondary) 80%, transparent);
    }

    .bb-home-appointment-timeline span[b-k9o8z149rt] {
        width: 18px;
        height: 18px;
        border-radius: 999px;
        border: 3px solid color-mix(in srgb, var(--bb-home-divider) 86%, #cbd5e1);
        background: #ffffff;
    }

    .bb-home-appointment-timeline .is-complete span[b-k9o8z149rt] {
        border-color: var(--bb-home-success);
        background: var(--bb-home-success);
        box-shadow: 0 0 0 5px color-mix(in srgb, var(--bb-home-success) 12%, transparent);
    }

    .bb-home-appointment-timeline .is-active span[b-k9o8z149rt] {
        border-color: var(--bb-home-primary);
        background: #ffffff;
        box-shadow: 0 0 0 6px color-mix(in srgb, var(--bb-home-primary) 14%, transparent);
    }

    .bb-home-appointment-timeline strong[b-k9o8z149rt] {
        color: var(--bb-home-text-primary);
        font-size: 0.78rem;
        font-weight: 900;
    }

.bb-home-appointment-actions[b-k9o8z149rt] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.6rem;
}

    .bb-home-appointment-actions button[b-k9o8z149rt] {
        min-height: 42px;
        color: #ffffff;
        font-family: inherit;
        font-size: 0.74rem;
        font-weight: 950;
        letter-spacing: 0.05em;
        text-transform: uppercase;
        border: 0;
        border-radius: 12px;
        background: linear-gradient(135deg, var(--bb-home-primary), var(--bb-home-secondary));
        cursor: default;
    }

        .bb-home-appointment-actions button + button[b-k9o8z149rt] {
            color: var(--bb-home-primary);
            background: color-mix(in srgb, var(--bb-home-primary) 8%, white);
            border: 1px solid color-mix(in srgb, var(--bb-home-primary) 14%, transparent);
        }

/* Customer cards */
.bb-home-customer-grid[b-k9o8z149rt] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.bb-home-customer-card[b-k9o8z149rt] {
    display: grid;
    gap: 0.6rem;
    min-height: 210px;
    padding: 1.25rem;
    border-radius: 24px;
    background: linear-gradient(145deg, var(--bb-home-surface), color-mix(in srgb, var(--bb-home-background) 70%, var(--bb-home-surface)));
    border: 1px solid color-mix(in srgb, var(--bb-home-primary) 8%, var(--bb-home-divider));
    box-shadow: 0 16px 40px color-mix(in srgb, var(--bb-home-text-primary) 6%, transparent);
}

    .bb-home-customer-card > span[b-k9o8z149rt] {
        width: 54px;
        height: 54px;
        display: grid;
        place-items: center;
        border-radius: 18px;
        background: linear-gradient(135deg, var(--bb-home-primary), var(--bb-home-secondary));
        box-shadow: 0 14px 30px color-mix(in srgb, var(--bb-home-primary) 18%, transparent);
    }

    .bb-home-customer-card .mud-icon-root[b-k9o8z149rt] {
        color: #ffffff;
    }

    .bb-home-customer-card strong[b-k9o8z149rt] {
        color: var(--bb-home-text-primary);
        font-size: 1.1rem;
        font-weight: 950;
        line-height: 1.15;
    }

    .bb-home-customer-card p[b-k9o8z149rt] {
        margin: 0;
        color: var(--bb-home-text-secondary);
        font-size: 0.9rem;
        font-weight: 630;
        line-height: 1.48;
    }

/* Final CTA */
.bb-home-final-cta-section[b-k9o8z149rt] {
    position: relative;
    overflow: hidden;
    margin-top: 5rem;
    padding: clamp(1.5rem, 4vw, 3rem);
    border-radius: 34px;
    background: radial-gradient(circle at 90% 16%, color-mix(in srgb, var(--bb-home-secondary) 12%, transparent), transparent 30%), linear-gradient(135deg, var(--bb-home-surface), color-mix(in srgb, var(--bb-home-primary) 4%, var(--bb-home-surface)));
    border: 1px solid color-mix(in srgb, var(--bb-home-primary) 8%, var(--bb-home-divider));
    box-shadow: 0 22px 58px color-mix(in srgb, var(--bb-home-text-primary) 7%, transparent);
}

.bb-home-final-cta-glow[b-k9o8z149rt] {
    position: absolute;
    right: -90px;
    bottom: -110px;
    width: 260px;
    height: 260px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--bb-home-primary) 9%, transparent);
    pointer-events: none;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-final-grid {
    position: relative;
    z-index: 2;
    align-items: center;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-final-card {
    display: grid;
    gap: 0.9rem;
    padding: 1.35rem;
    border-radius: 24px;
    background: color-mix(in srgb, var(--bb-home-surface) 98%, transparent);
    border: 1px solid color-mix(in srgb, var(--bb-home-primary) 10%, var(--bb-home-divider));
    box-shadow: 0 18px 48px color-mix(in srgb, var(--bb-home-text-primary) 7%, transparent);
}

.bb-home-page[b-k9o8z149rt]  .bb-home-final-card-title {
    color: var(--bb-home-text-primary);
    font-weight: 950;
    line-height: 1.14;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-final-card-text {
    color: var(--bb-home-text-secondary);
    font-weight: 630;
    line-height: 1.5;
}

@keyframes bb-home-cta-pulse-b-k9o8z149rt {
    0%, 100% {
        transform: translateY(0);
        box-shadow: 0 18px 40px color-mix(in srgb, var(--bb-home-primary) 24%, transparent);
    }

    50% {
        transform: translateY(-1px);
        box-shadow: 0 24px 52px color-mix(in srgb, var(--bb-home-primary) 30%, transparent);
    }
}

@keyframes bb-home-cta-shine-b-k9o8z149rt {
    0%, 58% {
        opacity: 0;
        transform: translateX(0) rotate(18deg);
    }

    68% {
        opacity: 0.85;
    }

    86%, 100% {
        opacity: 0;
        transform: translateX(360%) rotate(18deg);
    }
}

@keyframes bb-home-card-shine-b-k9o8z149rt {
    0%, 58% {
        opacity: 0;
        transform: translateX(0) rotate(18deg);
    }

    68% {
        opacity: 0.85;
    }

    86%, 100% {
        opacity: 0;
        transform: translateX(360%) rotate(18deg);
    }
}

@keyframes bb-home-card-sparkle-b-k9o8z149rt {
    0%, 66%, 100% {
        opacity: 0;
        transform: translate3d(0, 0, 0) scale(1);
    }

    72% {
        opacity: 0.72;
        transform: translate3d(0, -2px, 0) scale(1.01);
    }

    82% {
        opacity: 0.2;
        transform: translate3d(0, -5px, 0) scale(1.025);
    }
}

@media (prefers-reduced-motion: reduce) {
    .bb-home-page[b-k9o8z149rt]  .bb-home-primary-cta,
    .bb-home-page[b-k9o8z149rt]  .bb-home-card-cta,
    .bb-home-page[b-k9o8z149rt]  .bb-home-primary-cta::after,
    .bb-home-page[b-k9o8z149rt]  .bb-home-card-cta::after,
    .bb-home-preview-media[b-k9o8z149rt]::after,
    .bb-home-preview-media-overlay[b-k9o8z149rt]::after,
    .bb-home-salon-card-demo .salon-card-media-with-image[b-k9o8z149rt]::after {
        animation: none !important;
    }
}

@media (max-width: 1280px) {
    .bb-home-hero-section[b-k9o8z149rt] {
        padding: 2.2rem 2rem 4rem;
    }

    .bb-home-page[b-k9o8z149rt]  .bb-home-hero-title {
        font-size: clamp(2.35rem, 4.5vw, 3.65rem);
    }

    .bb-home-page[b-k9o8z149rt]  .bb-home-search-card {
        margin-top: -4.85rem;
    }

    .bb-home-product-strip[b-k9o8z149rt],
    .bb-home-customer-grid[b-k9o8z149rt] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1060px) {
    .bb-home-walkthrough[b-k9o8z149rt],
    .bb-home-walkthrough-reverse[b-k9o8z149rt] {
        grid-template-columns: 1fr;
    }

        .bb-home-walkthrough-reverse .bb-home-walkthrough-visual[b-k9o8z149rt],
        .bb-home-walkthrough-reverse .bb-home-walkthrough-copy[b-k9o8z149rt] {
            order: initial;
        }

    .bb-home-walkthrough-copy[b-k9o8z149rt] {
        max-width: 760px;
    }
}

@media (max-width: 960px) {
    .bb-home-hero-section[b-k9o8z149rt] {
        overflow: hidden;
        padding: 1.6rem 1.45rem 1.4rem;
        margin-bottom: 0;
        border-radius: 30px;
    }

    .bb-home-page[b-k9o8z149rt]  .bb-home-showcase-card {
        margin-top: 1rem;
        padding: 1.4rem;
        border-radius: 28px;
    }

    .bb-home-page[b-k9o8z149rt]  .bb-home-search-card {
        width: 100%;
        margin: 1.25rem 0 3rem;
    }

    .bb-home-product-strip[b-k9o8z149rt],
    .bb-home-customer-grid[b-k9o8z149rt] {
        grid-template-columns: 1fr;
    }

    .owner-premium-hero-compact-grid[b-k9o8z149rt],
    .owner-premium-step-nav[b-k9o8z149rt] {
        grid-template-columns: 1fr;
    }

    .bb-home-mobile-app-section[b-k9o8z149rt],
    .bb-home-final-cta-section[b-k9o8z149rt] {
        border-radius: 28px;
    }
}

@media (max-width: 700px) {
    .bb-home-page[b-k9o8z149rt] {
        padding-bottom: 3rem;
    }

    .bb-home-hero-section[b-k9o8z149rt] {
        padding: 1.25rem 1rem 1.1rem;
        border-radius: 24px;
    }

        .bb-home-hero-section[b-k9o8z149rt]::after {
            left: 1rem;
            right: 1rem;
            top: 1rem;
        }

    .bb-home-page[b-k9o8z149rt]  .bb-home-hero-title {
        font-size: 2.35rem;
        letter-spacing: -0.05em;
    }

    .bb-home-page[b-k9o8z149rt]  .bb-home-hero-subtitle {
        font-size: 0.96rem;
    }

    .bb-home-page[b-k9o8z149rt]  .bb-home-search-card {
        padding: 0.9rem;
        border-radius: 22px;
        margin-top: 1.15rem;
    }

    .bb-home-search-action[b-k9o8z149rt],
    .bb-home-search-icon-button[b-k9o8z149rt] {
        justify-content: stretch;
        min-height: 48px;
        height: 48px;
        width: 100%;
    }

    .bb-home-page[b-k9o8z149rt]  .bb-home-hero-actions .mud-button-root,
    .bb-home-page[b-k9o8z149rt]  .bb-home-inline-cta {
        width: 100%;
    }

    .bb-home-trust-row[b-k9o8z149rt],
    .bb-home-showcase-top[b-k9o8z149rt] {
        display: grid;
    }

    .bb-home-preview-media[b-k9o8z149rt] {
        min-height: 165px;
    }

    .bb-home-preview-mini-actions[b-k9o8z149rt],
    .bb-home-professional-grid-demo[b-k9o8z149rt],
    .booking-widget-date-shortcuts[b-k9o8z149rt],
    .booking-slot-grid[b-k9o8z149rt],
    .bb-home-appointment-actions[b-k9o8z149rt] {
        grid-template-columns: 1fr;
    }

    .bb-home-guided-section[b-k9o8z149rt],
    .bb-home-customer-section[b-k9o8z149rt] {
        gap: 3rem;
        margin-top: 3.5rem;
    }

    .bb-home-mobile-app-section[b-k9o8z149rt],
    .bb-home-final-cta-section[b-k9o8z149rt] {
        margin-top: 3.5rem;
        padding: 1.15rem;
        border-radius: 24px;
    }

    .bb-home-store-badges[b-k9o8z149rt] {
        display: grid;
    }

    .bb-home-phone-shell[b-k9o8z149rt] {
        width: 100%;
        max-width: 290px;
    }

    .bb-home-customer-card[b-k9o8z149rt],
    .bb-home-product-strip-card[b-k9o8z149rt] {
        min-height: auto;
    }
}

/* CSS isolation deep fixes for MudBlazor-rendered elements inside the Home previews */
.bb-home-page[b-k9o8z149rt]  .owner-premium-status-avatar {
    width: 34px !important;
    height: 34px !important;
    background: var(--bb-home-gold) !important;
}

    .bb-home-page[b-k9o8z149rt]  .owner-premium-status-avatar .mud-icon-root,
    .bb-home-page[b-k9o8z149rt]  .owner-premium-kicker-icon .mud-icon-root,
    .bb-home-page[b-k9o8z149rt]  .booking-widget-icon .mud-icon-root,
    .bb-home-page[b-k9o8z149rt]  .bb-home-phone-topbar .mud-icon-root,
    .bb-home-page[b-k9o8z149rt]  .bb-home-phone-booking-card .mud-icon-root,
    .bb-home-page[b-k9o8z149rt]  .bb-home-customer-card .mud-icon-root,
    .bb-home-page[b-k9o8z149rt]  .bb-home-demo-panel-heading .mud-icon-root,
    .bb-home-page[b-k9o8z149rt]  .bb-home-preview-badge .mud-icon-root {
        color: #ffffff !important;
    }

.bb-home-page[b-k9o8z149rt]  .owner-premium-status-progress {
    height: 5px !important;
}

.bb-home-page[b-k9o8z149rt]  .booking-widget-title {
    color: var(--bb-home-text-primary) !important;
    font-size: 1.05rem !important;
    font-weight: 950 !important;
    line-height: 1.1 !important;
    letter-spacing: -0.025em !important;
}

.bb-home-page[b-k9o8z149rt]  .booking-widget-subtitle {
    color: var(--bb-home-text-secondary) !important;
    font-size: 0.78rem !important;
    font-weight: 600 !important;
    line-height: 1.34 !important;
}

.bb-home-page[b-k9o8z149rt]  .booking-widget-confirm-button {
    position: relative !important;
    z-index: 2 !important;
    min-height: 46px !important;
    border-radius: 14px !important;
    font-size: 0.78rem !important;
    font-weight: 950 !important;
    box-shadow: 0 14px 30px color-mix(in srgb, var(--bb-home-secondary) 20%, transparent) !important;
}

    .bb-home-page[b-k9o8z149rt]  .booking-widget-confirm-button .mud-button-label,
    .bb-home-page[b-k9o8z149rt]  .booking-widget-confirm-button .mud-icon-root {
        color: #ffffff !important;
    }

.bb-home-page[b-k9o8z149rt]  .salon-card-media-bottom .mud-typography {
    color: rgba(255,255,255,0.86) !important;
    font-weight: 900 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
}

.bb-home-page[b-k9o8z149rt]  .owner-premium-hero-title,
.bb-home-page[b-k9o8z149rt]  .owner-premium-hero-subtitle {
    color: #ffffff !important;
}


/* BB-HOME-GUIDE-LANDING-01 iteration 02: real product visuals, early-access energy and public-card alignment */
.bb-home-preview-media[b-k9o8z149rt],
.bb-home-salon-card-demo .salon-card-media-with-image[b-k9o8z149rt],
.bb-home-phone-salon-media[b-k9o8z149rt] {
    background-image: linear-gradient(180deg, rgba(15, 23, 42, 0.08), rgba(15, 23, 42, 0.68)), radial-gradient(circle at 82% 16%, color-mix(in srgb, var(--bb-home-gold) 30%, transparent), transparent 30%), radial-gradient(circle at 18% 92%, color-mix(in srgb, var(--bb-home-primary) 28%, transparent), transparent 34%), url("/images/home/salon-team-preview.webp") !important;
    background-size: cover !important;
    background-position: center !important;
}

    .bb-home-preview-media:hover[b-k9o8z149rt],
    .bb-home-salon-card-demo .salon-card-media-with-image:hover[b-k9o8z149rt] {
        background-image: linear-gradient(180deg, rgba(15, 23, 42, 0.02), rgba(15, 23, 42, 0.38)), radial-gradient(circle at 82% 16%, color-mix(in srgb, var(--bb-home-gold) 34%, transparent), transparent 30%), radial-gradient(circle at 18% 92%, color-mix(in srgb, var(--bb-home-primary) 24%, transparent), transparent 34%), url("/images/home/salon-team-preview.webp") !important;
    }

.bb-home-product-strip-card[b-k9o8z149rt] {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

    .bb-home-product-strip-card[b-k9o8z149rt]::before {
        content: "";
        position: absolute;
        inset: 0 auto 0 0;
        width: 5px;
        background: var(--bb-home-primary);
    }

    .bb-home-product-strip-card[b-k9o8z149rt]::after {
        content: "";
        position: absolute;
        right: -54px;
        top: -64px;
        width: 140px;
        height: 140px;
        border-radius: 999px;
        background: color-mix(in srgb, var(--strip-accent, var(--bb-home-primary)) 12%, transparent);
        pointer-events: none;
    }

    .bb-home-product-strip-card:hover[b-k9o8z149rt] {
        transform: translateY(-3px);
        border-color: color-mix(in srgb, var(--strip-accent, var(--bb-home-primary)) 24%, var(--bb-home-divider));
        box-shadow: 0 22px 54px color-mix(in srgb, var(--strip-accent, var(--bb-home-primary)) 13%, transparent);
    }

    .bb-home-product-strip-card:nth-child(1)[b-k9o8z149rt] {
        --strip-accent: var(--bb-home-primary);
        background: linear-gradient(145deg, color-mix(in srgb, var(--bb-home-primary) 7%, white), var(--bb-home-surface));
    }

    .bb-home-product-strip-card:nth-child(2)[b-k9o8z149rt] {
        --strip-accent: var(--bb-home-gold);
        background: linear-gradient(145deg, color-mix(in srgb, var(--bb-home-gold) 13%, white), var(--bb-home-surface));
    }

    .bb-home-product-strip-card:nth-child(3)[b-k9o8z149rt] {
        --strip-accent: var(--bb-home-secondary);
        background: linear-gradient(145deg, color-mix(in srgb, var(--bb-home-secondary) 9%, white), var(--bb-home-surface));
    }

    .bb-home-product-strip-card:nth-child(4)[b-k9o8z149rt] {
        --strip-accent: var(--bb-home-info);
        background: linear-gradient(145deg, color-mix(in srgb, var(--bb-home-info) 8%, white), var(--bb-home-surface));
    }

    .bb-home-product-strip-card .mud-icon-root[b-k9o8z149rt] {
        position: relative;
        z-index: 2;
        width: 42px;
        height: 42px;
        display: grid;
        place-items: center;
        padding: 0.55rem;
        color: #ffffff !important;
        border-radius: 14px;
        background: linear-gradient(135deg, var(--strip-accent, var(--bb-home-primary)), color-mix(in srgb, var(--strip-accent, var(--bb-home-primary)) 72%, var(--bb-home-primary)));
        box-shadow: 0 12px 24px color-mix(in srgb, var(--strip-accent, var(--bb-home-primary)) 20%, transparent);
    }

.bb-home-early-access-banner[b-k9o8z149rt] {
    width: min(1180px, 100%);
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
    margin: 2rem auto 0;
    padding: 1rem;
    border-radius: 24px;
    border: 1px solid color-mix(in srgb, var(--bb-home-gold) 22%, var(--bb-home-divider));
    background: radial-gradient(circle at 94% 8%, color-mix(in srgb, var(--bb-home-gold) 18%, transparent), transparent 28%), linear-gradient(135deg, color-mix(in srgb, var(--bb-home-primary) 6%, var(--bb-home-surface)), color-mix(in srgb, var(--bb-home-gold) 12%, var(--bb-home-surface)));
    box-shadow: 0 18px 46px color-mix(in srgb, var(--bb-home-primary) 9%, transparent);
}

.bb-home-early-access-customer[b-k9o8z149rt] {
    margin-top: 0;
    margin-bottom: 2rem;
    background: radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--bb-home-secondary) 16%, transparent), transparent 28%), linear-gradient(135deg, color-mix(in srgb, var(--bb-home-secondary) 8%, var(--bb-home-surface)), color-mix(in srgb, var(--bb-home-gold) 9%, var(--bb-home-surface)));
}

.bb-home-early-access-icon[b-k9o8z149rt] {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    color: #ffffff;
    border-radius: 18px;
    background: linear-gradient(135deg, var(--bb-home-primary), var(--bb-home-gold));
    box-shadow: 0 15px 30px color-mix(in srgb, var(--bb-home-primary) 18%, transparent);
}

.bb-home-page[b-k9o8z149rt]  .bb-home-early-access-icon .mud-icon-root {
    color: #ffffff !important;
}

.bb-home-early-access-copy[b-k9o8z149rt] {
    min-width: 0;
    display: grid;
    gap: 0.18rem;
}

    .bb-home-early-access-copy span[b-k9o8z149rt] {
        color: var(--bb-home-gold);
        font-size: 0.72rem;
        font-weight: 950;
        letter-spacing: 0.09em;
        text-transform: uppercase;
    }

    .bb-home-early-access-copy strong[b-k9o8z149rt] {
        color: var(--bb-home-text-primary);
        font-size: clamp(1.05rem, 1.5vw, 1.42rem);
        font-weight: 950;
        line-height: 1.18;
        letter-spacing: -0.025em;
    }

    .bb-home-early-access-copy p[b-k9o8z149rt] {
        max-width: 820px;
        margin: 0;
        color: var(--bb-home-text-secondary);
        font-size: 0.9rem;
        font-weight: 640;
        line-height: 1.45;
    }

.bb-home-page[b-k9o8z149rt]  .bb-home-early-access-cta {
    white-space: nowrap;
}

.bb-home-salon-card-demo .salon-card[b-k9o8z149rt] {
    border-radius: 24px !important;
    background: var(--bb-home-surface) !important;
}

.bb-home-salon-card-demo .salon-card-media[b-k9o8z149rt] {
    min-height: 190px !important;
}

.bb-home-salon-card-demo .salon-card-content[b-k9o8z149rt] {
    padding: 1.05rem 1.15rem 0.9rem !important;
}

.bb-home-salon-card-demo .salon-card-footer[b-k9o8z149rt] {
    padding: 0 1.15rem 1.15rem !important;
}

.bb-home-salon-card-demo .salon-card-title[b-k9o8z149rt] {
    font-size: 1.26rem !important;
    letter-spacing: -0.035em !important;
}

.bb-home-salon-card-demo .salon-card-price-pill[b-k9o8z149rt],
.bb-home-salon-card-demo .salon-card-review-pill[b-k9o8z149rt],
.bb-home-salon-card-demo .bb-home-salon-card-services span[b-k9o8z149rt] {
    color: var(--bb-home-primary) !important;
    background: color-mix(in srgb, var(--bb-home-gold) 10%, var(--bb-home-surface)) !important;
    border-color: color-mix(in srgb, var(--bb-home-gold) 22%, var(--bb-home-divider)) !important;
}

.bb-home-setup-flow-shell[b-k9o8z149rt] {
    overflow: hidden;
    padding: 0.86rem !important;
    border-radius: 18px !important;
}

.bb-home-setup-flow-heading[b-k9o8z149rt] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.8rem;
    margin-bottom: 0.68rem;
    padding-inline: 0.12rem;
}

    .bb-home-setup-flow-heading span[b-k9o8z149rt] {
        color: var(--bb-home-gold);
        font-size: 0.66rem;
        font-weight: 950;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .bb-home-setup-flow-heading strong[b-k9o8z149rt] {
        color: var(--bb-home-primary);
        font-size: 0.78rem;
        font-weight: 950;
    }

.bb-home-setup-step-marquee[b-k9o8z149rt] {
    overflow: hidden;
    width: 100%;
    mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}

.bb-home-setup-step-track[b-k9o8z149rt] {
    width: max-content;
    display: flex;
    gap: 0.55rem;
    animation: bb-home-setup-step-slide-b-k9o8z149rt 28s linear infinite;
}

.bb-home-setup-step-marquee:hover .bb-home-setup-step-track[b-k9o8z149rt] {
    animation-play-state: paused;
}

.bb-home-setup-step-pill[b-k9o8z149rt] {
    min-width: 145px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 0.5rem;
    row-gap: 0.05rem;
    align-items: center;
    padding: 0.65rem;
    color: var(--bb-home-text-primary);
    border-radius: 15px;
    border: 1px solid color-mix(in srgb, var(--bb-home-primary) 10%, var(--bb-home-divider));
    background: rgba(255, 255, 255, 0.78);
    box-shadow: 0 10px 22px color-mix(in srgb, var(--bb-home-primary) 5%, transparent);
}

    .bb-home-setup-step-pill .mud-icon-root[b-k9o8z149rt] {
        grid-row: 1 / span 2;
        width: 34px;
        height: 34px;
        padding: 0.45rem;
        color: var(--bb-home-primary);
        border-radius: 12px;
        background: color-mix(in srgb, var(--bb-home-primary) 7%, white);
    }

    .bb-home-setup-step-pill strong[b-k9o8z149rt] {
        overflow: hidden;
        color: var(--bb-home-text-primary);
        font-size: 0.76rem;
        font-weight: 950;
        line-height: 1.1;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .bb-home-setup-step-pill small[b-k9o8z149rt] {
        overflow: hidden;
        color: var(--bb-home-text-secondary);
        font-size: 0.64rem;
        font-weight: 760;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .bb-home-setup-step-pill.is-complete[b-k9o8z149rt] {
        border-color: color-mix(in srgb, var(--bb-home-success) 24%, var(--bb-home-divider));
        background: linear-gradient(135deg, color-mix(in srgb, var(--bb-home-success) 10%, white), rgba(255,255,255,0.82));
    }

        .bb-home-setup-step-pill.is-complete .mud-icon-root[b-k9o8z149rt] {
            color: #ffffff;
            background: var(--bb-home-success);
        }

    .bb-home-setup-step-pill.is-active[b-k9o8z149rt] {
        color: #ffffff;
        border-color: color-mix(in srgb, var(--bb-home-primary) 50%, var(--bb-home-gold));
        background: linear-gradient(135deg, var(--bb-home-primary), color-mix(in srgb, var(--bb-home-primary) 76%, var(--bb-home-gold)));
    }

        .bb-home-setup-step-pill.is-active strong[b-k9o8z149rt],
        .bb-home-setup-step-pill.is-active small[b-k9o8z149rt],
        .bb-home-setup-step-pill.is-active .mud-icon-root[b-k9o8z149rt] {
            color: #ffffff;
        }

        .bb-home-setup-step-pill.is-active .mud-icon-root[b-k9o8z149rt] {
            background: rgba(255,255,255,0.16);
        }

.bb-home-feature-list[b-k9o8z149rt] {
    gap: 0.62rem;
}

    .bb-home-feature-list span[b-k9o8z149rt] {
        min-height: 42px;
        padding: 0.62rem 0.72rem;
        border-radius: 14px;
        color: var(--bb-home-text-primary);
        background: linear-gradient(135deg, color-mix(in srgb, var(--bb-home-primary) 5%, white), color-mix(in srgb, var(--bb-home-gold) 7%, white));
        border: 1px solid color-mix(in srgb, var(--bb-home-primary) 9%, var(--bb-home-divider));
        box-shadow: 0 10px 22px color-mix(in srgb, var(--bb-home-primary) 4%, transparent);
    }

        .bb-home-feature-list span:nth-child(2n)[b-k9o8z149rt] {
            background: linear-gradient(135deg, color-mix(in srgb, var(--bb-home-secondary) 7%, white), color-mix(in srgb, var(--bb-home-primary) 4%, white));
        }

        .bb-home-feature-list span:nth-child(3n)[b-k9o8z149rt] {
            background: linear-gradient(135deg, color-mix(in srgb, var(--bb-home-gold) 12%, white), color-mix(in srgb, var(--bb-home-primary) 4%, white));
        }

    .bb-home-feature-list .mud-icon-root[b-k9o8z149rt] {
        width: 24px;
        height: 24px;
        padding: 0.25rem;
        color: #ffffff !important;
        border-radius: 999px;
        background: linear-gradient(135deg, var(--bb-home-primary), var(--bb-home-gold));
    }

.bb-home-store-badges span[b-k9o8z149rt] {
    min-width: 210px;
    background: rgba(255,255,255,0.14);
}

.bb-home-customer-notification-showcase[b-k9o8z149rt] {
    width: min(1120px, 100%);
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
    gap: clamp(1.2rem, 3vw, 3rem);
    align-items: center;
    margin: 0 auto 0;
}

.bb-home-customer-phone-card[b-k9o8z149rt] {
    position: relative;
    overflow: hidden;
    max-width: 420px;
    margin-inline: auto;
    display: grid;
    gap: 0.85rem;
    padding: 1rem;
    border-radius: 28px;
    background: radial-gradient(circle at 88% 10%, color-mix(in srgb, var(--bb-home-secondary) 12%, transparent), transparent 28%), linear-gradient(145deg, var(--bb-home-surface), color-mix(in srgb, var(--bb-home-background) 74%, var(--bb-home-surface)));
    border: 1px solid color-mix(in srgb, var(--bb-home-primary) 10%, var(--bb-home-divider));
    box-shadow: 0 24px 58px color-mix(in srgb, var(--bb-home-primary) 12%, transparent);
}

    .bb-home-customer-phone-card[b-k9o8z149rt]::before {
        content: "";
        position: absolute;
        left: 1.1rem;
        right: 1.1rem;
        top: 0;
        height: 4px;
        border-radius: 0 0 999px 999px;
        background: linear-gradient(90deg, var(--bb-home-primary), var(--bb-home-gold));
    }

.bb-home-customer-phone-topbar[b-k9o8z149rt],
.bb-home-customer-phone-alert[b-k9o8z149rt],
.bb-home-customer-phone-timeline[b-k9o8z149rt] {
    position: relative;
    z-index: 2;
}

.bb-home-customer-phone-topbar[b-k9o8z149rt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: var(--bb-home-primary);
}

.bb-home-page[b-k9o8z149rt]  .bb-home-customer-phone-topbar .mud-icon-root {
    color: var(--bb-home-gold) !important;
}

.bb-home-customer-phone-alert[b-k9o8z149rt] {
    display: grid;
    gap: 0.2rem;
    padding: 0.88rem;
    border-radius: 18px;
    border: 1px solid color-mix(in srgb, var(--bb-home-primary) 9%, var(--bb-home-divider));
    background: rgba(255,255,255,0.78);
}

    .bb-home-customer-phone-alert.is-new[b-k9o8z149rt] {
        border-color: color-mix(in srgb, var(--bb-home-secondary) 24%, var(--bb-home-divider));
        background: linear-gradient(135deg, color-mix(in srgb, var(--bb-home-secondary) 10%, white), rgba(255,255,255,0.86));
    }

    .bb-home-customer-phone-alert span[b-k9o8z149rt] {
        color: var(--bb-home-gold);
        font-size: 0.66rem;
        font-weight: 950;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .bb-home-customer-phone-alert strong[b-k9o8z149rt] {
        color: var(--bb-home-primary);
        font-size: 0.92rem;
        font-weight: 950;
        line-height: 1.22;
    }

    .bb-home-customer-phone-alert small[b-k9o8z149rt] {
        color: var(--bb-home-text-secondary);
        font-size: 0.78rem;
        font-weight: 680;
        line-height: 1.35;
    }

.bb-home-customer-phone-timeline[b-k9o8z149rt] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
}

    .bb-home-customer-phone-timeline div[b-k9o8z149rt] {
        display: grid;
        gap: 0.3rem;
        justify-items: center;
        padding: 0.68rem 0.4rem;
        border-radius: 14px;
        background: color-mix(in srgb, var(--bb-home-primary) 5%, white);
        border: 1px solid color-mix(in srgb, var(--bb-home-primary) 8%, var(--bb-home-divider));
    }

    .bb-home-customer-phone-timeline span[b-k9o8z149rt] {
        width: 12px;
        height: 12px;
        border-radius: 999px;
        background: color-mix(in srgb, var(--bb-home-primary) 28%, transparent);
    }

    .bb-home-customer-phone-timeline strong[b-k9o8z149rt] {
        color: var(--bb-home-primary);
        font-size: 0.7rem;
        font-weight: 900;
    }

    .bb-home-customer-phone-timeline .is-complete span[b-k9o8z149rt] {
        background: var(--bb-home-success);
        box-shadow: 0 0 0 5px color-mix(in srgb, var(--bb-home-success) 14%, transparent);
    }

    .bb-home-customer-phone-timeline .is-active span[b-k9o8z149rt] {
        background: var(--bb-home-gold);
        box-shadow: 0 0 0 5px color-mix(in srgb, var(--bb-home-gold) 16%, transparent);
    }

.bb-home-customer-notification-copy[b-k9o8z149rt] {
    display: grid;
    gap: 1rem;
}

@keyframes bb-home-setup-step-slide-b-k9o8z149rt {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(calc(-50% - 0.275rem));
    }
}

@media (max-width: 960px) {
    .bb-home-early-access-banner[b-k9o8z149rt],
    .bb-home-customer-notification-showcase[b-k9o8z149rt] {
        grid-template-columns: 1fr;
    }

    .bb-home-page[b-k9o8z149rt]  .bb-home-early-access-cta {
        width: 100%;
    }
}

@media (max-width: 640px) {
    .bb-home-early-access-banner[b-k9o8z149rt] {
        padding: 0.9rem;
        border-radius: 20px;
    }

    .bb-home-setup-flow-heading[b-k9o8z149rt] {
        display: grid;
    }

    .bb-home-setup-step-pill[b-k9o8z149rt] {
        min-width: 132px;
    }

    .bb-home-customer-phone-timeline[b-k9o8z149rt] {
        grid-template-columns: 1fr;
    }
}


/* BB-HOME-GUIDE-LANDING-01 v04 focused fixes
   - Stabilize owner setup preview so title and quality card never overlap.
   - Reuse the same hero salon-card visual for Step 01.
   - Add stronger BookBeaut theme color to all feature/check lists.
   - Make customer notification visual large enough to match the rest of the page. */
.bb-home-step-preview-card-wrap[b-k9o8z149rt] {
    max-width: 430px;
    margin-inline: auto;
}

.bb-home-step-preview-salon-card[b-k9o8z149rt] {
    box-shadow: 0 26px 66px color-mix(in srgb, var(--bb-home-primary) 14%, transparent);
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

    .bb-home-step-preview-salon-card:hover[b-k9o8z149rt] {
        transform: translateY(-4px);
        border-color: color-mix(in srgb, var(--bb-home-primary) 24%, var(--bb-home-divider));
        box-shadow: 0 34px 82px color-mix(in srgb, var(--bb-home-primary) 18%, transparent);
    }

.bb-home-walkthrough-first .bb-home-preview-media[b-k9o8z149rt] {
    min-height: 200px;
}

.bb-home-owner-setup-demo[b-k9o8z149rt] {
    max-width: 650px;
}

    .bb-home-owner-setup-demo .owner-premium-hero-shell-final[b-k9o8z149rt] {
        overflow: hidden;
        padding: 0 !important;
        border-radius: 24px !important;
        background: linear-gradient(135deg, color-mix(in srgb, var(--bb-home-primary) 96%, #020617), var(--bb-home-primary)) !important;
        border-color: color-mix(in srgb, var(--bb-home-gold) 26%, transparent) !important;
        box-shadow: 0 22px 56px color-mix(in srgb, var(--bb-home-primary) 18%, transparent), inset 0 1px 0 rgba(255,255,255,0.14) !important;
    }

    .bb-home-owner-setup-demo .owner-premium-hero-compact-grid[b-k9o8z149rt] {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 0 !important;
        align-items: stretch !important;
    }

    .bb-home-owner-setup-demo .owner-premium-hero-main[b-k9o8z149rt] {
        position: relative;
        overflow: hidden;
        min-width: 0 !important;
        display: grid !important;
        gap: 0.78rem !important;
        padding: 1.15rem !important;
        border-radius: 24px 24px 0 0;
        background: radial-gradient(circle at 88% 10%, color-mix(in srgb, var(--bb-home-gold) 18%, transparent), transparent 28%), radial-gradient(circle at 12% 90%, color-mix(in srgb, var(--bb-home-secondary) 12%, transparent), transparent 30%), linear-gradient(135deg, color-mix(in srgb, var(--bb-home-primary) 96%, #020617), var(--bb-home-primary));
    }

        .bb-home-owner-setup-demo .owner-premium-hero-main[b-k9o8z149rt]::after {
            content: "";
            position: absolute;
            inset: 0;
            background: repeating-linear-gradient(135deg, rgba(255,255,255,0.045) 0 1px, transparent 1px 18px);
            pointer-events: none;
        }

        .bb-home-owner-setup-demo .owner-premium-hero-main > *[b-k9o8z149rt] {
            position: relative;
            z-index: 2;
        }

    .bb-home-owner-setup-demo .owner-premium-kicker-row[b-k9o8z149rt] {
        align-items: center !important;
    }

    .bb-home-owner-setup-demo .owner-premium-hero-title[b-k9o8z149rt] {
        max-width: 100% !important;
        margin: 0 !important;
        color: #ffffff !important;
        font-size: clamp(1.65rem, 3vw, 2.35rem) !important;
        line-height: 1.05 !important;
        letter-spacing: -0.045em !important;
        text-wrap: balance;
    }

    .bb-home-owner-setup-demo .owner-premium-hero-subtitle[b-k9o8z149rt] {
        max-width: 100% !important;
        color: rgba(255,255,255,0.84) !important;
        font-size: 0.9rem !important;
        line-height: 1.45 !important;
    }

    .bb-home-owner-setup-demo .bb-home-owner-mini-actions[b-k9o8z149rt] {
        display: flex;
        flex-wrap: wrap;
        gap: 0.46rem;
    }

        .bb-home-owner-setup-demo .bb-home-owner-mini-actions span[b-k9o8z149rt] {
            min-height: 34px;
            padding: 0.44rem 0.62rem;
            background: rgba(255,255,255,0.12);
            border: 1px solid rgba(255,255,255,0.18);
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.10);
        }

    .bb-home-owner-setup-demo .owner-premium-hero-status-card-final[b-k9o8z149rt] {
        width: auto !important;
        min-width: 0 !important;
        display: grid !important;
        gap: 0.72rem !important;
        margin: 0 !important;
        padding: 1rem !important;
        border-radius: 0 0 24px 24px !important;
        color: var(--bb-home-primary) !important;
        background: linear-gradient(135deg, rgba(255,255,255,0.96), color-mix(in srgb, var(--bb-home-gold) 7%, white)) !important;
        border: 0 !important;
        border-top: 1px solid color-mix(in srgb, var(--bb-home-gold) 22%, transparent) !important;
        box-shadow: none !important;
    }

    .bb-home-owner-setup-demo .owner-premium-status-card-top strong[b-k9o8z149rt] {
        color: var(--bb-home-primary) !important;
        font-size: 1.85rem !important;
    }

    .bb-home-owner-setup-demo .owner-premium-status-card-top span[b-k9o8z149rt] {
        color: var(--bb-home-gold) !important;
        font-size: 0.66rem !important;
    }

    .bb-home-owner-setup-demo .owner-premium-status-progress[b-k9o8z149rt] {
        height: 7px !important;
        border-radius: 999px !important;
        background: color-mix(in srgb, var(--bb-home-primary) 9%, white) !important;
    }

    .bb-home-owner-setup-demo .owner-premium-hero-status-card-final p[b-k9o8z149rt] {
        color: color-mix(in srgb, var(--bb-home-primary) 76%, transparent) !important;
        font-size: 0.82rem !important;
        line-height: 1.42 !important;
        font-weight: 720 !important;
    }

    .bb-home-owner-setup-demo .owner-premium-readiness-checklist[b-k9o8z149rt] {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 0.55rem !important;
    }

        .bb-home-owner-setup-demo .owner-premium-readiness-checklist div[b-k9o8z149rt] {
            min-height: 42px !important;
            display: flex !important;
            align-items: center !important;
            gap: 0.46rem !important;
            padding: 0.62rem 0.7rem !important;
            color: var(--bb-home-primary) !important;
            font-size: 0.78rem !important;
            font-weight: 950 !important;
            border-radius: 13px !important;
            background: linear-gradient(135deg, color-mix(in srgb, var(--bb-home-gold) 12%, white), rgba(255,255,255,0.92)) !important;
            border: 1px solid color-mix(in srgb, var(--bb-home-gold) 24%, transparent) !important;
        }

        .bb-home-owner-setup-demo .owner-premium-readiness-checklist .owner-premium-readiness-check-complete[b-k9o8z149rt] {
            background: linear-gradient(135deg, color-mix(in srgb, var(--bb-home-success) 12%, white), rgba(255,255,255,0.94)) !important;
            border-color: color-mix(in srgb, var(--bb-home-success) 24%, transparent) !important;
        }

.bb-home-page[b-k9o8z149rt]  .bb-home-owner-setup-demo .owner-premium-readiness-checklist .mud-icon-root {
    width: 24px !important;
    height: 24px !important;
    padding: 0.22rem !important;
    color: #ffffff !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, var(--bb-home-primary), var(--bb-home-gold)) !important;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-owner-setup-demo .owner-premium-readiness-checklist .owner-premium-readiness-check-complete .mud-icon-root {
    background: var(--bb-home-success) !important;
}

.bb-home-feature-list span[b-k9o8z149rt] {
    --feature-accent: var(--bb-home-primary);
    position: relative;
    overflow: hidden;
    min-height: 46px;
    padding: 0.68rem 0.78rem 0.68rem 0.86rem !important;
    border-left: 5px solid var(--feature-accent) !important;
    color: var(--bb-home-primary) !important;
    background: linear-gradient(135deg, color-mix(in srgb, var(--feature-accent) 8%, white), rgba(255,255,255,0.92)) !important;
    border-top: 1px solid color-mix(in srgb, var(--feature-accent) 14%, transparent) !important;
    border-right: 1px solid color-mix(in srgb, var(--feature-accent) 14%, transparent) !important;
    border-bottom: 1px solid color-mix(in srgb, var(--feature-accent) 14%, transparent) !important;
    border-radius: 15px !important;
    box-shadow: 0 12px 26px color-mix(in srgb, var(--feature-accent) 6%, transparent) !important;
}

    .bb-home-feature-list span:nth-child(4n + 1)[b-k9o8z149rt] {
        --feature-accent: var(--bb-home-primary);
    }

    .bb-home-feature-list span:nth-child(4n + 2)[b-k9o8z149rt] {
        --feature-accent: var(--bb-home-gold);
    }

    .bb-home-feature-list span:nth-child(4n + 3)[b-k9o8z149rt] {
        --feature-accent: var(--bb-home-secondary);
    }

    .bb-home-feature-list span:nth-child(4n + 4)[b-k9o8z149rt] {
        --feature-accent: var(--bb-home-info);
    }

.bb-home-page[b-k9o8z149rt]  .bb-home-feature-list .mud-icon-root {
    flex: 0 0 auto !important;
    width: 26px !important;
    height: 26px !important;
    display: inline-grid !important;
    place-items: center !important;
    padding: 0.24rem !important;
    color: #ffffff !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, var(--feature-accent, var(--bb-home-primary)), color-mix(in srgb, var(--feature-accent, var(--bb-home-primary)) 72%, var(--bb-home-primary))) !important;
    box-shadow: 0 9px 18px color-mix(in srgb, var(--feature-accent, var(--bb-home-primary)) 18%, transparent) !important;
}

.bb-home-customer-notification-showcase[b-k9o8z149rt] {
    grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr) !important;
    gap: clamp(1.4rem, 3vw, 3.2rem) !important;
}

.bb-home-customer-phone-card[b-k9o8z149rt] {
    width: 100%;
    max-width: 560px !important;
    min-height: 360px;
    padding: 1.25rem !important;
    border-radius: 32px !important;
}

.bb-home-customer-phone-topbar[b-k9o8z149rt] {
    min-height: 44px;
    padding-bottom: 0.4rem;
    border-bottom: 1px solid color-mix(in srgb, var(--bb-home-primary) 9%, var(--bb-home-divider));
}

.bb-home-customer-phone-alert[b-k9o8z149rt] {
    padding: 1rem !important;
    border-radius: 20px !important;
}

    .bb-home-customer-phone-alert strong[b-k9o8z149rt] {
        font-size: 1rem !important;
    }

    .bb-home-customer-phone-alert small[b-k9o8z149rt] {
        font-size: 0.84rem !important;
    }

.bb-home-customer-phone-timeline[b-k9o8z149rt] {
    gap: 0.75rem !important;
}

    .bb-home-customer-phone-timeline div[b-k9o8z149rt] {
        min-height: 76px;
        padding: 0.82rem 0.5rem !important;
    }

@media (max-width: 960px) {
    .bb-home-customer-notification-showcase[b-k9o8z149rt] {
        grid-template-columns: 1fr !important;
    }

    .bb-home-customer-phone-card[b-k9o8z149rt] {
        max-width: 100% !important;
        min-height: 0;
    }
}

@media (max-width: 640px) {
    .bb-home-owner-setup-demo .owner-premium-hero-main[b-k9o8z149rt],
    .bb-home-owner-setup-demo .owner-premium-hero-status-card-final[b-k9o8z149rt] {
        padding: 0.9rem !important;
    }

    .bb-home-owner-setup-demo .owner-premium-readiness-checklist[b-k9o8z149rt] {
        grid-template-columns: 1fr !important;
    }

    .bb-home-walkthrough-first .bb-home-preview-media[b-k9o8z149rt] {
        min-height: 170px;
    }

    .bb-home-customer-phone-card[b-k9o8z149rt] {
        padding: 1rem !important;
        border-radius: 26px !important;
    }
}


/* BB-HOME-POLISH-ARROWS-DASHBOARD-01
   - Keep existing card widths/layout untouched.
   - Add outside futuristic flow arrows.
   - Add real-looking store badges.
   - Add stable dashboard mockup with chart-only animation. */
.bb-home-walkthrough[b-k9o8z149rt] {
    position: relative;
    overflow: visible;
}

.bb-home-flow-connector[b-k9o8z149rt] {
    position: absolute;
    top: calc(100% + 0.45rem);
    width: 238px;
    height: 206px;
    z-index: 8;
    pointer-events: none;
}

.bb-home-flow-connector-right[b-k9o8z149rt] {
    right: -208px;
}

.bb-home-flow-connector-left[b-k9o8z149rt] {
    left: -208px;
}

.bb-home-flow-connector svg[b-k9o8z149rt] {
    width: 100%;
    height: 100%;
    overflow: visible;
    filter: drop-shadow(0 14px 26px color-mix(in srgb, var(--bb-home-primary) 14%, transparent));
}

.bb-home-flow-connector-left svg[b-k9o8z149rt] {
    transform: scaleX(-1);
    transform-origin: center;
}

.bb-home-flow-connector-track[b-k9o8z149rt],
.bb-home-flow-connector-draw[b-k9o8z149rt],
.bb-home-flow-connector-head[b-k9o8z149rt] {
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.bb-home-flow-connector-track[b-k9o8z149rt] {
    stroke: color-mix(in srgb, var(--bb-home-gold) 22%, var(--bb-home-divider));
    stroke-width: 4.5;
    stroke-dasharray: 10 12;
    opacity: 0.92;
}

.bb-home-flow-connector-draw[b-k9o8z149rt] {
    stroke: color-mix(in srgb, var(--bb-home-primary) 92%, white);
    stroke-width: 3.8;
    stroke-dasharray: 560;
    stroke-dashoffset: 560;
    animation: bb-home-flow-connector-draw-b-k9o8z149rt 4.9s cubic-bezier(.58, 0, .24, 1) infinite;
}

.bb-home-flow-connector-head[b-k9o8z149rt] {
    stroke: var(--bb-home-gold);
    stroke-width: 5;
    opacity: 0;
    animation: bb-home-flow-connector-head-b-k9o8z149rt 4.9s ease-in-out infinite;
}

.bb-home-flow-connector-badge[b-k9o8z149rt] {
    position: absolute;
    left: 53%;
    top: 46%;
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    color: var(--bb-home-primary);
    background: color-mix(in srgb, var(--bb-home-surface) 97%, white);
    border: 1px solid color-mix(in srgb, var(--bb-home-gold) 22%, var(--bb-home-divider));
    box-shadow: 0 12px 28px color-mix(in srgb, var(--bb-home-text-primary) 8%, transparent);
}

.bb-home-page[b-k9o8z149rt]  .bb-home-flow-connector-badge .mud-icon-root {
    color: var(--bb-home-primary) !important;
    font-size: 1rem !important;
}

.bb-home-flow-connector-step-01 .bb-home-flow-connector-badge[b-k9o8z149rt] {
    top: 42%;
}

.bb-home-flow-connector-step-02 .bb-home-flow-connector-badge[b-k9o8z149rt] {
    top: 49%;
}

.bb-home-flow-connector-step-03 .bb-home-flow-connector-badge[b-k9o8z149rt],
.bb-home-flow-connector-step-05 .bb-home-flow-connector-badge[b-k9o8z149rt],
.bb-home-flow-connector-step-06 .bb-home-flow-connector-badge[b-k9o8z149rt] {
    top: 45%;
}

@keyframes bb-home-flow-connector-draw-b-k9o8z149rt {
    0%, 14% {
        stroke-dashoffset: 560;
        opacity: 0.22;
    }

    56%, 82% {
        stroke-dashoffset: 0;
        opacity: 1;
    }

    100% {
        stroke-dashoffset: 0;
        opacity: 0.94;
    }
}

@keyframes bb-home-flow-connector-head-b-k9o8z149rt {
    0%, 58% {
        opacity: 0;
    }

    64%, 84% {
        opacity: 1;
    }

    100% {
        opacity: 0.92;
    }
}

.bb-home-store-badges[b-k9o8z149rt] {
    display: grid;
    gap: 0.95rem;
}

.bb-home-store-badge[b-k9o8z149rt] {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.8rem;
    align-items: center;
    padding: 0.92rem 1rem;
    color: #ffffff;
    border-radius: 18px;
    background: rgba(8, 12, 22, 0.76);
    border: 1px solid rgba(255,255,255,0.14);
    box-shadow: 0 16px 34px rgba(0,0,0,0.18), inset 0 1px 0 rgba(255,255,255,0.06);
    backdrop-filter: blur(16px);
}

.bb-home-store-badge-icon[b-k9o8z149rt] {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(255,255,255,0.10), rgba(255,255,255,0.04));
    border: 1px solid rgba(255,255,255,0.14);
}

    .bb-home-store-badge-icon svg[b-k9o8z149rt] {
        width: 28px;
        height: 28px;
    }

.bb-home-store-badge-copy[b-k9o8z149rt] {
    display: grid;
    gap: 0.18rem;
}

    .bb-home-store-badge-copy small[b-k9o8z149rt] {
        color: rgba(255,255,255,0.66) !important;
        font-size: 0.72rem !important;
        font-weight: 850 !important;
        letter-spacing: 0.02em;
    }

    .bb-home-store-badge-copy strong[b-k9o8z149rt] {
        color: #ffffff !important;
        font-size: 1.55rem;
        font-weight: 950 !important;
        line-height: 1.04;
        letter-spacing: -0.03em;
    }

.bb-home-store-badge-apple .bb-home-store-badge-icon[b-k9o8z149rt] {
    color: #ffffff;
}

.bb-home-dashboard-preview[b-k9o8z149rt] {
    max-width: 660px;
    margin-inline: auto;
    display: grid;
    gap: 0.95rem;
    padding: 1.35rem;
    border-radius: 34px;
    background: linear-gradient(145deg, color-mix(in srgb, var(--bb-home-surface) 98%, white), color-mix(in srgb, var(--bb-home-background) 82%, var(--bb-home-surface)));
    border: 1px solid color-mix(in srgb, var(--bb-home-primary) 10%, var(--bb-home-divider));
    box-shadow: 0 30px 72px color-mix(in srgb, var(--bb-home-text-primary) 10%, transparent);
    transform: none !important;
    animation: none !important;
}

.bb-home-dashboard-header[b-k9o8z149rt],
.bb-home-dashboard-kpis[b-k9o8z149rt],
.bb-home-dashboard-chart-grid[b-k9o8z149rt],
.bb-home-dashboard-bottom-grid[b-k9o8z149rt] {
    display: grid;
    gap: 0.9rem;
}

.bb-home-dashboard-header[b-k9o8z149rt] {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
}

    .bb-home-dashboard-header span[b-k9o8z149rt],
    .bb-home-dashboard-card-heading span[b-k9o8z149rt],
    .bb-home-dashboard-today-card > span[b-k9o8z149rt],
    .bb-home-dashboard-kpi span[b-k9o8z149rt] {
        color: color-mix(in srgb, var(--bb-home-primary) 62%, transparent);
        font-size: 0.72rem;
        font-weight: 950;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .bb-home-dashboard-header strong[b-k9o8z149rt],
    .bb-home-dashboard-card-heading strong[b-k9o8z149rt],
    .bb-home-dashboard-today-card strong[b-k9o8z149rt],
    .bb-home-dashboard-kpi strong[b-k9o8z149rt] {
        color: var(--bb-home-text-primary);
        font-weight: 950;
        line-height: 1.08;
    }

    .bb-home-dashboard-header strong[b-k9o8z149rt] {
        display: block;
        font-size: 1.05rem;
        letter-spacing: -0.03em;
    }

.bb-home-dashboard-live[b-k9o8z149rt] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.55rem 0.85rem;
    color: var(--bb-home-primary);
    font-size: 0.8rem;
    font-weight: 900;
    border-radius: 999px;
    background: color-mix(in srgb, var(--bb-home-secondary) 7%, white);
    border: 1px solid color-mix(in srgb, var(--bb-home-secondary) 16%, var(--bb-home-divider));
}

    .bb-home-dashboard-live i[b-k9o8z149rt] {
        width: 10px;
        height: 10px;
        border-radius: 999px;
        background: #5abf99;
    }

.bb-home-dashboard-kpis[b-k9o8z149rt] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.bb-home-dashboard-kpi[b-k9o8z149rt],
.bb-home-dashboard-chart-card[b-k9o8z149rt],
.bb-home-dashboard-services-card[b-k9o8z149rt],
.bb-home-dashboard-today-card[b-k9o8z149rt] {
    position: relative;
    display: grid;
    gap: 0.35rem;
    padding: 1rem;
    border-radius: 22px;
    background: rgba(255,255,255,0.8);
    border: 1px solid color-mix(in srgb, var(--bb-home-primary) 8%, var(--bb-home-divider));
    box-shadow: 0 14px 30px color-mix(in srgb, var(--bb-home-text-primary) 5%, transparent);
    transform: none !important;
    animation: none !important;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-dashboard-kpi .mud-icon-root,
.bb-home-page[b-k9o8z149rt]  .bb-home-dashboard-services-card .mud-icon-root {
    color: var(--bb-home-primary);
    justify-self: end;
    font-size: 1.15rem !important;
}

.bb-home-dashboard-kpi small[b-k9o8z149rt],
.bb-home-dashboard-today-card small[b-k9o8z149rt],
.bb-home-dashboard-legend span[b-k9o8z149rt],
.bb-home-dashboard-days span[b-k9o8z149rt],
.bb-home-dashboard-service-row span[b-k9o8z149rt] {
    color: var(--bb-home-text-secondary);
    font-size: 0.77rem;
    font-weight: 740;
}

.bb-home-dashboard-kpi b[b-k9o8z149rt],
.bb-home-dashboard-today-card b[b-k9o8z149rt] {
    color: #1b8f67;
}

.bb-home-dashboard-kpi-gold strong[b-k9o8z149rt],
.bb-home-dashboard-kpi-gold b[b-k9o8z149rt],
.bb-home-dashboard-card-heading small[b-k9o8z149rt],
.bb-home-dashboard-services-card .mud-icon-root[b-k9o8z149rt] {
    color: var(--bb-home-gold);
}

.bb-home-dashboard-kpi-teal b[b-k9o8z149rt] {
    color: #1e9f8a;
}

.bb-home-dashboard-chart-grid[b-k9o8z149rt] {
    grid-template-columns: minmax(0, 1.2fr) minmax(240px, 0.8fr);
}

.bb-home-dashboard-bottom-grid[b-k9o8z149rt] {
    grid-template-columns: minmax(0, 1fr) minmax(220px, 0.58fr);
}

.bb-home-dashboard-card-heading[b-k9o8z149rt] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.8rem;
}

    .bb-home-dashboard-card-heading strong[b-k9o8z149rt] {
        display: block;
        font-size: 0.98rem;
        letter-spacing: -0.025em;
    }

    .bb-home-dashboard-card-heading small[b-k9o8z149rt] {
        font-size: 0.8rem;
        font-weight: 900;
    }

.bb-home-dashboard-line-chart[b-k9o8z149rt] {
    position: relative;
    height: 190px;
    color: var(--bb-home-primary);
}

    .bb-home-dashboard-line-chart[b-k9o8z149rt]::before {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(to bottom, transparent 0, transparent 24px, color-mix(in srgb, var(--bb-home-divider) 78%, transparent) 24px, color-mix(in srgb, var(--bb-home-divider) 78%, transparent) 25px);
        background-size: 100% 38px;
        border-radius: 14px;
        pointer-events: none;
    }

    .bb-home-dashboard-line-chart svg[b-k9o8z149rt] {
        position: relative;
        z-index: 1;
        width: 100%;
        height: 100%;
    }

.bb-home-dashboard-area[b-k9o8z149rt] {
    opacity: 0;
    animation: bb-home-dashboard-area-fade-b-k9o8z149rt 5.4s ease-in-out infinite;
}

.bb-home-dashboard-line[b-k9o8z149rt] {
    fill: none;
    stroke: currentColor;
    stroke-width: 5;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 620;
    stroke-dashoffset: 620;
    animation: bb-home-dashboard-line-draw-b-k9o8z149rt 5.4s cubic-bezier(.45, 0, .2, 1) infinite;
}

.bb-home-dashboard-days[b-k9o8z149rt] {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 0.4rem;
    margin-top: 0.25rem;
}

.bb-home-dashboard-donut[b-k9o8z149rt] {
    width: 162px;
    height: 162px;
    margin: 0.2rem auto 0;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: conic-gradient(var(--bb-home-primary) 0 71%, var(--bb-home-gold) 71% 89%, #d8dde6 89% 100%);
}

    .bb-home-dashboard-donut[b-k9o8z149rt]::before {
        content: "";
        width: 98px;
        height: 98px;
        border-radius: 999px;
        background: #ffffff;
        box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--bb-home-primary) 8%, var(--bb-home-divider));
    }

    .bb-home-dashboard-donut > div[b-k9o8z149rt] {
        position: absolute;
        display: grid;
        justify-items: center;
    }

        .bb-home-dashboard-donut > div strong[b-k9o8z149rt] {
            font-size: 2rem;
            letter-spacing: -0.04em;
        }

        .bb-home-dashboard-donut > div span[b-k9o8z149rt] {
            color: var(--bb-home-text-secondary);
            font-size: 0.72rem;
            font-weight: 850;
            text-transform: lowercase;
            letter-spacing: 0;
        }

.bb-home-dashboard-legend[b-k9o8z149rt] {
    display: grid;
    gap: 0.45rem;
    margin-top: 0.75rem;
}

    .bb-home-dashboard-legend span[b-k9o8z149rt] {
        display: grid;
        grid-template-columns: auto 1fr auto;
        gap: 0.45rem;
        align-items: center;
    }

    .bb-home-dashboard-legend i[b-k9o8z149rt] {
        width: 10px;
        height: 10px;
        border-radius: 999px;
    }

        .bb-home-dashboard-legend i.is-confirmed[b-k9o8z149rt] {
            background: var(--bb-home-primary);
        }

        .bb-home-dashboard-legend i.is-pending[b-k9o8z149rt] {
            background: var(--bb-home-gold);
        }

        .bb-home-dashboard-legend i.is-other[b-k9o8z149rt] {
            background: #d8dde6;
        }

    .bb-home-dashboard-legend strong[b-k9o8z149rt],
    .bb-home-dashboard-service-row strong[b-k9o8z149rt] {
        color: var(--bb-home-text-primary);
        font-size: 0.85rem;
        font-weight: 900;
    }

.bb-home-dashboard-service-row[b-k9o8z149rt] {
    display: grid;
    grid-template-columns: minmax(82px, auto) minmax(0, 1fr) auto;
    gap: 0.6rem;
    align-items: center;
}

    .bb-home-dashboard-service-row i[b-k9o8z149rt] {
        position: relative;
        height: 8px;
        border-radius: 999px;
        background: color-mix(in srgb, var(--bb-home-divider) 84%, white);
        overflow: hidden;
    }

        .bb-home-dashboard-service-row i[b-k9o8z149rt]::after {
            content: "";
            position: absolute;
            inset: 0;
            transform-origin: left center;
            transform: scaleX(0);
            border-radius: inherit;
            background: linear-gradient(90deg, var(--bb-home-primary), var(--bb-home-gold));
            animation: bb-home-dashboard-bar-grow-b-k9o8z149rt 5.4s cubic-bezier(.45, 0, .2, 1) infinite;
            width: var(--bb-dashboard-bar, 70%);
        }

.bb-home-dashboard-today-card[b-k9o8z149rt] {
    align-content: start;
}

    .bb-home-dashboard-today-card > div[b-k9o8z149rt] {
        display: flex;
        gap: 0.35rem;
        margin-top: 0.25rem;
    }

        .bb-home-dashboard-today-card > div i[b-k9o8z149rt] {
            width: 26px;
            height: 8px;
            border-radius: 999px;
            background: color-mix(in srgb, var(--bb-home-primary) 16%, var(--bb-home-divider));
        }

            .bb-home-dashboard-today-card > div i:nth-child(1)[b-k9o8z149rt],
            .bb-home-dashboard-today-card > div i:nth-child(2)[b-k9o8z149rt] {
                background: var(--bb-home-primary);
            }

            .bb-home-dashboard-today-card > div i:nth-child(3)[b-k9o8z149rt] {
                background: var(--bb-home-gold);
            }

@keyframes bb-home-dashboard-line-draw-b-k9o8z149rt {
    0%, 18% {
        stroke-dashoffset: 620;
    }

    58%, 100% {
        stroke-dashoffset: 0;
    }
}

@keyframes bb-home-dashboard-area-fade-b-k9o8z149rt {
    0%, 26% {
        opacity: 0;
    }

    44%, 100% {
        opacity: 1;
    }
}

@keyframes bb-home-dashboard-bar-grow-b-k9o8z149rt {
    0%, 22% {
        transform: scaleX(0);
    }

    52%, 100% {
        transform: scaleX(1);
    }
}

@media (max-width: 1400px) {
    .bb-home-flow-connector-right[b-k9o8z149rt] {
        right: -168px;
    }

    .bb-home-flow-connector-left[b-k9o8z149rt] {
        left: -168px;
    }
}

@media (max-width: 1180px) {
    .bb-home-flow-connector[b-k9o8z149rt] {
        display: none;
    }
}

@media (max-width: 760px) {
    .bb-home-dashboard-kpis[b-k9o8z149rt],
    .bb-home-dashboard-chart-grid[b-k9o8z149rt],
    .bb-home-dashboard-bottom-grid[b-k9o8z149rt] {
        grid-template-columns: 1fr;
    }

    .bb-home-dashboard-preview[b-k9o8z149rt] {
        padding: 1rem;
        border-radius: 26px;
    }

    .bb-home-store-badge-copy strong[b-k9o8z149rt] {
        font-size: 1.26rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .bb-home-flow-connector-draw[b-k9o8z149rt],
    .bb-home-flow-connector-head[b-k9o8z149rt],
    .bb-home-dashboard-line[b-k9o8z149rt],
    .bb-home-dashboard-area[b-k9o8z149rt],
    .bb-home-dashboard-service-row i[b-k9o8z149rt]::after {
        animation: none !important;
    }

    .bb-home-flow-connector-draw[b-k9o8z149rt],
    .bb-home-dashboard-line[b-k9o8z149rt] {
        stroke-dashoffset: 0;
    }

    .bb-home-flow-connector-head[b-k9o8z149rt],
    .bb-home-dashboard-area[b-k9o8z149rt] {
        opacity: 1;
    }

    .bb-home-dashboard-service-row i[b-k9o8z149rt]::after {
        transform: scaleX(1);
    }
}


/* =========================================================
   BB-HOME-FLOW-V2
   Natural outside flow arrows + larger intuitive store badges.
   Existing walkthrough/card widths are intentionally untouched.
   ========================================================= */

.bb-home-flow-connector[b-k9o8z149rt] {
    top: 64%;
    width: 280px;
    height: 420px;
}

.bb-home-flow-connector-right[b-k9o8z149rt] {
    right: -263px;
}

.bb-home-flow-connector-left[b-k9o8z149rt] {
    left: -263px;
}

.bb-home-flow-connector svg[b-k9o8z149rt] {
    width: 100%;
    height: 100%;
    overflow: visible;
    filter: drop-shadow(0 18px 30px color-mix(in srgb, var(--bb-home-primary) 14%, transparent));
}

.bb-home-flow-connector-left svg[b-k9o8z149rt] {
    transform: scaleX(-1);
    transform-origin: center;
}

.bb-home-flow-connector-track[b-k9o8z149rt],
.bb-home-flow-connector-draw[b-k9o8z149rt],
.bb-home-flow-connector-head[b-k9o8z149rt] {
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.bb-home-flow-connector-track[b-k9o8z149rt] {
    stroke: color-mix(in srgb, var(--bb-home-gold) 30%, var(--bb-home-divider));
    stroke-width: 4.2;
    stroke-dasharray: .026 .035;
    opacity: .9;
}

.bb-home-flow-connector-draw[b-k9o8z149rt] {
    stroke: color-mix(in srgb, var(--bb-home-primary) 94%, white);
    stroke-width: 4;
    stroke-dasharray: 1;
    stroke-dashoffset: 1;
    animation: bb-home-flow-v2-draw-b-k9o8z149rt 5.6s cubic-bezier(.52, 0, .22, 1) infinite;
}

.bb-home-flow-connector-head[b-k9o8z149rt] {
    stroke: var(--bb-home-gold);
    stroke-width: 5.2;
    opacity: 0;
    animation: bb-home-flow-v2-head-b-k9o8z149rt 5.6s ease-in-out infinite;
}

.bb-home-flow-connector-pen[b-k9o8z149rt] {
    fill: var(--bb-home-gold);
    stroke: #ffffff;
    stroke-width: 2.5;
    filter: drop-shadow(0 0 10px color-mix(in srgb, var(--bb-home-gold) 72%, transparent));
    animation: bb-home-flow-v2-pen-b-k9o8z149rt 5.6s ease-in-out infinite;
}

.bb-home-flow-connector-badge[b-k9o8z149rt] {
    left: 66%;
    top: 43%;
    width: 44px;
    height: 44px;
    transform: translate(-50%, -50%);
    z-index: 3;
    background: color-mix(in srgb, var(--bb-home-surface) 98%, white);
    border: 1px solid color-mix(in srgb, var(--bb-home-gold) 28%, var(--bb-home-divider));
    box-shadow: 0 14px 30px color-mix(in srgb, var(--bb-home-text-primary) 9%, transparent), 0 0 0 7px color-mix(in srgb, var(--bb-home-surface) 88%, transparent);
}

.bb-home-page[b-k9o8z149rt]  .bb-home-flow-connector-badge .mud-icon-root {
    color: var(--bb-home-primary) !important;
    font-size: 1.08rem !important;
}

@keyframes bb-home-flow-v2-draw-b-k9o8z149rt {
    0%, 10% {
        stroke-dashoffset: 1;
        opacity: .18;
    }

    78%, 88% {
        stroke-dashoffset: 0;
        opacity: 1;
    }

    100% {
        stroke-dashoffset: 0;
        opacity: .88;
    }
}

@keyframes bb-home-flow-v2-head-b-k9o8z149rt {
    0%, 72% {
        opacity: 0;
        transform: translate3d(3px, -2px, 0);
    }

    80%, 92% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }

    100% {
        opacity: .9;
    }
}

@keyframes bb-home-flow-v2-pen-b-k9o8z149rt {
    0%, 8% {
        opacity: 0;
    }

    12%, 80% {
        opacity: 1;
    }

    88%, 100% {
        opacity: 0;
    }
}

/* Bigger and more recognisable mobile store badges. */
.bb-home-store-badges[b-k9o8z149rt] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.95rem;
}

.bb-home-store-badge[b-k9o8z149rt] {
    min-width: 252px;
    min-height: 78px;
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    gap: 0.95rem;
    align-items: center;
    padding: 0.72rem 1rem;
    color: #ffffff;
    border-radius: 18px;
    background: linear-gradient(145deg, rgba(5,8,14,0.96), rgba(22,27,38,0.95));
    border: 1px solid rgba(255,255,255,0.16);
    box-shadow: 0 18px 38px rgba(0,0,0,0.24), inset 0 1px 0 rgba(255,255,255,0.08);
    backdrop-filter: blur(16px);
}

.bb-home-store-badge-icon[b-k9o8z149rt] {
    width: 64px;
    height: 64px;
    display: grid;
    place-items: center;
    border-radius: 18px;
    background: linear-gradient(145deg, rgba(255,255,255,0.12), rgba(255,255,255,0.045));
    border: 1px solid rgba(255,255,255,0.15);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
}

    .bb-home-store-badge-icon svg[b-k9o8z149rt] {
        width: 42px;
        height: 42px;
        display: block;
    }

.bb-home-store-badge-apple .bb-home-store-badge-icon[b-k9o8z149rt] {
    color: #ffffff;
}

.bb-home-store-badge-copy[b-k9o8z149rt] {
    min-width: 0;
    display: grid;
    gap: 0.12rem;
}

    .bb-home-store-badge-copy small[b-k9o8z149rt] {
        color: rgba(255,255,255,0.68) !important;
        font-size: 0.72rem !important;
        font-weight: 850 !important;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .bb-home-store-badge-copy strong[b-k9o8z149rt] {
        color: #ffffff !important;
        font-size: 1.34rem !important;
        font-weight: 950 !important;
        line-height: 1.04;
        letter-spacing: -0.025em;
    }

@media (max-width: 1400px) {
    .bb-home-flow-connector-right[b-k9o8z149rt] {
        right: -228px;
    }

    .bb-home-flow-connector-left[b-k9o8z149rt] {
        left: -228px;
    }
}

@media (max-width: 1180px) {
    .bb-home-flow-connector[b-k9o8z149rt] {
        display: none;
    }
}

@media (max-width: 760px) {
    .bb-home-store-badges[b-k9o8z149rt] {
        display: grid;
        grid-template-columns: 1fr;
    }

    .bb-home-store-badge[b-k9o8z149rt] {
        width: 100%;
        min-width: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .bb-home-flow-connector-draw[b-k9o8z149rt],
    .bb-home-flow-connector-head[b-k9o8z149rt],
    .bb-home-flow-connector-pen[b-k9o8z149rt] {
        animation: none !important;
    }

    .bb-home-flow-connector-draw[b-k9o8z149rt] {
        stroke-dashoffset: 0;
    }

    .bb-home-flow-connector-head[b-k9o8z149rt],
    .bb-home-flow-connector-pen[b-k9o8z149rt] {
        opacity: 1;
    }
}


/* =========================================================
   BB-HOME-FLOW-V3
   Connector endpoints are visually anchored to Step labels.
   Existing cards, widths and walkthrough grid remain untouched.
   ========================================================= */

.bb-home-step-anchor[b-k9o8z149rt] {
    position: relative;
    z-index: 12;
    width: fit-content;
}

    .bb-home-step-anchor > .bb-home-step-label[b-k9o8z149rt] {
        position: relative;
        z-index: 13;
    }

    .bb-home-step-anchor > .bb-home-flow-connector[b-k9o8z149rt] {
        top: 50%;
        width: min(1480px, calc(100vw - 1rem));
        height: var(--bb-home-flow-height, 640px);
        z-index: 7;
        pointer-events: none;
    }

    .bb-home-step-anchor > .bb-home-flow-connector-right[b-k9o8z149rt] {
        left: 50%;
        right: auto;
        transform: translateX(-63%);
    }

    .bb-home-step-anchor > .bb-home-flow-connector-left[b-k9o8z149rt] {
        left: 50%;
        right: auto;
        transform: translateX(-37%);
    }

        .bb-home-step-anchor > .bb-home-flow-connector-left svg[b-k9o8z149rt] {
            transform: scaleX(-1);
            transform-origin: center;
        }

.bb-home-flow-connector-step-01[b-k9o8z149rt] {
    --bb-home-flow-height: 650px;
}

.bb-home-flow-connector-step-02[b-k9o8z149rt] {
    --bb-home-flow-height: 650px;
}

.bb-home-flow-connector-step-03[b-k9o8z149rt] {
    --bb-home-flow-height: 560px;
}

.bb-home-flow-connector-step-04[b-k9o8z149rt] {
    --bb-home-flow-height: 1110px;
}

.bb-home-flow-connector-step-05[b-k9o8z149rt] {
    --bb-home-flow-height: 665px;
}

.bb-home-flow-connector-step-06[b-k9o8z149rt] {
    --bb-home-flow-height: 610px;
}

.bb-home-step-anchor > .bb-home-flow-connector svg[b-k9o8z149rt] {
    width: 100%;
    height: 100%;
    overflow: visible;
}

.bb-home-step-anchor > .bb-home-flow-connector-badge[b-k9o8z149rt] {
    left: 86%;
    top: 39%;
}

.bb-home-step-anchor > .bb-home-flow-connector-left .bb-home-flow-connector-badge[b-k9o8z149rt] {
    left: 14%;
}

/* The approved V2 draw animation stays exactly the same; only the route geometry changes. */
.bb-home-step-anchor > .bb-home-flow-connector-draw[b-k9o8z149rt] {
    stroke-dasharray: 1;
    stroke-dashoffset: 1;
    animation: bb-home-flow-v2-draw-b-k9o8z149rt 5.6s cubic-bezier(.52, 0, .22, 1) infinite;
}

.bb-home-step-anchor > .bb-home-flow-connector-head[b-k9o8z149rt] {
    animation: bb-home-flow-v2-head-b-k9o8z149rt 5.6s ease-in-out infinite;
}

.bb-home-step-anchor > .bb-home-flow-connector-pen[b-k9o8z149rt] {
    animation: bb-home-flow-v2-pen-b-k9o8z149rt 5.6s ease-in-out infinite;
}

/* Use the project's real app store image assets instead of synthetic inline marks. */
.bb-home-store-badge[b-k9o8z149rt] {
    min-width: 300px;
    min-height: 92px;
    grid-template-columns: 78px minmax(0, 1fr);
    gap: 1rem;
    padding: 0.78rem 1.05rem;
}

.bb-home-store-badge-icon[b-k9o8z149rt] {
    width: 78px;
    height: 78px;
    padding: 0.45rem;
    border-radius: 20px;
}

    .bb-home-store-badge-icon img[b-k9o8z149rt] {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: contain;
        object-position: center;
    }

.bb-home-store-badge-copy small[b-k9o8z149rt] {
    font-size: 0.75rem !important;
    letter-spacing: 0.075em;
}

.bb-home-store-badge-copy strong[b-k9o8z149rt] {
    font-size: 1.58rem !important;
    line-height: 1.02;
}

@media (max-width: 1400px) {
    .bb-home-step-anchor > .bb-home-flow-connector[b-k9o8z149rt] {
        width: min(1320px, calc(100vw - 0.5rem));
    }

    .bb-home-flow-connector-step-01[b-k9o8z149rt] {
        --bb-home-flow-height: 625px;
    }

    .bb-home-flow-connector-step-02[b-k9o8z149rt] {
        --bb-home-flow-height: 625px;
    }

    .bb-home-flow-connector-step-03[b-k9o8z149rt] {
        --bb-home-flow-height: 545px;
    }

    .bb-home-flow-connector-step-04[b-k9o8z149rt] {
        --bb-home-flow-height: 1080px;
    }

    .bb-home-flow-connector-step-05[b-k9o8z149rt] {
        --bb-home-flow-height: 640px;
    }

    .bb-home-flow-connector-step-06[b-k9o8z149rt] {
        --bb-home-flow-height: 590px;
    }
}

@media (max-width: 1180px) {
    .bb-home-step-anchor > .bb-home-flow-connector[b-k9o8z149rt] {
        display: none;
    }
}

@media (max-width: 760px) {
    .bb-home-store-badge[b-k9o8z149rt] {
        width: 100%;
        min-width: 0;
        grid-template-columns: 70px minmax(0, 1fr);
    }

    .bb-home-store-badge-icon[b-k9o8z149rt] {
        width: 70px;
        height: 70px;
    }

    .bb-home-store-badge-copy strong[b-k9o8z149rt] {
        font-size: 1.35rem !important;
    }
}

/* =========================================================
   BB-HOME-FLOW-V4
   Keep the approved drawing animation, but force every route
   into the outside margin and the empty gap between steps.
   Existing card widths and walkthrough grid are untouched.
   ========================================================= */

.bb-home-step-anchor > .bb-home-flow-connector-badge[b-k9o8z149rt] {
    left: 84.5%;
    top: 34%;
}

.bb-home-step-anchor > .bb-home-flow-connector-left .bb-home-flow-connector-badge[b-k9o8z149rt] {
    left: 15.5%;
}

.bb-home-step-anchor > .bb-home-flow-connector-track[b-k9o8z149rt] {
    opacity: 0.58;
}

/* Keep connector artwork above the page background but below readable content. */
.bb-home-step-anchor > .bb-home-flow-connector[b-k9o8z149rt] {
    z-index: 4;
}

.bb-home-walkthrough-visual[b-k9o8z149rt],
.bb-home-walkthrough-copy[b-k9o8z149rt] {
    position: relative;
    z-index: 6;
}

.bb-home-step-anchor[b-k9o8z149rt] {
    z-index: 8;
}

    .bb-home-step-anchor > .bb-home-step-label[b-k9o8z149rt] {
        z-index: 9;
    }


/* =========================================================
   BB-HOME-FOUNDING-50-01
   First 50 salons launch offer.
   ========================================================= */
.bb-home-founding-section[b-k9o8z149rt] {
    position: relative;
    overflow: hidden;
    width: min(1180px, 100%);
    margin: 2.4rem auto 0;
    padding: clamp(1.35rem, 3vw, 2.25rem);
    border-radius: 32px;
    background: radial-gradient(circle at 8% 8%, color-mix(in srgb, var(--bb-home-gold) 18%, transparent), transparent 28%), radial-gradient(circle at 92% 84%, color-mix(in srgb, var(--bb-home-secondary) 12%, transparent), transparent 32%), linear-gradient(145deg, color-mix(in srgb, var(--bb-home-primary) 96%, #020617), color-mix(in srgb, var(--bb-home-primary) 84%, #07111f));
    border: 1px solid color-mix(in srgb, var(--bb-home-gold) 28%, transparent);
    box-shadow: 0 30px 76px color-mix(in srgb, var(--bb-home-primary) 20%, transparent);
}

    .bb-home-founding-section[b-k9o8z149rt]::before {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        background: linear-gradient(115deg, rgba(255,255,255,0.10), transparent 34%), repeating-linear-gradient(135deg, rgba(255,255,255,0.04) 0 1px, transparent 1px 20px);
    }

.bb-home-founding-orbit[b-k9o8z149rt] {
    position: absolute;
    border-radius: 999px;
    pointer-events: none;
    border: 1px solid rgba(255,255,255,0.08);
}

.bb-home-founding-orbit-one[b-k9o8z149rt] {
    width: 330px;
    height: 330px;
    right: -150px;
    top: -165px;
}

.bb-home-founding-orbit-two[b-k9o8z149rt] {
    width: 220px;
    height: 220px;
    right: -95px;
    top: -108px;
    border-color: color-mix(in srgb, var(--bb-home-gold) 24%, transparent);
}

.bb-home-founding-header[b-k9o8z149rt],
.bb-home-founding-grid[b-k9o8z149rt],
.bb-home-founding-cta-row[b-k9o8z149rt] {
    position: relative;
    z-index: 2;
}

.bb-home-founding-header[b-k9o8z149rt] {
    max-width: 900px;
    display: grid;
    gap: 0.85rem;
}

.bb-home-founding-kicker[b-k9o8z149rt] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.58rem 0.86rem;
    color: #ffffff;
    font-size: 0.74rem;
    font-weight: 950;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    border-radius: 999px;
    background: color-mix(in srgb, var(--bb-home-gold) 22%, transparent);
    border: 1px solid color-mix(in srgb, var(--bb-home-gold) 42%, transparent);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.10);
}

.bb-home-page[b-k9o8z149rt]  .bb-home-founding-kicker .mud-icon-root {
    color: var(--bb-home-gold) !important;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-founding-title {
    max-width: 860px;
    color: #ffffff !important;
    font-size: clamp(2rem, 3.5vw, 3.35rem);
    font-weight: 950;
    line-height: 1.04;
    letter-spacing: -0.055em;
    text-wrap: balance;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-founding-intro {
    max-width: 820px;
    color: rgba(255,255,255,0.76) !important;
    font-size: 1rem;
    font-weight: 620;
    line-height: 1.65;
}

.bb-home-founding-grid[b-k9o8z149rt] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.9rem;
    margin-top: 1.6rem;
}

.bb-home-founding-card[b-k9o8z149rt] {
    --founding-accent: var(--bb-home-primary);
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.8rem;
    align-items: start;
    padding: 1rem;
    border-radius: 20px;
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.12);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.06);
    backdrop-filter: blur(16px);
    transition: transform 180ms ease, border-color 180ms ease, background 180ms ease;
}

    .bb-home-founding-card:hover[b-k9o8z149rt] {
        transform: translateY(-3px);
        background: rgba(255,255,255,0.11);
        border-color: color-mix(in srgb, var(--founding-accent) 48%, rgba(255,255,255,0.14));
    }

.bb-home-founding-card-primary[b-k9o8z149rt] {
    --founding-accent: var(--bb-home-primary);
}

.bb-home-founding-card-gold[b-k9o8z149rt] {
    --founding-accent: var(--bb-home-gold);
}

.bb-home-founding-card-secondary[b-k9o8z149rt] {
    --founding-accent: var(--bb-home-secondary);
}

.bb-home-founding-card-info[b-k9o8z149rt] {
    --founding-accent: var(--bb-home-info);
}

.bb-home-founding-card-wide[b-k9o8z149rt] {
    --founding-accent: var(--bb-home-gold);
    grid-column: 1 / -1;
    max-width: 760px;
}

.bb-home-founding-card-icon[b-k9o8z149rt] {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 15px;
    color: #ffffff;
    background: linear-gradient(135deg, var(--founding-accent), color-mix(in srgb, var(--founding-accent) 64%, var(--bb-home-primary)));
    box-shadow: 0 12px 28px color-mix(in srgb, var(--founding-accent) 20%, transparent);
}

.bb-home-page[b-k9o8z149rt]  .bb-home-founding-card-icon .mud-icon-root {
    color: #ffffff !important;
    font-size: 1.3rem !important;
}

.bb-home-founding-card > div[b-k9o8z149rt] {
    min-width: 0;
    display: grid;
    gap: 0.28rem;
}

.bb-home-founding-card strong[b-k9o8z149rt] {
    color: #ffffff;
    font-size: 0.98rem;
    font-weight: 950;
    line-height: 1.2;
}

.bb-home-founding-card p[b-k9o8z149rt] {
    margin: 0;
    color: rgba(255,255,255,0.68);
    font-size: 0.82rem;
    font-weight: 620;
    line-height: 1.48;
}

.bb-home-founding-cta-row[b-k9o8z149rt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1.3rem;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(255,255,255,0.10);
}

.bb-home-founding-spots[b-k9o8z149rt] {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

    .bb-home-founding-spots > strong[b-k9o8z149rt] {
        min-width: 70px;
        color: var(--bb-home-gold);
        font-size: clamp(2.6rem, 4vw, 4rem);
        font-weight: 950;
        line-height: 0.9;
        letter-spacing: -0.06em;
    }

    .bb-home-founding-spots > div[b-k9o8z149rt] {
        display: grid;
        gap: 0.12rem;
    }

    .bb-home-founding-spots span[b-k9o8z149rt] {
        color: #ffffff;
        font-size: 0.96rem;
        font-weight: 950;
    }

    .bb-home-founding-spots small[b-k9o8z149rt] {
        color: rgba(255,255,255,0.62);
        font-size: 0.78rem;
        font-weight: 700;
    }

.bb-home-page[b-k9o8z149rt]  .bb-home-founding-cta {
    white-space: nowrap;
    background: linear-gradient(135deg, var(--bb-home-gold), color-mix(in srgb, var(--bb-home-gold) 64%, var(--bb-home-primary))) !important;
    box-shadow: 0 18px 40px color-mix(in srgb, var(--bb-home-gold) 22%, transparent) !important;
}

/* Keep the locally approved Apple badge treatment. */
.bb-home-store-badge-apple .bb-home-store-badge-icon img[b-k9o8z149rt] {
    filter: brightness(0) invert(1);
    opacity: 0.96;
}

.bb-home-store-badge-apple .bb-home-store-badge-icon[b-k9o8z149rt] {
    background: linear-gradient(145deg, rgba(255,255,255,0.13), rgba(255,255,255,0.06));
    border-color: rgba(255,255,255,0.20);
}

@media (max-width: 1080px) {
    .bb-home-founding-grid[b-k9o8z149rt] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .bb-home-founding-section[b-k9o8z149rt] {
        padding: 1.15rem;
        border-radius: 24px;
    }

    .bb-home-founding-grid[b-k9o8z149rt] {
        grid-template-columns: 1fr;
    }

    .bb-home-founding-card-wide[b-k9o8z149rt] {
        grid-column: auto;
    }

    .bb-home-founding-cta-row[b-k9o8z149rt] {
        align-items: stretch;
        flex-direction: column;
    }

    .bb-home-page[b-k9o8z149rt]  .bb-home-founding-cta {
        width: 100%;
    }
}


/* Serbia salon-first launch */
.bb-home-launch-coming-soon[b-k9o8z149rt] {
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto;
    gap: 1rem;
    align-items: center;
    padding: 1rem 1.15rem;
    border: 1px solid color-mix(in srgb,var(--bb-home-secondary) 28%,var(--bb-home-divider));
    border-radius: 22px;
    background: linear-gradient(135deg,color-mix(in srgb,var(--bb-home-secondary) 9%,var(--bb-home-surface)),var(--bb-home-surface));
    box-shadow: 0 16px 38px color-mix(in srgb,var(--bb-home-primary) 7%,transparent);
}

    .bb-home-launch-coming-soon > span[b-k9o8z149rt] {
        width: 48px;
        height: 48px;
        display: grid;
        place-items: center;
        color: var(--bb-home-primary);
        border-radius: 16px;
        background: #EFE2C6;
    }

    .bb-home-launch-coming-soon div[b-k9o8z149rt] {
        display: grid;
        gap: .2rem;
    }

    .bb-home-launch-coming-soon strong[b-k9o8z149rt] {
        color: var(--bb-home-primary);
        font-weight: 950;
    }

    .bb-home-launch-coming-soon p[b-k9o8z149rt] {
        margin: 0;
        color: var(--bb-home-text-secondary);
        font-size: .84rem;
        line-height: 1.45;
    }

.bb-home-customer-coming-soon-pill[b-k9o8z149rt] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .65rem .85rem;
    color: var(--bb-home-primary);
    font-size: .8rem;
    font-weight: 900;
    border: 1px solid #E5DCCE;
    border-radius: 999px;
    background: #F7F3EA;
}

@media(max-width:700px) {
    .bb-home-launch-coming-soon[b-k9o8z149rt] {
        grid-template-columns: 1fr
    }

        .bb-home-launch-coming-soon > span[b-k9o8z149rt] {
            width: 42px;
            height: 42px
        }
}


/* BB-CUSTOMER-LIVE-BOOKING-SOON-01 */
.bb-home-customer-account-launch[b-k9o8z149rt] {
    border-color: color-mix(in srgb, var(--bb-home-secondary) 24%, var(--bb-home-divider)) !important;
    background: radial-gradient(circle at 92% 12%, color-mix(in srgb, var(--bb-home-secondary) 14%, transparent), transparent 30%), linear-gradient(135deg, color-mix(in srgb, var(--bb-home-primary) 6%, var(--bb-home-surface)), color-mix(in srgb, var(--bb-home-secondary) 9%, var(--bb-home-surface))) !important;
}

.bb-home-launch-actions[b-k9o8z149rt],
.bb-home-early-access-actions[b-k9o8z149rt] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.6rem;
}

.bb-home-page[b-k9o8z149rt]  .bb-home-launch-actions .mud-button-root,
.bb-home-page[b-k9o8z149rt]  .bb-home-early-access-actions .mud-button-root {
    min-height: 44px;
    border-radius: 10px !important;
    font-weight: 950;
    white-space: nowrap;
}

@media (max-width: 960px) {
    .bb-home-launch-actions[b-k9o8z149rt],
    .bb-home-early-access-actions[b-k9o8z149rt] {
        width: 100%;
        justify-content: flex-start;
    }
}

@media (max-width: 600px) {
    .bb-home-launch-actions[b-k9o8z149rt],
    .bb-home-early-access-actions[b-k9o8z149rt] {
        display: grid;
    }

    .bb-home-page[b-k9o8z149rt]  .bb-home-launch-actions .mud-button-root,
    .bb-home-page[b-k9o8z149rt]  .bb-home-early-access-actions .mud-button-root {
        width: 100%;
    }
}
/* /Components/Pages/Legal/LegalDocument.razor.rz.scp.css */
.bb-legal-page[b-ehkejyb9zz] {
    display: grid;
    gap: 32px;
    padding: 20px 0 10px;
}

.bb-legal-hero[b-ehkejyb9zz] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(260px, .55fr);
    gap: 28px;
    overflow: hidden;
    padding: clamp(28px, 5vw, 54px);
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 12%, var(--mud-palette-lines-default));
    border-radius: 28px;
    background: radial-gradient(circle at 85% 16%, color-mix(in srgb, var(--mud-palette-secondary) 20%, transparent), transparent 28%), linear-gradient(140deg, color-mix(in srgb, var(--mud-palette-primary) 7%, var(--mud-palette-surface)), var(--mud-palette-surface));
    box-shadow: 0 24px 70px color-mix(in srgb, var(--mud-palette-primary) 8%, transparent);
}

    .bb-legal-hero[b-ehkejyb9zz]::after {
        content: "";
        position: absolute;
        right: -80px;
        bottom: -120px;
        width: 260px;
        height: 260px;
        border-radius: 999px;
        background: color-mix(in srgb, var(--mud-palette-secondary) 10%, transparent);
        pointer-events: none;
    }

.bb-legal-hero-copy[b-ehkejyb9zz],
.bb-legal-trust-card[b-ehkejyb9zz] {
    position: relative;
    z-index: 1;
}

.bb-legal-eyebrow[b-ehkejyb9zz] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
    color: var(--mud-palette-primary);
    font-size: .76rem;
    font-weight: 950;
    letter-spacing: .11em;
    text-transform: uppercase;
}

.bb-legal-title[b-ehkejyb9zz] {
    max-width: 760px;
    color: var(--mud-palette-text-primary) !important;
    font-weight: 950 !important;
    letter-spacing: -.045em !important;
    line-height: 1.03 !important;
}

.bb-legal-summary[b-ehkejyb9zz] {
    max-width: 760px;
    margin-top: 18px !important;
    color: var(--mud-palette-text-secondary) !important;
    font-size: 1.04rem !important;
    line-height: 1.75 !important;
}

.bb-legal-meta[b-ehkejyb9zz] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 22px;
}

    .bb-legal-meta span[b-ehkejyb9zz] {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        padding: 8px 11px;
        border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 12%, var(--mud-palette-lines-default));
        border-radius: 999px;
        color: var(--mud-palette-text-secondary);
        background: color-mix(in srgb, var(--mud-palette-surface) 88%, transparent);
        font-size: .78rem;
        font-weight: 800;
    }

.bb-legal-trust-card[b-ehkejyb9zz] {
    align-self: center;
    display: grid;
    gap: 9px;
    padding: 22px;
    border: 1px solid color-mix(in srgb, var(--mud-palette-secondary) 25%, transparent);
    border-radius: 20px;
    background: color-mix(in srgb, var(--mud-palette-surface) 84%, transparent);
    backdrop-filter: blur(12px);
}

.bb-legal-trust-icon[b-ehkejyb9zz] {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: 14px;
    color: var(--mud-palette-primary);
    background: color-mix(in srgb, var(--mud-palette-secondary) 18%, transparent);
}

.bb-legal-trust-card strong[b-ehkejyb9zz] {
    color: var(--mud-palette-text-primary);
    font-size: 1rem;
    font-weight: 950;
}

.bb-legal-trust-card p[b-ehkejyb9zz] {
    margin: 0;
    color: var(--mud-palette-text-secondary);
    font-size: .87rem;
    line-height: 1.55;
}

.bb-legal-layout[b-ehkejyb9zz] {
    display: grid;
    grid-template-columns: 248px minmax(0, 1fr);
    gap: 28px;
    align-items: start;
}

.bb-legal-navigation[b-ehkejyb9zz] {
    position: sticky;
    top: 92px;
    display: grid;
    gap: 5px;
    padding: 16px;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 18px;
    background: var(--mud-palette-surface);
    box-shadow: 0 12px 38px color-mix(in srgb, var(--mud-palette-primary) 5%, transparent);
}

    .bb-legal-navigation > strong[b-ehkejyb9zz] {
        padding: 4px 10px 10px;
        color: var(--mud-palette-text-secondary);
        font-size: .72rem;
        font-weight: 950;
        letter-spacing: .09em;
        text-transform: uppercase;
    }

.bb-legal-navigation-link[b-ehkejyb9zz] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 42px;
    padding: 9px 10px;
    border-radius: 11px;
    color: var(--mud-palette-text-secondary);
    font-size: .82rem;
    font-weight: 750;
    text-decoration: none;
    cursor: pointer;
    transition: background 160ms ease, color 160ms ease, transform 160ms ease;
}

    .bb-legal-navigation-link:hover[b-ehkejyb9zz] {
        color: var(--mud-palette-primary);
        background: color-mix(in srgb, var(--mud-palette-primary) 8%, transparent);
        transform: translateX(2px);
        text-decoration: none;
    }

    .bb-legal-navigation-link.is-active[b-ehkejyb9zz] {
        color: #ffffff;
        background: linear-gradient( 135deg, var(--mud-palette-primary), color-mix(in srgb, var(--mud-palette-primary) 82%, #000000));
        box-shadow: 0 10px 24px color-mix(in srgb, var(--mud-palette-primary) 20%, transparent);
        transform: none;
        text-decoration: none;
    }

    .bb-legal-navigation-link[b-ehkejyb9zz]  .mud-icon-root {
        color: currentColor !important;
    }

.bb-legal-content[b-ehkejyb9zz] {
    display: grid;
    gap: 16px;
    min-width: 0;
}

.bb-legal-section[b-ehkejyb9zz] {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 16px;
    padding: 24px;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 18px;
    background: var(--mud-palette-surface);
}

.bb-legal-section-number[b-ehkejyb9zz] {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 11px;
    color: var(--mud-palette-primary);
    background: color-mix(in srgb, var(--mud-palette-primary) 8%, transparent);
    font-size: .78rem;
    font-weight: 950;
}

.bb-legal-section-title[b-ehkejyb9zz] {
    margin-bottom: 11px !important;
    color: var(--mud-palette-text-primary) !important;
    font-weight: 920 !important;
    letter-spacing: -.02em !important;
}

.bb-legal-section p[b-ehkejyb9zz] {
    margin: 0 0 12px;
    color: var(--mud-palette-text-secondary);
    line-height: 1.75;
}

    .bb-legal-section p:last-child[b-ehkejyb9zz] {
        margin-bottom: 0;
    }

.bb-legal-identity-card[b-ehkejyb9zz] {
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--mud-palette-secondary) 25%, var(--mud-palette-lines-default));
    border-radius: 20px;
    background: linear-gradient(145deg, color-mix(in srgb, var(--mud-palette-secondary) 8%, var(--mud-palette-surface)), var(--mud-palette-surface));
}

.bb-legal-identity-heading[b-ehkejyb9zz] {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 20px 22px;
    border-bottom: 1px solid color-mix(in srgb, var(--mud-palette-lines-default) 75%, transparent);
}

    .bb-legal-identity-heading .mud-icon-root[b-ehkejyb9zz] {
        color: var(--mud-palette-primary);
    }

    .bb-legal-identity-heading div[b-ehkejyb9zz] {
        display: grid;
        gap: 2px;
    }

    .bb-legal-identity-heading strong[b-ehkejyb9zz] {
        color: var(--mud-palette-text-primary);
        font-weight: 950;
    }

    .bb-legal-identity-heading span[b-ehkejyb9zz] {
        color: var(--mud-palette-text-secondary);
        font-size: .8rem;
    }

.bb-legal-identity-card dl[b-ehkejyb9zz] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    margin: 0;
}

    .bb-legal-identity-card dl > div[b-ehkejyb9zz] {
        min-width: 0;
        padding: 17px 22px;
        border-bottom: 1px solid color-mix(in srgb, var(--mud-palette-lines-default) 70%, transparent);
    }

.bb-legal-identity-card dt[b-ehkejyb9zz] {
    margin-bottom: 4px;
    color: var(--mud-palette-text-secondary);
    font-size: .7rem;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.bb-legal-identity-card dd[b-ehkejyb9zz] {
    margin: 0;
    overflow-wrap: anywhere;
    color: var(--mud-palette-text-primary);
    font-weight: 780;
}

.bb-legal-identity-card a[b-ehkejyb9zz] {
    color: var(--mud-palette-primary);
}

.bb-legal-document-footer[b-ehkejyb9zz] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 18px 20px;
    border-radius: 16px;
    color: #ffffff;
    background: linear-gradient(135deg, var(--mud-palette-primary), color-mix(in srgb, var(--mud-palette-primary) 78%, var(--mud-palette-secondary)));
}

    .bb-legal-document-footer[b-ehkejyb9zz]  .mud-icon-root {
        flex: 0 0 auto;
        color: #ffffff !important;
    }

    .bb-legal-document-footer div[b-ehkejyb9zz] {
        display: grid;
        gap: 3px;
    }

    .bb-legal-document-footer strong[b-ehkejyb9zz] {
        color: #ffffff;
        font-weight: 950;
    }

    .bb-legal-document-footer span[b-ehkejyb9zz] {
        color: rgba(255, 255, 255, 0.86);
        font-size: .82rem;
        line-height: 1.5;
    }

@media (max-width: 960px) {
    .bb-legal-hero[b-ehkejyb9zz],
    .bb-legal-layout[b-ehkejyb9zz] {
        grid-template-columns: 1fr;
    }

    .bb-legal-navigation[b-ehkejyb9zz] {
        position: static;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

        .bb-legal-navigation > strong[b-ehkejyb9zz] {
            grid-column: 1 / -1;
        }
}

@media (max-width: 600px) {
    .bb-legal-page[b-ehkejyb9zz] {
        gap: 22px;
        padding-top: 6px;
    }

    .bb-legal-hero[b-ehkejyb9zz] {
        padding: 24px 20px;
        border-radius: 20px;
    }

    .bb-legal-title[b-ehkejyb9zz] {
        font-size: 2.05rem !important;
    }

    .bb-legal-navigation[b-ehkejyb9zz] {
        grid-template-columns: 1fr;
    }

    .bb-legal-section[b-ehkejyb9zz] {
        grid-template-columns: 1fr;
        padding: 20px;
    }

    .bb-legal-identity-card dl[b-ehkejyb9zz] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/MyAppointments.razor.rz.scp.css */
.my-appointments-page[b-gi09voklg6] {
    --my-appointments-primary: var(--mud-palette-primary, #15324b);
    --my-appointments-secondary: var(--mud-palette-secondary, #b89b5e);
    --my-appointments-surface: #fffdf8;
    --my-appointments-surface-soft: #f7f3ea;
    --my-appointments-text-primary: #15324b;
    --my-appointments-text-secondary: rgba(21, 50, 75, 0.68);
    --my-appointments-text-muted: rgba(21, 50, 75, 0.58);
    --my-appointments-border: rgba(21, 50, 75, 0.12);
    --my-appointments-border-strong: rgba(184, 155, 94, 0.28);
    --my-appointments-primary-soft: rgba(21, 50, 75, 0.08);
    --my-appointments-secondary-soft: rgba(184, 155, 94, 0.14);
    --my-appointments-shadow: rgba(21, 50, 75, 0.1);
    padding-bottom: 3rem;
}

    .my-appointments-page[b-gi09voklg6]  .my-appointments-hero-panel {
        position: relative;
        overflow: hidden;
        padding: 2rem;
        border: 1px solid var(--my-appointments-border-strong);
        background: radial-gradient(circle at 12% 20%, rgba(184, 155, 94, 0.18), transparent 32%), linear-gradient(135deg, rgba(255, 253, 248, 0.98), rgba(247, 243, 234, 0.94));
        box-shadow: 0 24px 60px rgba(21, 50, 75, 0.12);
    }

        .my-appointments-page[b-gi09voklg6]  .my-appointments-hero-panel::before {
            content: "";
            position: absolute;
            inset: -40%;
            background: radial-gradient(circle at 15% 25%, rgba(255, 255, 255, 0.58), transparent 28%), radial-gradient(circle at 85% 10%, rgba(184, 155, 94, 0.18), transparent 28%), radial-gradient(circle at 75% 90%, rgba(21, 50, 75, 0.055), transparent 32%);
            pointer-events: none;
        }

        .my-appointments-page[b-gi09voklg6]  .my-appointments-hero-panel > .mud-grid {
            position: relative;
            z-index: 1;
        }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-hero-top {
        gap: 1rem;
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-hero-avatar {
        width: 56px;
        height: 56px;
        box-shadow: 0 14px 30px rgba(21, 50, 75, 0.18);
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-eyebrow {
        color: var(--my-appointments-text-muted);
        font-weight: 900;
        letter-spacing: 0.09em;
        text-transform: uppercase;
        font-size: 0.74rem;
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-title {
        color: var(--my-appointments-text-primary);
        line-height: 1.05;
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-subtitle {
        color: var(--my-appointments-text-primary);
        max-width: 760px;
        font-size: 1.05rem;
        font-weight: 650;
        line-height: 1.55;
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-hero-summary {
        padding: 1.25rem;
        background: rgba(255, 253, 248, 0.78);
        border: 1px solid rgba(255, 255, 255, 0.78);
        backdrop-filter: blur(14px);
        box-shadow: 0 18px 42px rgba(21, 50, 75, 0.1);
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-summary-label,
    .my-appointments-page[b-gi09voklg6]  .my-appointments-muted {
        color: var(--my-appointments-text-secondary);
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-summary-value {
        color: var(--my-appointments-text-primary);
        font-weight: 900;
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-stat-card {
        min-height: 132px;
        padding: 1.25rem;
        border: 1px solid var(--my-appointments-border);
        box-shadow: 0 14px 34px rgba(21, 50, 75, 0.085);
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-stat-upcoming {
        background: linear-gradient(135deg, rgba(21, 50, 75, 0.085), rgba(255, 253, 248, 0.96));
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-stat-pending {
        background: linear-gradient(135deg, rgba(184, 155, 94, 0.16), rgba(255, 253, 248, 0.96));
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-stat-confirmed {
        background: linear-gradient(135deg, rgba(21, 50, 75, 0.075), rgba(247, 243, 234, 0.88));
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-stat-history {
        background: linear-gradient(135deg, rgba(21, 50, 75, 0.055), rgba(255, 253, 248, 0.96));
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-stat-caption {
        color: var(--my-appointments-text-secondary);
        font-size: 0.85rem;
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-toolbar,
    .my-appointments-page[b-gi09voklg6]  .my-appointments-panel,
    .my-appointments-page[b-gi09voklg6]  .my-appointments-side-panel,
    .my-appointments-page[b-gi09voklg6]  .my-appointments-message-panel {
        padding: 1.5rem;
        background: rgba(255, 253, 248, 0.98);
        border: 1px solid var(--my-appointments-border);
        box-shadow: 0 16px 42px rgba(21, 50, 75, 0.085);
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-toolbar {
        background: linear-gradient(135deg, rgba(247, 243, 234, 0.88), rgba(255, 253, 248, 0.98));
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-toolbar-content,
    .my-appointments-page[b-gi09voklg6]  .my-appointments-section-header {
        gap: 1rem;
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-toolbar-actions {
        flex-wrap: wrap;
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-alert {
        box-shadow: 0 12px 30px rgba(21, 50, 75, 0.065);
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-empty-state {
        padding: 2rem;
        border: 1px dashed rgba(184, 155, 94, 0.52);
        background: linear-gradient(135deg, rgba(247, 243, 234, 0.88), rgba(255, 253, 248, 0.98));
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-empty-avatar {
        width: 64px;
        height: 64px;
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointment-card {
        padding: 1.25rem;
        border: 1px solid var(--my-appointments-border);
        background: rgba(255, 253, 248, 0.98);
        box-shadow: 0 10px 28px rgba(21, 50, 75, 0.065);
        transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
    }

        .my-appointments-page[b-gi09voklg6]  .my-appointment-card:hover {
            transform: translateY(-2px);
            border-color: rgba(184, 155, 94, 0.34);
            box-shadow: 0 18px 44px rgba(21, 50, 75, 0.11);
        }

    .my-appointments-page[b-gi09voklg6]  .my-appointment-card-compact {
        height: 100%;
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointment-card-header {
        gap: 1rem;
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointment-info-card {
        height: 100%;
        padding: 0.9rem;
        border: 1px solid var(--my-appointments-border);
        background: linear-gradient(135deg, rgba(247, 243, 234, 0.84), rgba(255, 253, 248, 0.98));
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointment-actions {
        flex-wrap: wrap;
    }

        .my-appointments-page[b-gi09voklg6]  .my-appointment-actions .mud-button-root {
            min-height: 44px;
            min-width: 150px;
        }

    .my-appointments-page[b-gi09voklg6]  .my-appointment-inline-cancel {
        padding: 1rem;
        border: 1px solid rgba(239, 68, 68, 0.22);
        background: linear-gradient(135deg, rgba(239, 68, 68, 0.055), rgba(255, 253, 248, 0.96));
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-progress {
        position: relative;
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-progress-step {
        position: relative;
        display: grid;
        grid-template-columns: 18px 1fr;
        gap: 0.85rem;
        padding: 0.2rem 0 1.15rem;
        color: rgba(21, 50, 75, 0.42);
    }

        .my-appointments-page[b-gi09voklg6]  .my-appointments-progress-step:not(:last-child)::after {
            content: "";
            position: absolute;
            left: 8px;
            top: 22px;
            bottom: -3px;
            width: 2px;
            background: rgba(21, 50, 75, 0.12);
        }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-progress-dot {
        position: relative;
        z-index: 1;
        width: 18px;
        height: 18px;
        margin-top: 0.15rem;
        border-radius: 999px;
        border: 3px solid rgba(21, 50, 75, 0.22);
        background: var(--my-appointments-surface);
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-progress-step.is-complete {
        color: var(--my-appointments-text-primary);
    }

        .my-appointments-page[b-gi09voklg6]  .my-appointments-progress-step.is-complete .my-appointments-progress-dot {
            border-color: var(--my-appointments-secondary);
            background: var(--my-appointments-secondary);
            box-shadow: 0 0 0 5px rgba(184, 155, 94, 0.16);
        }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-progress-step.is-active {
        color: var(--my-appointments-text-primary);
    }

        .my-appointments-page[b-gi09voklg6]  .my-appointments-progress-step.is-active .my-appointments-progress-dot {
            border-color: var(--my-appointments-secondary);
            background: var(--my-appointments-surface);
            box-shadow: 0 0 0 6px rgba(184, 155, 94, 0.18);
        }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-progress-row {
        width: 100%;
        gap: 0.75rem;
    }

        .my-appointments-page[b-gi09voklg6]  .my-appointments-progress-row .mud-chip {
            flex-shrink: 0;
        }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-next-booking {
        padding: 0.85rem;
        border: 1px solid var(--my-appointments-border);
        background: linear-gradient(135deg, rgba(247, 243, 234, 0.84), rgba(255, 253, 248, 0.98));
        box-shadow: 0 8px 20px rgba(21, 50, 75, 0.05);
    }

        .my-appointments-page[b-gi09voklg6]  .my-appointments-next-booking:hover {
            border-color: rgba(184, 155, 94, 0.32);
            box-shadow: 0 12px 28px rgba(21, 50, 75, 0.085);
        }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-auto-refresh-alert {
        border-radius: 14px;
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-status-guide-item {
        padding: 0.9rem;
        border: 1px solid var(--my-appointments-border);
        background: linear-gradient(135deg, rgba(247, 243, 234, 0.84), rgba(255, 253, 248, 0.98));
    }

@media (max-width: 960px) {
    .my-appointments-page[b-gi09voklg6]  .my-appointments-hero-panel {
        padding: 1.5rem;
    }

    .my-appointments-page[b-gi09voklg6]  .my-appointments-title {
        font-size: 2rem;
    }
}

@media (max-width: 600px) {
    .my-appointments-page[b-gi09voklg6] {
        padding-bottom: 2rem;
    }

        .my-appointments-page[b-gi09voklg6]  .my-appointments-hero-panel,
        .my-appointments-page[b-gi09voklg6]  .my-appointments-toolbar,
        .my-appointments-page[b-gi09voklg6]  .my-appointments-panel,
        .my-appointments-page[b-gi09voklg6]  .my-appointments-side-panel,
        .my-appointments-page[b-gi09voklg6]  .my-appointments-message-panel,
        .my-appointments-page[b-gi09voklg6]  .my-appointment-card {
            padding: 1rem;
        }

        .my-appointments-page[b-gi09voklg6]  .my-appointments-hero-top,
        .my-appointments-page[b-gi09voklg6]  .my-appointments-toolbar-content,
        .my-appointments-page[b-gi09voklg6]  .my-appointments-section-header,
        .my-appointments-page[b-gi09voklg6]  .my-appointment-card-header,
        .my-appointments-page[b-gi09voklg6]  .my-appointment-actions,
        .my-appointments-page[b-gi09voklg6]  .my-appointments-toolbar-actions {
            flex-direction: column;
            align-items: flex-start !important;
        }

            .my-appointments-page[b-gi09voklg6]  .my-appointment-actions,
            .my-appointments-page[b-gi09voklg6]  .my-appointment-actions .mud-button-root,
            .my-appointments-page[b-gi09voklg6]  .my-appointments-toolbar-actions,
            .my-appointments-page[b-gi09voklg6]  .my-appointments-toolbar-actions .mud-button-root {
                width: 100%;
            }

        .my-appointments-page[b-gi09voklg6]  .my-appointments-title {
            font-size: 1.85rem;
        }

        .my-appointments-page[b-gi09voklg6]  .my-appointments-hero-summary {
            margin-top: 1rem;
        }
}
/* /Components/Pages/Notifications.razor.rz.scp.css */
.notifications-page[b-7t797lao16],
.notifications-page *[b-7t797lao16],
.notifications-page[b-7t797lao16]  * {
    font-family: var(--mud-typography-default-family, inherit) !important;
}

    .notifications-page button[b-7t797lao16],
    .notifications-page input[b-7t797lao16],
    .notifications-page textarea[b-7t797lao16],
    .notifications-page select[b-7t797lao16] {
        font-family: var(--mud-typography-default-family, inherit) !important;
    }

.notifications-page[b-7t797lao16] {
    position: relative;
    padding: 18px 0 44px;
}

    .notifications-page[b-7t797lao16]  .mud-button-root {
        border-radius: 10px !important;
        font-family: var(--mud-typography-default-family, inherit) !important;
        font-weight: 900;
        letter-spacing: 0.025em;
    }

    .notifications-page[b-7t797lao16]  .mud-button-label,
    .notifications-page[b-7t797lao16]  .mud-typography,
    .notifications-page[b-7t797lao16]  .mud-input,
    .notifications-page[b-7t797lao16]  .mud-input-control,
    .notifications-page[b-7t797lao16]  .mud-input-slot,
    .notifications-page[b-7t797lao16]  .mud-chip,
    .notifications-page[b-7t797lao16]  .mud-chip-content {
        font-family: var(--mud-typography-default-family, inherit) !important;
    }

    .notifications-page[b-7t797lao16]  .mud-input-root {
        border-radius: 10px !important;
    }

.notifications-hero[b-7t797lao16] {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    padding: 30px;
    border-radius: 28px;
    background: radial-gradient(circle at 16% 18%, color-mix(in srgb, var(--mud-palette-primary) 16%, transparent), transparent 30%), radial-gradient(circle at 90% 8%, color-mix(in srgb, var(--mud-palette-secondary) 16%, transparent), transparent 32%), linear-gradient(135deg, color-mix(in srgb, var(--mud-palette-surface) 96%, var(--mud-palette-primary)) 0%, var(--mud-palette-surface) 58%, color-mix(in srgb, var(--mud-palette-surface) 93%, var(--mud-palette-secondary)) 100%);
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 12%, var(--mud-palette-divider));
    box-shadow: 0 24px 70px color-mix(in srgb, var(--mud-palette-primary) 10%, transparent);
}

    .notifications-hero[b-7t797lao16]::after {
        content: "";
        position: absolute;
        right: -70px;
        bottom: -100px;
        width: 220px;
        height: 220px;
        border-radius: 999px;
        background: color-mix(in srgb, var(--mud-palette-secondary) 12%, transparent);
        pointer-events: none;
    }

.notifications-hero-content[b-7t797lao16],
.notifications-hero-actions[b-7t797lao16] {
    position: relative;
    z-index: 2;
}

.notifications-hero-actions[b-7t797lao16] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.notifications-page[b-7t797lao16]  .notifications-eyebrow {
    color: var(--mud-palette-primary) !important;
    font-weight: 950;
    letter-spacing: 0.14em;
}

.notifications-page[b-7t797lao16]  .notifications-title {
    color: var(--mud-palette-text-primary) !important;
    font-weight: 950;
    letter-spacing: -0.055em;
}

.notifications-page[b-7t797lao16]  .notifications-subtitle {
    max-width: 680px;
    color: var(--mud-palette-text-secondary) !important;
    line-height: 1.65;
    font-weight: 600;
}

.notifications-page[b-7t797lao16]  .notifications-side-card,
.notifications-page[b-7t797lao16]  .notifications-list-card,
.notifications-page[b-7t797lao16]  .notifications-state-card {
    border-radius: 24px;
    background: color-mix(in srgb, var(--mud-palette-surface) 96%, var(--mud-palette-primary));
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 10%, var(--mud-palette-divider));
    box-shadow: 0 20px 58px color-mix(in srgb, var(--mud-palette-primary) 8%, transparent);
}

.notifications-page[b-7t797lao16]  .notifications-side-card,
.notifications-page[b-7t797lao16]  .notifications-list-card {
    padding: 22px;
}

.notifications-page[b-7t797lao16]  .notifications-state-card {
    min-height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 32px;
}

.notifications-page[b-7t797lao16]  .notifications-card-title {
    color: var(--mud-palette-text-primary) !important;
    font-weight: 950;
    letter-spacing: -0.025em;
}

.notifications-page[b-7t797lao16]  .notifications-muted {
    color: var(--mud-palette-text-secondary) !important;
    font-weight: 600;
    line-height: 1.55;
}

.notifications-summary-grid[b-7t797lao16] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.notifications-summary-item[b-7t797lao16] {
    min-width: 0;
    min-height: 84px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 4px;
    padding: 14px 10px;
    overflow: hidden;
    border: 1px solid color-mix( in srgb, var(--mud-palette-primary) 9%, transparent);
    border-radius: 16px;
    background: color-mix( in srgb, var(--mud-palette-primary) 6%, transparent);
}

.notifications-summary-value[b-7t797lao16] {
    max-width: 100%;
    color: var(--mud-palette-primary);
    font-size: 1.6rem;
    font-weight: 950;
    line-height: 1;
}

.notifications-summary-label[b-7t797lao16] {
    display: block;
    width: 100%;
    max-width: 100%;
    color: var(--mud-palette-text-secondary);
    font-size: 0.66rem;
    font-weight: 850;
    line-height: 1.2;
    letter-spacing: 0.01em;
    text-transform: uppercase;
    white-space: normal;
    overflow-wrap: normal;
    word-break: normal;
    text-overflow: clip;
}


.notifications-page[b-7t797lao16]  .notifications-filter-label {
    color: var(--mud-palette-text-primary) !important;
    font-weight: 900;
}

.notifications-page[b-7t797lao16]  .notifications-filter-button {
    justify-content: flex-start !important;
    border-radius: 10px !important;
    font-weight: 850 !important;
}

.notifications-list-header[b-7t797lao16] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}

.notifications-page[b-7t797lao16]  .notifications-search {
    width: min(320px, 100%);
}

.notifications-search-highlight[b-7t797lao16] {
    display: inline;
    padding: 0 3px;
    color: var(--mud-palette-primary);
    font-weight: 950;
    border-radius: 6px;
    background: color-mix(in srgb, var(--mud-palette-secondary) 22%, transparent);
    box-shadow: inset 0 -1px 0 color-mix(in srgb, var(--mud-palette-secondary) 34%, transparent);
}

.notifications-empty[b-7t797lao16] {
    min-height: 320px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    text-align: center;
    padding: 40px 22px;
}

.notifications-empty-icon[b-7t797lao16] {
    width: 70px;
    height: 70px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--mud-palette-primary);
    border-radius: 20px;
    background: color-mix(in srgb, var(--mud-palette-primary) 9%, transparent);
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 12%, transparent);
}

.notifications-page[b-7t797lao16]  .notifications-empty-title {
    color: var(--mud-palette-text-primary) !important;
    font-weight: 950;
}

.notifications-list[b-7t797lao16] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.notifications-page[b-7t797lao16]  .notification-card {
    padding: 16px;
    border-radius: 18px;
    background: var(--mud-palette-surface);
    border: 1px solid color-mix(in srgb, var(--mud-palette-divider) 82%, transparent);
    box-shadow: 0 12px 34px color-mix(in srgb, var(--mud-palette-primary) 5%, transparent);
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

    .notifications-page[b-7t797lao16]  .notification-card:hover {
        transform: translateY(-2px);
        border-color: color-mix(in srgb, var(--mud-palette-primary) 16%, var(--mud-palette-divider));
        box-shadow: 0 16px 40px color-mix(in srgb, var(--mud-palette-primary) 9%, transparent);
    }

.notifications-page[b-7t797lao16]  .notification-card-unread {
    background: linear-gradient(135deg, color-mix(in srgb, var(--mud-palette-primary) 7%, var(--mud-palette-surface)), color-mix(in srgb, var(--mud-palette-secondary) 5%, var(--mud-palette-surface)));
    border-color: color-mix(in srgb, var(--mud-palette-secondary) 20%, var(--mud-palette-divider));
}

.notifications-page[b-7t797lao16]  .notification-card-archived {
    opacity: 0.78;
    background: color-mix(in srgb, var(--mud-palette-surface) 92%, var(--mud-palette-background));
}

.notification-card-main[b-7t797lao16] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.notification-select-button[b-7t797lao16] {
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--mud-palette-text-secondary);
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 12%, var(--mud-palette-divider));
    border-radius: 10px;
    background: color-mix(in srgb, var(--mud-palette-surface) 82%, transparent);
    cursor: pointer;
    transition: color 180ms ease, background 180ms ease, transform 180ms ease;
}

    .notification-select-button:hover[b-7t797lao16] {
        transform: translateY(-1px);
        color: var(--mud-palette-primary);
        background: color-mix(in srgb, var(--mud-palette-primary) 8%, transparent);
    }

.notification-select-button-selected[b-7t797lao16] {
    color: var(--mud-palette-secondary);
    background: color-mix(in srgb, var(--mud-palette-secondary) 11%, transparent);
    border-color: color-mix(in srgb, var(--mud-palette-secondary) 26%, transparent);
}

.notification-select-button[b-7t797lao16]  .mud-icon-root {
    color: inherit;
}

.notification-content-button[b-7t797lao16] {
    min-width: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 7px;
    color: inherit;
    text-align: left;
    border: 0;
    background: transparent;
    cursor: pointer;
    padding: 0;
}

.notification-title-row[b-7t797lao16] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.notification-title[b-7t797lao16] {
    min-width: 0;
    color: var(--mud-palette-text-primary);
    font-size: 0.98rem;
    font-weight: 950;
    line-height: 1.28;
}

.notification-message[b-7t797lao16] {
    color: var(--mud-palette-text-secondary);
    font-size: 0.88rem;
    font-weight: 650;
    line-height: 1.5;
}

.notification-meta[b-7t797lao16] {
    color: color-mix(in srgb, var(--mud-palette-text-secondary) 78%, transparent);
    font-size: 0.76rem;
    font-weight: 750;
    letter-spacing: 0.01em;
}

.notification-card-actions[b-7t797lao16] {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
    padding-left: 46px;
}

    .notification-card-actions[b-7t797lao16]  .mud-button-root {
        min-height: 34px;
        padding-inline: 10px;
        border-radius: 10px !important;
        font-size: 0.76rem;
        font-weight: 900;
        letter-spacing: 0.035em;
        text-transform: uppercase;
    }

.notification-title-row[b-7t797lao16]  .mud-chip {
    border-radius: 10px;
    font-weight: 850;
}

@media (max-width: 960px) {
    .notifications-hero[b-7t797lao16],
    .notifications-list-header[b-7t797lao16] {
        align-items: stretch;
        flex-direction: column;
    }

    .notifications-hero-actions[b-7t797lao16] {
        justify-content: flex-start;
    }

    .notifications-page[b-7t797lao16]  .notifications-search {
        width: 100%;
    }
}

@media (max-width: 600px) {
    .notifications-page[b-7t797lao16] {
        padding-top: 10px;
    }

    .notifications-hero[b-7t797lao16] {
        padding: 22px;
        border-radius: 22px;
    }

    .notifications-page[b-7t797lao16]  .notifications-title {
        font-size: 2rem;
    }

    .notifications-page[b-7t797lao16]  .notifications-side-card,
    .notifications-page[b-7t797lao16]  .notifications-list-card {
        padding: 16px;
        border-radius: 18px;
    }

    .notifications-summary-grid[b-7t797lao16] {
        grid-template-columns: 1fr;
    }

    .notification-card-main[b-7t797lao16] {
        gap: 10px;
    }

    .notification-title-row[b-7t797lao16] {
        flex-direction: column;
        align-items: flex-start;
    }

    .notification-card-actions[b-7t797lao16] {
        justify-content: flex-start;
        padding-left: 0;
    }
}
/* /Components/Pages/NotificationTemplates.razor.rz.scp.css */
.template-admin-page[b-ulou1yoa5j] {
    position: relative;
    padding: 18px 0 46px;
    font-family: inherit;
}

    .template-admin-page button[b-ulou1yoa5j],
    .template-admin-page input[b-ulou1yoa5j],
    .template-admin-page textarea[b-ulou1yoa5j],
    .template-admin-page select[b-ulou1yoa5j] {
        font-family: inherit;
    }

    .template-admin-page[b-ulou1yoa5j]  .mud-button-root,
    .template-admin-page[b-ulou1yoa5j]  .mud-input,
    .template-admin-page[b-ulou1yoa5j]  .mud-input-control,
    .template-admin-page[b-ulou1yoa5j]  .mud-typography,
    .template-admin-page[b-ulou1yoa5j]  .mud-chip {
        font-family: inherit !important;
    }

    .template-admin-page[b-ulou1yoa5j]::before {
        content: "";
        position: absolute;
        inset: -40px -22px auto;
        height: 320px;
        background: radial-gradient(circle at 12% 10%, color-mix(in srgb, var(--mud-palette-primary) 12%, transparent), transparent 34%), radial-gradient(circle at 90% 20%, color-mix(in srgb, var(--mud-palette-secondary) 12%, transparent), transparent 32%);
        pointer-events: none;
        opacity: 0.9;
    }

    .template-admin-page[b-ulou1yoa5j]  > .mud-stack {
        position: relative;
        z-index: 2;
    }

.template-admin-hero[b-ulou1yoa5j] {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 34px;
    border-radius: 36px;
    background: radial-gradient(circle at 14% 16%, color-mix(in srgb, var(--mud-palette-primary) 18%, transparent), transparent 32%), radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--mud-palette-secondary) 18%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--mud-palette-surface) 98%, var(--mud-palette-primary)) 0%, var(--mud-palette-surface) 52%, color-mix(in srgb, var(--mud-palette-surface) 94%, var(--mud-palette-secondary)) 100%);
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 14%, var(--mud-palette-divider));
    box-shadow: 0 28px 80px color-mix(in srgb, var(--mud-palette-primary) 12%, transparent), inset 0 1px 0 color-mix(in srgb, var(--mud-palette-surface) 72%, transparent);
}

    .template-admin-hero[b-ulou1yoa5j]::before {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(90deg, color-mix(in srgb, var(--mud-palette-primary) 8%, transparent), transparent 48%, color-mix(in srgb, var(--mud-palette-secondary) 9%, transparent));
        pointer-events: none;
    }

    .template-admin-hero[b-ulou1yoa5j]::after {
        content: "";
        position: absolute;
        right: -82px;
        bottom: -116px;
        width: 250px;
        height: 250px;
        border-radius: 999px;
        background: color-mix(in srgb, var(--mud-palette-secondary) 14%, transparent);
        border: 1px solid color-mix(in srgb, var(--mud-palette-secondary) 18%, transparent);
        pointer-events: none;
    }

.template-admin-hero-content[b-ulou1yoa5j],
.template-admin-hero-actions[b-ulou1yoa5j] {
    position: relative;
    z-index: 2;
}

.template-admin-hero-actions[b-ulou1yoa5j] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.template-admin-page[b-ulou1yoa5j]  .template-admin-eyebrow {
    color: var(--mud-palette-primary) !important;
    font-weight: 950;
    letter-spacing: 0.16em;
}

.template-admin-page[b-ulou1yoa5j]  .template-admin-title {
    color: var(--mud-palette-text-primary) !important;
    font-weight: 950;
    letter-spacing: -0.06em;
}

.template-admin-page[b-ulou1yoa5j]  .template-admin-subtitle {
    max-width: 760px;
    color: var(--mud-palette-text-secondary) !important;
    line-height: 1.68;
    font-weight: 650;
}

.template-admin-page[b-ulou1yoa5j]  .template-admin-side-card,
.template-admin-page[b-ulou1yoa5j]  .template-admin-details-card,
.template-admin-page[b-ulou1yoa5j]  .template-admin-state-card {
    position: relative;
    overflow: hidden;
    border-radius: 30px;
    background: linear-gradient(145deg, color-mix(in srgb, var(--mud-palette-surface) 98%, var(--mud-palette-primary)) 0%, var(--mud-palette-surface) 58%, color-mix(in srgb, var(--mud-palette-surface) 96%, var(--mud-palette-secondary)) 100%);
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 11%, var(--mud-palette-divider));
    box-shadow: 0 22px 62px color-mix(in srgb, var(--mud-palette-primary) 9%, transparent), inset 0 1px 0 color-mix(in srgb, var(--mud-palette-surface) 70%, transparent);
}

    .template-admin-page[b-ulou1yoa5j]  .template-admin-side-card::before,
    .template-admin-page[b-ulou1yoa5j]  .template-admin-details-card::before {
        content: "";
        position: absolute;
        inset: 0 0 auto;
        height: 3px;
        background: linear-gradient(90deg, color-mix(in srgb, var(--mud-palette-primary) 42%, transparent), color-mix(in srgb, var(--mud-palette-secondary) 42%, transparent));
        pointer-events: none;
    }

.template-admin-page[b-ulou1yoa5j]  .template-admin-side-card,
.template-admin-page[b-ulou1yoa5j]  .template-admin-details-card {
    padding: 24px;
}

.template-admin-page[b-ulou1yoa5j]  .template-admin-state-card {
    min-height: 300px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 34px;
}

.template-admin-page[b-ulou1yoa5j]  .template-admin-card-title,
.template-admin-page[b-ulou1yoa5j]  .template-admin-details-title {
    color: var(--mud-palette-text-primary) !important;
    font-weight: 950;
    letter-spacing: -0.03em;
}

.template-admin-page[b-ulou1yoa5j]  .template-admin-muted {
    color: var(--mud-palette-text-secondary) !important;
    font-weight: 650;
    line-height: 1.58;
}

.template-admin-summary-grid[b-ulou1yoa5j] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.template-admin-summary-item[b-ulou1yoa5j] {
    min-height: 88px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    padding: 15px;
    border-radius: 22px;
    background: radial-gradient(circle at 12% 10%, color-mix(in srgb, var(--mud-palette-primary) 9%, transparent), transparent 50%), color-mix(in srgb, var(--mud-palette-primary) 5%, var(--mud-palette-surface));
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 10%, transparent);
}

.template-admin-summary-value[b-ulou1yoa5j] {
    color: var(--mud-palette-primary);
    font-size: 1.65rem;
    font-weight: 950;
    line-height: 1;
}

.template-admin-summary-label[b-ulou1yoa5j] {
    color: var(--mud-palette-text-secondary);
    font-size: 0.76rem;
    font-weight: 900;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.template-admin-page[b-ulou1yoa5j]  .template-admin-filter-label {
    color: var(--mud-palette-text-primary) !important;
    font-weight: 950;
}

.template-admin-page[b-ulou1yoa5j]  .template-admin-filter-button {
    justify-content: flex-start !important;
    min-height: 44px !important;
    border-radius: 17px !important;
    font-weight: 900 !important;
    letter-spacing: 0.01em;
}

.template-admin-page[b-ulou1yoa5j]  .template-admin-search {
    width: 100%;
}

.template-admin-template-list[b-ulou1yoa5j],
.template-admin-version-list[b-ulou1yoa5j] {
    display: flex;
    flex-direction: column;
    gap: 11px;
}

.template-admin-template-card[b-ulou1yoa5j],
.template-admin-version-card[b-ulou1yoa5j] {
    position: relative;
    width: 100%;
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 12px;
    padding: 15px;
    color: var(--mud-palette-text-primary);
    text-align: left;
    border: 1px solid color-mix(in srgb, var(--mud-palette-divider) 82%, transparent);
    border-radius: 22px;
    background: color-mix(in srgb, var(--mud-palette-surface) 96%, var(--mud-palette-background));
    cursor: pointer;
    box-shadow: 0 10px 28px color-mix(in srgb, var(--mud-palette-primary) 4%, transparent);
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, background 180ms ease;
}

    .template-admin-template-card:hover[b-ulou1yoa5j],
    .template-admin-version-card:hover[b-ulou1yoa5j] {
        transform: translateY(-2px);
        border-color: color-mix(in srgb, var(--mud-palette-primary) 18%, var(--mud-palette-divider));
        box-shadow: 0 18px 44px color-mix(in srgb, var(--mud-palette-primary) 10%, transparent);
    }

.template-admin-template-card[b-ulou1yoa5j] {
    flex-direction: column;
}

    .template-admin-template-card[b-ulou1yoa5j]::before,
    .template-admin-version-card[b-ulou1yoa5j]::before {
        content: "";
        position: absolute;
        left: 0;
        top: 16px;
        bottom: 16px;
        width: 4px;
        border-radius: 999px;
        background: transparent;
        transition: background 180ms ease;
    }

.template-admin-version-card[b-ulou1yoa5j] {
    align-items: center;
}

.template-admin-template-card-selected[b-ulou1yoa5j],
.template-admin-version-card-selected[b-ulou1yoa5j] {
    background: linear-gradient(135deg, color-mix(in srgb, var(--mud-palette-primary) 10%, var(--mud-palette-surface)), color-mix(in srgb, var(--mud-palette-secondary) 6%, var(--mud-palette-surface)));
    border-color: color-mix(in srgb, var(--mud-palette-secondary) 28%, var(--mud-palette-divider));
    box-shadow: 0 18px 46px color-mix(in srgb, var(--mud-palette-primary) 13%, transparent);
}

    .template-admin-template-card-selected[b-ulou1yoa5j]::before,
    .template-admin-version-card-selected[b-ulou1yoa5j]::before {
        background: linear-gradient(180deg, var(--mud-palette-primary), var(--mud-palette-secondary));
    }

.template-admin-template-card-inactive[b-ulou1yoa5j],
.template-admin-version-card-inactive[b-ulou1yoa5j] {
    opacity: 0.7;
}

.template-admin-template-row[b-ulou1yoa5j] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.template-admin-template-main[b-ulou1yoa5j],
.template-admin-version-main[b-ulou1yoa5j] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.template-admin-template-code[b-ulou1yoa5j] {
    color: var(--mud-palette-text-primary);
    font-size: 0.86rem;
    font-weight: 950;
    line-height: 1.28;
    word-break: break-word;
}

.template-admin-template-name[b-ulou1yoa5j] {
    color: var(--mud-palette-text-secondary);
    font-size: 0.83rem;
    font-weight: 700;
    line-height: 1.36;
}

.template-admin-template-meta[b-ulou1yoa5j],
.template-admin-version-date[b-ulou1yoa5j] {
    color: color-mix(in srgb, var(--mud-palette-text-secondary) 78%, transparent);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.01em;
}

.template-admin-details-header[b-ulou1yoa5j] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.template-admin-details-chips[b-ulou1yoa5j] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.template-admin-details-grid[b-ulou1yoa5j] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.template-admin-detail-box[b-ulou1yoa5j] {
    min-height: 82px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    padding: 15px;
    border-radius: 20px;
    background: color-mix(in srgb, var(--mud-palette-primary) 5%, var(--mud-palette-surface));
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 9%, transparent);
}

.template-admin-detail-label[b-ulou1yoa5j] {
    color: var(--mud-palette-text-secondary);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.template-admin-detail-value[b-ulou1yoa5j] {
    color: var(--mud-palette-text-primary);
    font-size: 0.92rem;
    font-weight: 950;
}

.template-admin-version-title[b-ulou1yoa5j] {
    color: var(--mud-palette-text-primary);
    font-size: 0.95rem;
    font-weight: 950;
}

.template-admin-preview-actions[b-ulou1yoa5j] {
    flex-wrap: wrap;
}

.template-admin-page[b-ulou1yoa5j]  .template-admin-validation-alert {
    border-radius: 20px;
}

.template-admin-page[b-ulou1yoa5j]  .template-admin-validation-title {
    color: var(--mud-palette-warning) !important;
    font-weight: 950;
    letter-spacing: -0.01em;
}

.template-admin-validation-list[b-ulou1yoa5j] {
    margin: 8px 0 0;
    padding-left: 20px;
    color: var(--mud-palette-text-primary);
    font-size: 0.86rem;
    font-weight: 700;
    line-height: 1.55;
}

    .template-admin-validation-list li + li[b-ulou1yoa5j] {
        margin-top: 4px;
    }

.template-admin-placeholder-panel[b-ulou1yoa5j] {
    display: flex;
    flex-direction: column;
    gap: 13px;
    padding: 16px;
    border-radius: 24px;
    background: radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--mud-palette-secondary) 10%, transparent), transparent 34%), color-mix(in srgb, var(--mud-palette-primary) 5%, var(--mud-palette-surface));
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 11%, var(--mud-palette-divider));
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--mud-palette-surface) 70%, transparent);
}

.template-admin-placeholder-header[b-ulou1yoa5j] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.template-admin-page[b-ulou1yoa5j]  .template-admin-placeholder-title {
    color: var(--mud-palette-text-primary) !important;
    font-weight: 950;
    letter-spacing: -0.02em;
}

.template-admin-page[b-ulou1yoa5j]  .template-admin-placeholder-target {
    width: min(220px, 100%);
    flex: 0 0 auto;
}

.template-admin-placeholder-list[b-ulou1yoa5j] {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.template-admin-placeholder-pill[b-ulou1yoa5j] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 12px;
    color: var(--mud-palette-text-primary);
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 13%, var(--mud-palette-divider));
    border-radius: 999px;
    background: color-mix(in srgb, var(--mud-palette-surface) 96%, var(--mud-palette-primary));
    cursor: pointer;
    transition: transform 180ms ease, background 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

    .template-admin-placeholder-pill:hover[b-ulou1yoa5j] {
        transform: translateY(-1px);
        background: color-mix(in srgb, var(--mud-palette-primary) 8%, var(--mud-palette-surface));
        border-color: color-mix(in srgb, var(--mud-palette-primary) 24%, var(--mud-palette-divider));
        box-shadow: 0 12px 28px color-mix(in srgb, var(--mud-palette-primary) 9%, transparent);
    }

.template-admin-placeholder-token[b-ulou1yoa5j] {
    color: var(--mud-palette-primary);
    font-size: 0.78rem;
    font-weight: 950;
    letter-spacing: 0.01em;
}

.template-admin-placeholder-label[b-ulou1yoa5j] {
    color: var(--mud-palette-text-secondary);
    font-size: 0.76rem;
    font-weight: 800;
}

.template-admin-preview-result[b-ulou1yoa5j] {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 18px;
    border-radius: 24px;
    background: radial-gradient(circle at 10% 0%, color-mix(in srgb, var(--mud-palette-primary) 11%, transparent), transparent 34%), linear-gradient(145deg, color-mix(in srgb, var(--mud-palette-surface) 97%, var(--mud-palette-primary)), var(--mud-palette-surface));
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 12%, var(--mud-palette-divider));
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--mud-palette-surface) 70%, transparent);
}

    .template-admin-preview-result[b-ulou1yoa5j]::before {
        content: "";
        position: absolute;
        inset: 0 0 auto;
        height: 3px;
        background: linear-gradient(90deg, var(--mud-palette-primary), var(--mud-palette-secondary));
        pointer-events: none;
    }

.template-admin-page[b-ulou1yoa5j]  .template-admin-preview-label {
    color: var(--mud-palette-primary) !important;
    font-weight: 950;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.template-admin-preview-block[b-ulou1yoa5j] {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 14px 15px;
    color: var(--mud-palette-text-primary);
    font-weight: 700;
    line-height: 1.58;
    white-space: pre-wrap;
    border-radius: 18px;
    background: color-mix(in srgb, var(--mud-palette-surface) 98%, var(--mud-palette-primary));
    border: 1px solid color-mix(in srgb, var(--mud-palette-divider) 82%, transparent);
}

.template-admin-preview-block-label[b-ulou1yoa5j] {
    color: var(--mud-palette-text-secondary);
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.template-admin-html-preview-card[b-ulou1yoa5j] {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 18px;
    border-radius: 26px;
    background: radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--mud-palette-secondary) 11%, transparent), transparent 34%), linear-gradient(145deg, color-mix(in srgb, var(--mud-palette-surface) 97%, var(--mud-palette-primary)), var(--mud-palette-surface));
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 12%, var(--mud-palette-divider));
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--mud-palette-surface) 70%, transparent);
}

.template-admin-html-preview-toolbar[b-ulou1yoa5j] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
}

.template-admin-page[b-ulou1yoa5j]  .template-admin-html-preview-label {
    color: var(--mud-palette-primary) !important;
    font-weight: 950;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.template-admin-html-preview-device-picker[b-ulou1yoa5j] {
    flex-wrap: wrap;
}

.template-admin-page[b-ulou1yoa5j]  .template-admin-html-preview-device-picker .mud-button-root {
    min-height: 34px;
    border-radius: 999px;
    font-size: 0.76rem;
    font-weight: 900;
    letter-spacing: 0.02em;
}

.template-admin-html-preview-meta[b-ulou1yoa5j] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
}

.template-admin-html-preview-meta-item[b-ulou1yoa5j] {
    padding: 12px 14px;
    border-radius: 16px;
    background: color-mix(in srgb, var(--mud-palette-surface) 98%, var(--mud-palette-primary));
    border: 1px solid color-mix(in srgb, var(--mud-palette-divider) 82%, transparent);
}

.template-admin-html-preview-stage[b-ulou1yoa5j] {
    overflow-x: auto;
    padding: 18px;
    border-radius: 24px;
    background: radial-gradient(circle at 14% 0%, rgba(236, 72, 153, 0.11), transparent 30%), linear-gradient(135deg, #f5f1ec, #eee7e1);
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 9%, var(--mud-palette-divider));
    overscroll-behavior-x: contain;
}

.template-admin-html-preview-device[b-ulou1yoa5j] {
    overflow: hidden;
    margin: 0 auto;
    max-width: none;
    border-radius: 24px;
    background: #f7f2ee;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 12%, var(--mud-palette-divider));
    box-shadow: 0 18px 48px color-mix(in srgb, var(--mud-palette-primary) 13%, transparent);
    transition: width 180ms ease;
}

.template-admin-html-preview-device-desktop[b-ulou1yoa5j] {
    width: 720px;
}

.template-admin-html-preview-device-tablet[b-ulou1yoa5j] {
    width: 600px;
}

.template-admin-html-preview-device-mobile[b-ulou1yoa5j] {
    width: 390px;
}

.template-admin-html-preview-device-topbar[b-ulou1yoa5j] {
    min-height: 38px;
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 0 12px;
    background: linear-gradient(90deg, color-mix(in srgb, var(--mud-palette-primary) 18%, var(--mud-palette-surface)), color-mix(in srgb, var(--mud-palette-secondary) 16%, var(--mud-palette-surface)));
    border-bottom: 1px solid color-mix(in srgb, var(--mud-palette-divider) 80%, transparent);
}

    .template-admin-html-preview-device-topbar > span[b-ulou1yoa5j] {
        width: 9px;
        height: 9px;
        flex: 0 0 auto;
        border-radius: 999px;
        background: color-mix(in srgb, var(--mud-palette-text-secondary) 28%, transparent);
    }

.template-admin-page[b-ulou1yoa5j]  .template-admin-html-preview-channel-chip {
    margin-left: auto;
    font-size: 0.66rem;
    font-weight: 950;
    letter-spacing: 0.05em;
}

.template-admin-html-preview-iframe[b-ulou1yoa5j] {
    display: block;
    width: 100%;
    height: 720px;
    border: 0;
    background: #f7f2ee;
}

.template-admin-email-plain-panel[b-ulou1yoa5j] {
    border-radius: 18px;
    background: color-mix(in srgb, var(--mud-palette-surface) 98%, var(--mud-palette-primary));
    border: 1px solid color-mix(in srgb, var(--mud-palette-divider) 82%, transparent);
}

.template-admin-email-plain-text[b-ulou1yoa5j] {
    margin: 0;
    padding: 14px;
    color: var(--mud-palette-text-primary);
    white-space: pre-wrap;
    font-family: inherit;
    font-size: 0.86rem;
    font-weight: 700;
    line-height: 1.58;
}

.template-admin-empty[b-ulou1yoa5j],
.template-admin-empty-small[b-ulou1yoa5j] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    color: var(--mud-palette-text-secondary);
    text-align: center;
}

.template-admin-empty[b-ulou1yoa5j] {
    max-width: 380px;
}

.template-admin-empty-small[b-ulou1yoa5j] {
    min-height: 136px;
    justify-content: center;
    padding: 22px;
    border-radius: 20px;
    background: color-mix(in srgb, var(--mud-palette-primary) 5%, transparent);
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 8%, transparent);
}

.template-admin-empty-icon[b-ulou1yoa5j] {
    width: 72px;
    height: 72px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--mud-palette-primary);
    border-radius: 26px;
    background: color-mix(in srgb, var(--mud-palette-primary) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 14%, transparent);
    box-shadow: 0 16px 36px color-mix(in srgb, var(--mud-palette-primary) 10%, transparent);
}

.template-admin-page[b-ulou1yoa5j]  .template-admin-empty-title {
    color: var(--mud-palette-text-primary) !important;
    font-weight: 950;
}

@media (max-width: 960px) {
    .template-admin-hero[b-ulou1yoa5j],
    .template-admin-details-header[b-ulou1yoa5j] {
        align-items: stretch;
        flex-direction: column;
    }

    .template-admin-hero-actions[b-ulou1yoa5j],
    .template-admin-details-chips[b-ulou1yoa5j] {
        justify-content: flex-start;
    }

    .template-admin-html-preview-toolbar[b-ulou1yoa5j] {
        flex-direction: column;
    }

    .template-admin-html-preview-device-picker[b-ulou1yoa5j] {
        width: 100%;
    }
}

@media (max-width: 600px) {
    .template-admin-page[b-ulou1yoa5j] {
        padding-top: 10px;
    }

        .template-admin-page[b-ulou1yoa5j]::before {
            height: 240px;
        }

    .template-admin-hero[b-ulou1yoa5j] {
        padding: 22px;
        border-radius: 28px;
    }

    .template-admin-page[b-ulou1yoa5j]  .template-admin-title {
        font-size: 2rem;
    }

    .template-admin-page[b-ulou1yoa5j]  .template-admin-side-card,
    .template-admin-page[b-ulou1yoa5j]  .template-admin-details-card {
        padding: 17px;
        border-radius: 24px;
    }

    .template-admin-summary-grid[b-ulou1yoa5j],
    .template-admin-details-grid[b-ulou1yoa5j] {
        grid-template-columns: 1fr;
    }

    .template-admin-template-row[b-ulou1yoa5j],
    .template-admin-version-card[b-ulou1yoa5j] {
        align-items: flex-start;
        flex-direction: column;
    }

    .template-admin-placeholder-header[b-ulou1yoa5j] {
        flex-direction: column;
    }

    .template-admin-page[b-ulou1yoa5j]  .template-admin-placeholder-target {
        width: 100%;
    }

    .template-admin-placeholder-pill[b-ulou1yoa5j] {
        width: 100%;
        justify-content: space-between;
    }

    .template-admin-html-preview-card[b-ulou1yoa5j] {
        padding: 14px;
        border-radius: 22px;
    }

    .template-admin-html-preview-stage[b-ulou1yoa5j] {
        padding: 12px;
        border-radius: 20px;
    }

    .template-admin-html-preview-device[b-ulou1yoa5j] {
        border-radius: 20px;
    }

    .template-admin-html-preview-iframe[b-ulou1yoa5j] {
        height: 620px;
    }
}
/* /Components/Pages/OwnerMediaDeleteConfirmationDialog.razor.rz.scp.css */
.owner-media-delete-dialog[b-ltv21obmqe] {
    display: grid;
    gap: 1rem;
    min-width: 0;
    padding-top: 0.2rem;
}

.owner-media-delete-dialog-header[b-ltv21obmqe] {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    padding: 0.95rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-error) 15%, var(--mud-palette-divider));
    background: radial-gradient(circle at 12% 18%, color-mix(in srgb, var(--mud-palette-error) 12%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--mud-palette-surface) 98%, var(--mud-palette-error)), var(--mud-palette-surface));
    border-radius: 18px;
}

.owner-media-delete-dialog-icon-shell[b-ltv21obmqe] {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    color: #ffffff;
    border-radius: 18px;
    background: linear-gradient(135deg, var(--mud-palette-error), color-mix(in srgb, var(--mud-palette-error) 74%, var(--mud-palette-primary)));
    box-shadow: 0 16px 34px color-mix(in srgb, var(--mud-palette-error) 22%, transparent);
}

    .owner-media-delete-dialog-icon-shell[b-ltv21obmqe]  .mud-icon-root {
        color: #ffffff !important;
        font-size: 1.65rem;
    }

.owner-media-delete-dialog-heading[b-ltv21obmqe] {
    min-width: 0;
    display: grid;
    gap: 0.12rem;
}

.owner-media-delete-dialog[b-ltv21obmqe]  .owner-media-delete-dialog-title {
    color: var(--mud-palette-primary);
    font-weight: 950;
    line-height: 1.18;
}

.owner-media-delete-dialog[b-ltv21obmqe]  .owner-media-delete-dialog-kicker {
    color: color-mix(in srgb, var(--mud-palette-error) 78%, var(--mud-palette-text-secondary));
    font-weight: 850;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.owner-media-delete-dialog-message[b-ltv21obmqe] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.75rem;
    padding: 1rem;
    border: 1px solid color-mix(in srgb, var(--mud-palette-warning) 24%, var(--mud-palette-divider));
    background: radial-gradient(circle at 92% 12%, color-mix(in srgb, var(--mud-palette-warning) 10%, transparent), transparent 30%), color-mix(in srgb, var(--mud-palette-warning) 6%, var(--mud-palette-surface));
    border-radius: 18px;
}

    .owner-media-delete-dialog-message[b-ltv21obmqe]  .mud-icon-root {
        margin-top: 0.08rem;
        color: var(--mud-palette-warning);
        font-size: 1.35rem;
    }

    .owner-media-delete-dialog-message[b-ltv21obmqe]  .mud-typography {
        color: var(--mud-palette-text-primary);
        font-weight: 650;
        line-height: 1.55;
    }

.owner-media-delete-dialog-note[b-ltv21obmqe] {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
    padding: 0.85rem 0.95rem;
    color: color-mix(in srgb, var(--mud-palette-text-secondary) 92%, transparent);
    font-size: 0.82rem;
    font-weight: 650;
    line-height: 1.45;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 9%, var(--mud-palette-divider));
    background: color-mix(in srgb, var(--mud-palette-primary) 4%, var(--mud-palette-surface));
    border-radius: 16px;
}

    .owner-media-delete-dialog-note[b-ltv21obmqe]  .mud-icon-root {
        flex: 0 0 auto;
        margin-top: 0.04rem;
        color: var(--mud-palette-secondary);
        font-size: 1.05rem;
    }

.owner-media-delete-dialog-actions[b-ltv21obmqe] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 0.65rem;
    padding: 0.15rem 0.35rem 0.35rem;
}

    .owner-media-delete-dialog-actions[b-ltv21obmqe]  .mud-button-root {
        min-height: 42px;
        border-radius: 10px !important;
        font-family: inherit;
        font-size: 0.78rem;
        font-weight: 950;
        letter-spacing: 0.035em;
        text-transform: uppercase;
    }

    .owner-media-delete-dialog-actions[b-ltv21obmqe]  .mud-button-label,
    .owner-media-delete-dialog-actions[b-ltv21obmqe]  .mud-icon-root {
        font-family: inherit;
        font-weight: 950;
    }

    .owner-media-delete-dialog-actions[b-ltv21obmqe]  .owner-media-delete-dialog-cancel-button {
        border-color: color-mix(in srgb, var(--mud-palette-primary) 28%, var(--mud-palette-divider));
        background: color-mix(in srgb, var(--mud-palette-surface) 98%, transparent);
    }

    .owner-media-delete-dialog-actions[b-ltv21obmqe]  .owner-media-delete-dialog-delete-button {
        box-shadow: 0 14px 30px color-mix(in srgb, var(--mud-palette-error) 22%, transparent);
    }

@media (max-width: 600px) {
    .owner-media-delete-dialog-header[b-ltv21obmqe] {
        align-items: flex-start;
        padding: 0.85rem;
    }

    .owner-media-delete-dialog-icon-shell[b-ltv21obmqe] {
        width: 46px;
        height: 46px;
        border-radius: 16px;
    }

    .owner-media-delete-dialog-message[b-ltv21obmqe] {
        grid-template-columns: 1fr;
        padding: 0.9rem;
    }

    .owner-media-delete-dialog-actions[b-ltv21obmqe] {
        display: grid;
        gap: 0.55rem;
        padding-inline: 0.25rem;
    }

        .owner-media-delete-dialog-actions[b-ltv21obmqe]  .mud-button-root {
            width: 100%;
        }
}
/* /Components/Pages/SalonAppointmentDetails.razor.rz.scp.css */
.salon-appointment-details-page[b-dwrvf5dscd] {
    padding-bottom: 3rem;
}

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-loading-panel,
    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-error-panel {
        padding: 2.5rem;
        border: 1px solid rgba(203, 213, 225, 0.9);
        background: rgba(255, 255, 255, 0.96);
        box-shadow: 0 18px 44px rgba(15, 23, 42, 0.08);
    }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-hero {
        position: relative;
        overflow: hidden;
        padding: 2rem;
        border: 1px solid rgba(203, 213, 225, 0.9);
        box-shadow: 0 24px 60px rgba(15, 23, 42, 0.11);
    }

        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-hero::before {
            content: "";
            position: absolute;
            inset: -40%;
            background: radial-gradient(circle at 15% 25%, rgba(255, 255, 255, 0.42), transparent 28%), radial-gradient(circle at 85% 10%, rgba(255, 255, 255, 0.24), transparent 26%), radial-gradient(circle at 75% 90%, rgba(255, 255, 255, 0.22), transparent 30%);
            pointer-events: none;
        }

        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-hero > .mud-grid {
            position: relative;
            z-index: 1;
        }

        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-hero.is-pending {
            background: linear-gradient(135deg, rgba(245, 158, 11, 0.22), rgba(255, 251, 235, 0.96));
        }

        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-hero.is-confirmed {
            background: linear-gradient(135deg, rgba(34, 197, 94, 0.2), rgba(240, 253, 244, 0.96));
        }

        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-hero.is-completed {
            background: linear-gradient(135deg, rgba(91, 75, 255, 0.18), rgba(245, 243, 255, 0.96));
        }

        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-hero.is-cancelled,
        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-hero.is-expired {
            background: linear-gradient(135deg, rgba(100, 116, 139, 0.16), rgba(248, 250, 252, 0.98));
        }

        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-hero.is-noshow {
            background: linear-gradient(135deg, rgba(239, 68, 68, 0.18), rgba(254, 242, 242, 0.96));
        }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-hero-top,
    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-section-header {
        gap: 1rem;
    }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-hero-avatar {
        width: 56px;
        height: 56px;
        box-shadow: 0 14px 30px rgba(15, 23, 42, 0.16);
    }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-eyebrow {
        color: #64748b;
        font-weight: 700;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        font-size: 0.74rem;
    }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-title {
        color: #0f172a;
        line-height: 1.05;
    }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-subtitle {
        color: #334155;
        font-size: 1.05rem;
        font-weight: 600;
    }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-reference {
        color: #64748b;
    }

        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-reference strong {
            color: #0f172a;
            font-weight: 800;
        }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-hero-summary {
        padding: 1.25rem;
        background: rgba(255, 255, 255, 0.72);
        border: 1px solid rgba(255, 255, 255, 0.82);
        backdrop-filter: blur(14px);
        box-shadow: 0 18px 42px rgba(15, 23, 42, 0.1);
    }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-summary-label,
    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-muted {
        color: #64748b;
    }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-summary-value {
        color: #0f172a;
        font-weight: 800;
    }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-alert {
        box-shadow: 0 12px 30px rgba(15, 23, 42, 0.06);
    }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-main-panel,
    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-action-panel,
    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-side-panel {
        padding: 1.5rem;
        background: rgba(255, 255, 255, 0.98);
        border: 1px solid rgba(203, 213, 225, 0.92);
        box-shadow: 0 16px 42px rgba(15, 23, 42, 0.075);
    }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-info-card {
        height: 100%;
        padding: 1rem;
        border: 1px solid rgba(203, 213, 225, 0.82);
        background: linear-gradient(135deg, rgba(248, 250, 252, 0.96), rgba(255, 255, 255, 0.98));
        transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
    }

        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-info-card:hover {
            transform: translateY(-2px);
            border-color: rgba(91, 75, 255, 0.28);
            box-shadow: 0 14px 34px rgba(15, 23, 42, 0.08);
        }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-note-panel {
        padding: 1rem;
        border: 1px solid rgba(91, 75, 255, 0.16);
        background: linear-gradient(135deg, rgba(91, 75, 255, 0.055), rgba(20, 184, 166, 0.045));
    }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-status-alert {
        border-radius: 14px;
    }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-action-panel {
        position: relative;
        overflow: hidden;
    }

        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-action-panel::before {
            content: "";
            position: absolute;
            inset: 0;
            border-left: 5px solid rgba(91, 75, 255, 0.38);
            pointer-events: none;
        }

        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-action-panel.action-is-pending::before {
            border-left-color: rgba(245, 158, 11, 0.75);
        }

        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-action-panel.action-is-confirmed::before {
            border-left-color: rgba(34, 197, 94, 0.75);
        }

        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-action-panel.action-is-noshow::before,
        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-action-panel.action-is-cancelled::before {
            border-left-color: rgba(239, 68, 68, 0.62);
        }

        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-action-panel.action-is-completed::before {
            border-left-color: rgba(91, 75, 255, 0.75);
        }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-action-buttons {
        flex-wrap: wrap;
    }

        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-action-buttons .mud-button-root {
            min-width: 180px;
            min-height: 46px;
        }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-cancel-panel {
        padding: 1rem;
        border: 1px solid rgba(239, 68, 68, 0.22);
        background: linear-gradient(135deg, rgba(239, 68, 68, 0.055), rgba(254, 242, 242, 0.96));
    }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-timeline {
        position: relative;
    }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-timeline-step {
        position: relative;
        display: grid;
        grid-template-columns: 18px 1fr;
        gap: 0.85rem;
        padding: 0.2rem 0 1.15rem;
        color: #94a3b8;
    }

        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-timeline-step:not(:last-child)::after {
            content: "";
            position: absolute;
            left: 8px;
            top: 22px;
            bottom: -3px;
            width: 2px;
            background: rgba(203, 213, 225, 0.9);
        }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-timeline-dot {
        position: relative;
        z-index: 1;
        width: 18px;
        height: 18px;
        margin-top: 0.15rem;
        border-radius: 999px;
        border: 3px solid #cbd5e1;
        background: #ffffff;
    }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-timeline-step.is-complete {
        color: #334155;
    }

        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-timeline-step.is-complete .salon-details-timeline-dot {
            border-color: #14b8a6;
            background: #14b8a6;
            box-shadow: 0 0 0 5px rgba(20, 184, 166, 0.12);
        }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-timeline-step.is-active {
        color: #0f172a;
    }

        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-timeline-step.is-active .salon-details-timeline-dot {
            border-color: #5b4bff;
            background: #ffffff;
            box-shadow: 0 0 0 6px rgba(91, 75, 255, 0.14);
        }

@media (max-width: 960px) {
    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-hero {
        padding: 1.5rem;
    }

    .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-title {
        font-size: 2rem;
    }
}

@media (max-width: 600px) {
    .salon-appointment-details-page[b-dwrvf5dscd] {
        padding-bottom: 2rem;
    }

        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-hero,
        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-main-panel,
        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-action-panel,
        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-side-panel,
        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-loading-panel,
        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-error-panel {
            padding: 1rem;
        }

        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-hero-top,
        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-section-header,
        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-action-buttons {
            flex-direction: column;
            align-items: flex-start !important;
        }

            .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-action-buttons,
            .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-action-buttons .mud-button-root {
                width: 100%;
            }

        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-title {
            font-size: 1.8rem;
        }

        .salon-appointment-details-page[b-dwrvf5dscd]  .salon-details-hero-summary {
            margin-top: 1rem;
        }
}
/* /Components/Pages/SalonAppointments.razor.rz.scp.css */
.salon-appointments-page[b-1vl26bb60x] {
    --appointments-primary: var(--mud-palette-primary, #15324b);
    --appointments-secondary: var(--mud-palette-secondary, #b89b5e);
    --appointments-success: var(--mud-palette-success, #2f7d72);
    --appointments-warning: var(--mud-palette-warning, #c58a22);
    --appointments-error: var(--mud-palette-error, #b42318);
    --appointments-info: var(--mud-palette-info, #386fa4);
    --appointments-surface: var(--mud-palette-surface, #fffdf8);
    --appointments-background: var(--mud-palette-background, #f7f3ea);
    --appointments-text: var(--mud-palette-text-primary, #18212b);
    --appointments-muted: var(--mud-palette-text-secondary, #667085);
    --appointments-divider: var(--mud-palette-divider, #e5dcce);
    max-width: 1440px;
    margin-inline: auto;
    padding-bottom: 4rem;
}

    .salon-appointments-page[b-1vl26bb60x]  .mud-button-root,
    .salon-appointments-page[b-1vl26bb60x]  .mud-input-root,
    .salon-appointments-page[b-1vl26bb60x]  .mud-paper,
    .salon-appointments-page[b-1vl26bb60x]  .mud-alert {
        border-radius: 12px;
    }

    .salon-appointments-page[b-1vl26bb60x]  .appointments-pro-hero {
        display: grid;
        grid-template-columns: minmax(0, 1.45fr) minmax(300px, 0.55fr);
        gap: 1.4rem;
        align-items: center;
        padding: 1.4rem;
        border: 1px solid color-mix( in srgb, var(--appointments-secondary) 26%, var(--appointments-divider));
        border-radius: 24px !important;
        background: radial-gradient( circle at 94% 8%, color-mix(in srgb, var(--appointments-secondary) 14%, transparent), transparent 34%), linear-gradient( 135deg, color-mix( in srgb, var(--appointments-primary) 6%, var(--appointments-surface)), color-mix( in srgb, var(--appointments-secondary) 8%, var(--appointments-surface))) !important;
        box-shadow: 0 20px 52px color-mix(in srgb, var(--appointments-primary) 10%, transparent) !important;
    }

.appointments-pro-hero-main[b-1vl26bb60x] {
    min-width: 0;
    display: grid;
    gap: 1rem;
}

.appointments-pro-workspace-tabs[b-1vl26bb60x] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

    .appointments-pro-workspace-tabs a[b-1vl26bb60x] {
        display: inline-flex;
        align-items: center;
        gap: 0.4rem;
        min-height: 38px;
        padding: 0.44rem 0.76rem;
        color: var(--appointments-muted);
        font-size: 0.74rem;
        font-weight: 900;
        text-decoration: none;
        border: 1px solid var(--appointments-divider);
        border-radius: 11px;
        background: var(--appointments-surface);
    }

        .appointments-pro-workspace-tabs a:hover[b-1vl26bb60x],
        .appointments-pro-workspace-tabs a.is-active[b-1vl26bb60x] {
            color: #ffffff;
            border-color: var(--appointments-primary);
            background: var(--appointments-primary);
        }

.salon-appointments-page[b-1vl26bb60x]

.appointments-pro-workspace-tabs
.mud-icon-root {
    color: inherit !important;
    font-size: 1rem;
}

.appointments-pro-hero-copy[b-1vl26bb60x] {
    min-width: 0;
    display: grid;
    gap: 0.22rem;
}

    .appointments-pro-hero-copy > span[b-1vl26bb60x],
    .appointments-pro-filter-heading > div > span[b-1vl26bb60x],
    .appointments-pro-workspace-heading > div > span[b-1vl26bb60x],
    .appointments-pro-modal-header span[b-1vl26bb60x] {
        color: var(--appointments-secondary);
        font-size: 0.68rem;
        font-weight: 950;
        line-height: 1;
        letter-spacing: 0.085em;
        text-transform: uppercase;
    }

.salon-appointments-page[b-1vl26bb60x]  .appointments-pro-title {
    margin: 0;
    color: var(--appointments-primary) !important;
    font-size: clamp(2rem, 3.2vw, 3rem) !important;
    font-weight: 950 !important;
    line-height: 1.04 !important;
    letter-spacing: -0.05em !important;
}

.salon-appointments-page[b-1vl26bb60x]  .appointments-pro-subtitle {
    max-width: 820px;
    color: var(--appointments-muted) !important;
    font-size: 0.92rem !important;
    font-weight: 620;
    line-height: 1.55;
}

.appointments-pro-hero-meta[b-1vl26bb60x] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.52rem;
}

    .appointments-pro-hero-meta span[b-1vl26bb60x] {
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
        min-height: 34px;
        padding: 0.42rem 0.62rem;
        color: var(--appointments-muted);
        font-size: 0.7rem;
        font-weight: 820;
        border: 1px solid var(--appointments-divider);
        border-radius: 10px;
        background: color-mix( in srgb, var(--appointments-surface) 88%, transparent);
    }

.salon-appointments-page[b-1vl26bb60x]

.appointments-pro-hero-meta
.mud-icon-root {
    color: var(--appointments-secondary) !important;
}

.appointments-pro-hero-actions[b-1vl26bb60x] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 0.7rem;
    align-items: center;
    padding: 1rem;
    border: 1px solid color-mix( in srgb, var(--appointments-primary) 10%, var(--appointments-divider));
    border-radius: 18px;
    background: color-mix( in srgb, var(--appointments-surface) 94%, transparent);
    box-shadow: 0 14px 34px color-mix(in srgb, var(--appointments-primary) 8%, transparent);
}

    .appointments-pro-hero-actions > div[b-1vl26bb60x] {
        min-width: 0;
        display: grid;
        gap: 0.08rem;
    }

    .appointments-pro-hero-actions span[b-1vl26bb60x] {
        color: var(--appointments-secondary);
        font-size: 0.64rem;
        font-weight: 950;
        text-transform: uppercase;
    }

    .appointments-pro-hero-actions strong[b-1vl26bb60x] {
        color: var(--appointments-primary);
        font-size: 1.75rem;
        font-weight: 950;
        line-height: 1;
    }

    .appointments-pro-hero-actions small[b-1vl26bb60x] {
        color: var(--appointments-muted);
        font-size: 0.68rem;
    }

.salon-appointments-page[b-1vl26bb60x]

.appointments-pro-hero-actions
.mud-button-root {
    min-height: 42px;
    font-size: 0.72rem;
    font-weight: 900;
}

.appointments-pro-summary[b-1vl26bb60x] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
}

    .appointments-pro-summary > div:first-child[b-1vl26bb60x] {
        min-width: 0;
        display: grid;
        gap: 0.12rem;
    }

        .appointments-pro-summary > div:first-child > span[b-1vl26bb60x] {
            color: var(--appointments-secondary);
            font-size: 0.68rem;
            font-weight: 950;
            line-height: 1;
            letter-spacing: 0.085em;
            text-transform: uppercase;
        }

    .appointments-pro-summary h2[b-1vl26bb60x] {
        margin: 0;
        color: var(--appointments-text);
        font-size: clamp(1.6rem, 2.4vw, 2.15rem);
        font-weight: 950;
        line-height: 1.05;
        letter-spacing: -0.04em;
    }

    .appointments-pro-summary p[b-1vl26bb60x] {
        max-width: 760px;
        margin: 0;
        color: var(--appointments-muted);
        font-size: 0.76rem;
        line-height: 1.45;
    }

.appointments-pro-summary-range[b-1vl26bb60x] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 0.42rem;
    min-height: 38px;
    padding: 0.48rem 0.7rem;
    color: var(--appointments-primary);
    font-size: 0.7rem;
    font-weight: 850;
    border: 1px solid var(--appointments-divider);
    border-radius: 11px;
    background: var(--appointments-surface);
}

.salon-appointments-page[b-1vl26bb60x]

.appointments-pro-summary-range
.mud-icon-root {
    color: var(--appointments-secondary) !important;
}

.appointments-pro-metrics[b-1vl26bb60x] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
}

.appointments-pro-metric[b-1vl26bb60x] {
    --metric-accent: var(--appointments-primary);
    position: relative;
    overflow: hidden;
    min-width: 0;
    min-height: 122px;
    display: grid;
    align-content: start;
    gap: 0.3rem;
    padding: 0.9rem;
    color: var(--appointments-text);
    font-family: inherit;
    text-align: left;
    border: 1px solid color-mix( in srgb, var(--metric-accent) 17%, var(--appointments-divider));
    border-left: 4px solid var(--metric-accent);
    border-radius: 16px;
    background: linear-gradient( 145deg, color-mix( in srgb, var(--metric-accent) 7%, var(--appointments-surface)), var(--appointments-surface));
    box-shadow: 0 10px 24px color-mix(in srgb, var(--metric-accent) 7%, transparent);
    cursor: pointer;
    transition: transform 150ms ease, box-shadow 150ms ease, border-color 150ms ease;
}

    .appointments-pro-metric[b-1vl26bb60x]::after {
        content: "";
        position: absolute;
        right: -42px;
        top: -50px;
        width: 112px;
        height: 112px;
        border-radius: 999px;
        background: color-mix(in srgb, var(--metric-accent) 10%, transparent);
    }

    .appointments-pro-metric:hover[b-1vl26bb60x],
    .appointments-pro-metric.is-selected[b-1vl26bb60x] {
        transform: translateY(-2px);
        border-color: color-mix(in srgb, var(--metric-accent) 45%, var(--appointments-divider));
        box-shadow: 0 16px 34px color-mix(in srgb, var(--metric-accent) 13%, transparent);
    }

    .appointments-pro-metric.is-selected[b-1vl26bb60x] {
        outline: 2px solid color-mix(in srgb, var(--metric-accent) 24%, transparent);
        outline-offset: 2px;
    }

    .appointments-pro-metric.is-pending[b-1vl26bb60x] {
        --metric-accent: var(--appointments-warning);
    }

    .appointments-pro-metric.is-confirmed[b-1vl26bb60x] {
        --metric-accent: var(--appointments-primary);
    }

    .appointments-pro-metric.is-today[b-1vl26bb60x] {
        --metric-accent: var(--appointments-info);
    }

    .appointments-pro-metric.is-completed[b-1vl26bb60x] {
        --metric-accent: var(--appointments-success);
    }

    .appointments-pro-metric.is-cancelled[b-1vl26bb60x],
    .appointments-pro-metric.is-expired[b-1vl26bb60x] {
        --metric-accent: #7b8494;
    }

    .appointments-pro-metric.is-noshow[b-1vl26bb60x] {
        --metric-accent: var(--appointments-error);
    }

    .appointments-pro-metric span[b-1vl26bb60x] {
        color: var(--metric-accent);
        font-size: 0.66rem;
        font-weight: 950;
        text-transform: uppercase;
    }

    .appointments-pro-metric strong[b-1vl26bb60x] {
        color: var(--appointments-text);
        font-size: 2rem;
        font-weight: 950;
        line-height: 1;
        letter-spacing: -0.04em;
    }

    .appointments-pro-metric small[b-1vl26bb60x] {
        max-width: 210px;
        color: var(--appointments-muted);
        font-size: 0.67rem;
        line-height: 1.38;
    }

.salon-appointments-page[b-1vl26bb60x]  .appointments-pro-filter-panel,
.salon-appointments-page[b-1vl26bb60x]  .appointments-pro-loading {
    overflow: hidden;
    min-width: 0;
    display: grid;
    gap: 1rem;
    padding: 1.15rem;
    border: 1px solid var(--appointments-divider);
    border-radius: 20px !important;
    background: linear-gradient( 135deg, color-mix( in srgb, var(--appointments-primary) 4%, var(--appointments-surface)), var(--appointments-surface)) !important;
    box-shadow: 0 16px 38px color-mix(in srgb, var(--appointments-primary) 8%, transparent) !important;
}

.appointments-pro-filter-heading[b-1vl26bb60x] {
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem 1rem;
}

    .appointments-pro-filter-heading[b-1vl26bb60x]  .mud-chip {
        flex: 0 0 auto;
        max-width: 100%;
    }

    .appointments-pro-filter-heading > div[b-1vl26bb60x] {
        min-width: 0;
        display: grid;
        gap: 0.14rem;
    }

    .appointments-pro-filter-heading strong[b-1vl26bb60x] {
        color: var(--appointments-text);
        font-size: 1.05rem;
        font-weight: 950;
    }

    .appointments-pro-filter-heading small[b-1vl26bb60x] {
        color: var(--appointments-muted);
        font-size: 0.72rem;
        line-height: 1.4;
    }

.appointments-pro-filter-grid[b-1vl26bb60x] {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(260px, 1.45fr) repeat(4, minmax(155px, 0.78fr));
    gap: 0.75rem;
    align-items: start;
}

.appointments-pro-filter-field[b-1vl26bb60x] {
    min-width: 0;
}

    .appointments-pro-filter-field.is-search[b-1vl26bb60x] {
        min-width: 0;
    }

    .appointments-pro-filter-field[b-1vl26bb60x]
    
    .mud-input-control,
    .appointments-pro-range-field[b-1vl26bb60x]
    
    .mud-input-control {
        width: 100%;
        min-width: 0;
    }

.appointments-pro-range-row[b-1vl26bb60x] {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(180px, 0.62fr) minmax(180px, 0.62fr);
    gap: 0.75rem;
    align-items: start;
    padding-top: 0.9rem;
    border-top: 1px solid var(--appointments-divider);
}

.appointments-pro-range-copy[b-1vl26bb60x] {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 0.58rem;
    min-height: 42px;
}

    .appointments-pro-range-copy > div[b-1vl26bb60x] {
        min-width: 0;
        display: grid;
        gap: 0.08rem;
    }

    .appointments-pro-range-copy strong[b-1vl26bb60x] {
        color: var(--appointments-text);
        font-size: 0.78rem;
        font-weight: 950;
    }

    .appointments-pro-range-copy span[b-1vl26bb60x] {
        color: var(--appointments-muted);
        font-size: 0.68rem;
        line-height: 1.35;
    }

.salon-appointments-page[b-1vl26bb60x]

.appointments-pro-range-copy
.mud-icon-root {
    flex: 0 0 auto;
    color: var(--appointments-secondary) !important;
}

.appointments-pro-range-field[b-1vl26bb60x] {
    min-width: 0;
}

.salon-appointments-page[b-1vl26bb60x]

.appointments-pro-filter-grid
.mud-input-control {
    font-size: 0.8rem;
}

.salon-appointments-page[b-1vl26bb60x]

.appointments-pro-filter-grid
.mud-input-label {
    font-size: 0.76rem;
    font-weight: 780;
}

.appointments-pro-filter-actions[b-1vl26bb60x] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.salon-appointments-page[b-1vl26bb60x]

.appointments-pro-filter-actions
.mud-button-root {
    min-height: 40px;
    font-size: 0.72rem;
    font-weight: 900;
}

.appointments-pro-active-filters[b-1vl26bb60x] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

    .appointments-pro-active-filters button[b-1vl26bb60x] {
        display: inline-flex;
        align-items: center;
        gap: 0.34rem;
        min-height: 32px;
        padding: 0.34rem 0.55rem;
        color: var(--appointments-primary);
        font-family: inherit;
        font-size: 0.68rem;
        font-weight: 850;
        border: 1px solid color-mix( in srgb, var(--appointments-primary) 18%, var(--appointments-divider));
        border-radius: 999px;
        background: color-mix( in srgb, var(--appointments-primary) 6%, var(--appointments-surface));
        cursor: pointer;
    }

.salon-appointments-page[b-1vl26bb60x]

.appointments-pro-active-filters
.mud-icon-root {
    color: inherit !important;
    font-size: 0.9rem;
}

.salon-appointments-page[b-1vl26bb60x]  .appointments-pro-loading {
    min-height: 170px;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    justify-content: center;
}

.appointments-pro-loading > div[b-1vl26bb60x] {
    display: grid;
    gap: 0.14rem;
}

.appointments-pro-loading strong[b-1vl26bb60x] {
    color: var(--appointments-text);
    font-size: 0.9rem;
    font-weight: 950;
}

.appointments-pro-loading span[b-1vl26bb60x] {
    color: var(--appointments-muted);
    font-size: 0.72rem;
}

.appointments-pro-workspace[b-1vl26bb60x] {
    display: grid;
    gap: 0.85rem;
}

.appointments-pro-workspace-heading[b-1vl26bb60x] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
}

    .appointments-pro-workspace-heading > div:first-child[b-1vl26bb60x] {
        min-width: 0;
        display: grid;
        gap: 0.12rem;
    }

    .appointments-pro-workspace-heading h2[b-1vl26bb60x] {
        margin: 0;
        color: var(--appointments-text);
        font-size: clamp(1.75rem, 2.8vw, 2.5rem);
        font-weight: 950;
        line-height: 1.04;
        letter-spacing: -0.045em;
    }

    .appointments-pro-workspace-heading p[b-1vl26bb60x] {
        max-width: 780px;
        margin: 0;
        color: var(--appointments-muted);
        font-size: 0.78rem;
        line-height: 1.46;
    }

.appointments-pro-result-summary[b-1vl26bb60x] {
    flex: 0 0 auto;
    display: grid;
    justify-items: center;
    gap: 0.05rem;
    min-width: 94px;
    padding: 0.66rem;
    border: 1px solid var(--appointments-divider);
    border-radius: 14px;
    background: var(--appointments-surface);
}

    .appointments-pro-result-summary strong[b-1vl26bb60x] {
        color: var(--appointments-primary);
        font-size: 1.45rem;
        font-weight: 950;
        line-height: 1;
    }

    .appointments-pro-result-summary span[b-1vl26bb60x],
    .appointments-pro-result-summary small[b-1vl26bb60x] {
        color: var(--appointments-muted);
        font-size: 0.62rem;
        text-align: center;
    }

.appointments-pro-list[b-1vl26bb60x] {
    display: grid;
    gap: 0.6rem;
}

.appointments-pro-row[b-1vl26bb60x] {
    --appointment-accent: var(--appointments-primary);
    --appointment-background: var(--appointments-surface);
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(125px, 0.58fr) minmax(320px, 1.8fr) minmax(185px, 0.75fr) minmax(235px, auto);
    gap: 0.85rem;
    align-items: center;
    padding: 0.85rem;
    border: 1px solid color-mix( in srgb, var(--appointment-accent) 16%, var(--appointments-divider));
    border-left: 5px solid var(--appointment-accent);
    border-radius: 16px;
    background: var(--appointment-background);
    box-shadow: 0 10px 26px color-mix(in srgb, var(--appointment-accent) 7%, transparent);
}

    .appointments-pro-row.is-pending[b-1vl26bb60x] {
        --appointment-accent: var(--appointments-warning);
        --appointment-background: color-mix( in srgb, var(--appointments-warning) 7%, var(--appointments-surface));
    }

    .appointments-pro-row.is-confirmed[b-1vl26bb60x] {
        --appointment-accent: var(--appointments-primary);
        --appointment-background: color-mix( in srgb, var(--appointments-primary) 5%, var(--appointments-surface));
    }

    .appointments-pro-row.is-completed[b-1vl26bb60x] {
        --appointment-accent: var(--appointments-success);
        --appointment-background: color-mix( in srgb, var(--appointments-success) 5%, var(--appointments-surface));
    }

    .appointments-pro-row.is-noshow[b-1vl26bb60x] {
        --appointment-accent: var(--appointments-error);
        --appointment-background: color-mix( in srgb, var(--appointments-error) 5%, var(--appointments-surface));
    }

    .appointments-pro-row.is-cancelled[b-1vl26bb60x],
    .appointments-pro-row.is-expired[b-1vl26bb60x] {
        --appointment-accent: #7b8494;
        --appointment-background: repeating-linear-gradient( 135deg, color-mix( in srgb, var(--appointments-muted) 5%, var(--appointments-surface)) 0 9px, var(--appointments-surface) 9px 18px);
    }

.appointments-pro-row-time[b-1vl26bb60x] {
    min-width: 0;
    display: grid;
    gap: 0.1rem;
}

    .appointments-pro-row-time span[b-1vl26bb60x],
    .appointments-pro-row-time small[b-1vl26bb60x] {
        overflow: hidden;
        color: var(--appointments-muted);
        font-size: 0.66rem;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .appointments-pro-row-time strong[b-1vl26bb60x] {
        color: var(--appointment-accent);
        font-size: 1.12rem;
        font-weight: 950;
        line-height: 1.1;
    }

.appointments-pro-row-main[b-1vl26bb60x] {
    min-width: 0;
    display: grid;
    gap: 0.42rem;
}

.appointments-pro-row-title[b-1vl26bb60x] {
    min-width: 0;
    display: flex;
    align-items: baseline;
    gap: 0.55rem;
}

    .appointments-pro-row-title strong[b-1vl26bb60x] {
        overflow: hidden;
        color: var(--appointments-text);
        font-size: 0.92rem;
        font-weight: 950;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .appointments-pro-row-title span[b-1vl26bb60x] {
        flex: 0 0 auto;
        color: var(--appointments-muted);
        font-size: 0.62rem;
        font-weight: 760;
    }

.appointments-pro-row-details[b-1vl26bb60x] {
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 0.8rem;
}

    .appointments-pro-row-details span[b-1vl26bb60x] {
        min-width: 0;
        display: inline-flex;
        align-items: center;
        gap: 0.28rem;
        color: var(--appointments-muted);
        font-size: 0.68rem;
        line-height: 1.3;
    }

.salon-appointments-page[b-1vl26bb60x]

.appointments-pro-row-details
.mud-icon-root {
    flex: 0 0 auto;
    color: var(--appointments-secondary) !important;
    font-size: 0.95rem;
}

.appointments-pro-row-status[b-1vl26bb60x] {
    min-width: 0;
    display: grid;
    justify-items: start;
    gap: 0.38rem;
}

    .appointments-pro-row-status > span[b-1vl26bb60x] {
        display: inline-flex;
        align-items: center;
        gap: 0.3rem;
        color: var(--appointments-muted);
        font-size: 0.64rem;
    }

.salon-appointments-page[b-1vl26bb60x]

.appointments-pro-row-status
.mud-icon-root {
    color: var(--appointments-secondary) !important;
    font-size: 0.9rem;
}

.appointments-pro-row-actions[b-1vl26bb60x] {
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.42rem;
}

.salon-appointments-page[b-1vl26bb60x]

.appointments-pro-row-actions
.mud-button-root {
    min-height: 36px;
    font-size: 0.66rem;
    font-weight: 900;
}

.appointments-pro-pagination[b-1vl26bb60x] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
    padding-top: 0.9rem;
}

    .appointments-pro-pagination > button[b-1vl26bb60x],
    .appointments-pro-pagination-pages button[b-1vl26bb60x] {
        min-height: 38px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.3rem;
        padding: 0.42rem 0.7rem;
        color: var(--appointments-primary);
        font-family: inherit;
        font-size: 0.7rem;
        font-weight: 900;
        border: 1px solid var(--appointments-divider);
        border-radius: 10px;
        background: var(--appointments-surface);
        cursor: pointer;
    }

        .appointments-pro-pagination > button:disabled[b-1vl26bb60x],
        .appointments-pro-pagination-pages button:disabled[b-1vl26bb60x] {
            opacity: 0.45;
            cursor: default;
        }

.appointments-pro-pagination-pages[b-1vl26bb60x] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
}

    .appointments-pro-pagination-pages button[b-1vl26bb60x] {
        width: 38px;
        padding-inline: 0.35rem;
    }

        .appointments-pro-pagination-pages button.is-active[b-1vl26bb60x] {
            color: #ffffff;
            border-color: var(--appointments-primary);
            background: var(--appointments-primary);
        }

    .appointments-pro-pagination-pages > span[b-1vl26bb60x] {
        color: var(--appointments-muted);
        font-size: 0.75rem;
        font-weight: 900;
    }

.salon-appointments-page[b-1vl26bb60x]

.appointments-pro-pagination
.mud-icon-root {
    color: inherit !important;
    font-size: 1rem;
}

.appointments-pro-empty[b-1vl26bb60x] {
    min-height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 1.2rem;
    text-align: left;
    border: 1px dashed color-mix( in srgb, var(--appointments-secondary) 36%, var(--appointments-divider));
    border-radius: 18px;
    background: color-mix( in srgb, var(--appointments-secondary) 4%, var(--appointments-surface));
}

    .appointments-pro-empty > div[b-1vl26bb60x] {
        display: grid;
        gap: 0.12rem;
    }

    .appointments-pro-empty strong[b-1vl26bb60x] {
        color: var(--appointments-text);
        font-size: 0.86rem;
        font-weight: 950;
    }

    .appointments-pro-empty span[b-1vl26bb60x] {
        color: var(--appointments-muted);
        font-size: 0.72rem;
    }

.salon-appointments-page[b-1vl26bb60x]

.appointments-pro-empty
.mud-icon-root {
    color: var(--appointments-secondary) !important;
    font-size: 1.7rem;
}

.appointments-pro-modal-layer[b-1vl26bb60x] {
    --appointments-primary: var(--mud-palette-primary, #15324b);
    --appointments-secondary: var(--mud-palette-secondary, #b89b5e);
    --appointments-surface: var(--mud-palette-surface, #fffdf8);
    --appointments-background: var(--mud-palette-background, #f7f3ea);
    --appointments-text: var(--mud-palette-text-primary, #18212b);
    --appointments-divider: var(--mud-palette-divider, #e5dcce);
    position: fixed;
    inset: 0;
    z-index: 1800;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.appointments-pro-modal-backdrop[b-1vl26bb60x] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    background: rgba(15, 23, 42, 0.38);
    backdrop-filter: blur(11px);
}

.appointments-pro-modal[b-1vl26bb60x] {
    position: relative;
    z-index: 1;
    width: min(720px, calc(100vw - 2rem));
    max-height: min(90vh, 880px);
    overflow-y: auto;
    display: grid;
    align-content: start;
    gap: 0.8rem;
    padding: 1rem;
    color: var(--appointments-text);
    border: 1px solid var(--appointments-divider);
    border-radius: 22px;
    background: linear-gradient( 145deg, var(--appointments-background), color-mix( in srgb, var(--appointments-secondary) 5%, var(--appointments-background)));
    box-shadow: 0 28px 82px rgba(15, 23, 42, 0.28);
}

.appointments-pro-modal-header[b-1vl26bb60x] {
    position: sticky;
    top: -1rem;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.7rem;
    margin: -1rem -1rem 0;
    padding: 0.9rem 1rem;
    border-bottom: 1px solid var(--appointments-divider);
    border-radius: 22px 22px 0 0;
    background: var(--appointments-background);
}

    .appointments-pro-modal-header > div[b-1vl26bb60x] {
        min-width: 0;
        display: grid;
        gap: 0.12rem;
    }

    .appointments-pro-modal-header strong[b-1vl26bb60x] {
        overflow: hidden;
        color: var(--appointments-text);
        font-size: 0.88rem;
        font-weight: 950;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.appointments-pro-modal[b-1vl26bb60x]

.mud-paper,
.appointments-pro-modal[b-1vl26bb60x]

.mud-card {
    background-color: var(--appointments-surface) !important;
}

@media (max-width: 1240px) {
    .appointments-pro-filter-grid[b-1vl26bb60x] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .appointments-pro-filter-field.is-search[b-1vl26bb60x] {
        grid-column: 1 / -1;
    }

    .appointments-pro-range-row[b-1vl26bb60x] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .appointments-pro-range-copy[b-1vl26bb60x] {
        grid-column: 1 / -1;
    }

    .appointments-pro-row[b-1vl26bb60x] {
        grid-template-columns: minmax(115px, 0.55fr) minmax(280px, 1.5fr) minmax(175px, 0.7fr);
    }

    .appointments-pro-row-actions[b-1vl26bb60x] {
        grid-column: 1 / -1;
        justify-content: flex-start;
        padding-top: 0.65rem;
        border-top: 1px solid var(--appointments-divider);
    }
}

@media (max-width: 980px) {
    .salon-appointments-page[b-1vl26bb60x]  .appointments-pro-hero {
        grid-template-columns: 1fr;
    }

    .appointments-pro-hero-actions[b-1vl26bb60x] {
        max-width: 620px;
    }

    .appointments-pro-metrics[b-1vl26bb60x] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .appointments-pro-row[b-1vl26bb60x] {
        grid-template-columns: minmax(105px, 0.5fr) minmax(0, 1.5fr);
    }

    .appointments-pro-row-status[b-1vl26bb60x] {
        justify-items: end;
    }

    .appointments-pro-row-actions[b-1vl26bb60x] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 720px) {
    .salon-appointments-page[b-1vl26bb60x] {
        padding-bottom: 2rem;
    }

        .salon-appointments-page[b-1vl26bb60x]  .appointments-pro-hero,
        .salon-appointments-page[b-1vl26bb60x]  .appointments-pro-filter-panel {
            padding: 1rem;
            border-radius: 18px !important;
        }

        .salon-appointments-page[b-1vl26bb60x]  .appointments-pro-title {
            font-size: 2rem !important;
        }

    .appointments-pro-workspace-tabs a[b-1vl26bb60x] {
        flex: 1;
        justify-content: center;
    }

    .appointments-pro-hero-actions[b-1vl26bb60x] {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .salon-appointments-page[b-1vl26bb60x]
    
    .appointments-pro-hero-actions
    .mud-button-root {
        grid-column: 1 / -1;
        width: 100%;
    }

    .appointments-pro-filter-grid[b-1vl26bb60x],
    .appointments-pro-range-row[b-1vl26bb60x],
    .appointments-pro-metrics[b-1vl26bb60x] {
        grid-template-columns: 1fr;
    }

    .appointments-pro-filter-field.is-search[b-1vl26bb60x],
    .appointments-pro-range-copy[b-1vl26bb60x] {
        grid-column: auto;
    }

    .appointments-pro-summary[b-1vl26bb60x],
    .appointments-pro-filter-heading[b-1vl26bb60x],
    .appointments-pro-workspace-heading[b-1vl26bb60x] {
        align-items: flex-start;
        flex-direction: column;
    }

    .appointments-pro-summary-range[b-1vl26bb60x] {
        width: 100%;
    }

    .appointments-pro-pagination[b-1vl26bb60x] {
        flex-wrap: wrap;
    }

    .appointments-pro-pagination-pages[b-1vl26bb60x] {
        order: -1;
        width: 100%;
    }

    .appointments-pro-row[b-1vl26bb60x] {
        grid-template-columns: 1fr;
        gap: 0.62rem;
    }

    .appointments-pro-row-time[b-1vl26bb60x] {
        display: flex;
        align-items: baseline;
        gap: 0.45rem;
    }

    .appointments-pro-row-status[b-1vl26bb60x] {
        justify-items: start;
    }

    .appointments-pro-row-actions[b-1vl26bb60x] {
        grid-column: auto;
        justify-content: stretch;
    }

    .salon-appointments-page[b-1vl26bb60x]
    
    .appointments-pro-row-actions
    .mud-button-root {
        flex: 1 1 140px;
    }

    .appointments-pro-modal-layer[b-1vl26bb60x] {
        padding: 0.65rem;
    }

    .appointments-pro-modal[b-1vl26bb60x] {
        width: calc(100vw - 1.3rem);
        max-height: calc(100vh - 1.3rem);
        border-radius: 18px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .appointments-pro-metric[b-1vl26bb60x] {
        transition: none;
    }
}

/* BB-LOCALIZATION-HOTFIX-02
 * Prevent the current-result metric and translated actions from colliding. */
.appointments-pro-hero-actions[b-1vl26bb60x] {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
        "result refresh"
        "schedule schedule";
}

    .appointments-pro-hero-actions > div[b-1vl26bb60x] {
        grid-area: result;
    }

    .appointments-pro-hero-actions > .appointments-pro-open-scheduler-button[b-1vl26bb60x] {
        grid-area: schedule;
        width: 100%;
    }

    .appointments-pro-hero-actions > .appointments-pro-refresh-button[b-1vl26bb60x] {
        grid-area: refresh;
        align-self: center;
    }

@media (max-width: 900px) {
    .appointments-pro-hero-actions[b-1vl26bb60x] {
        grid-template-columns: minmax(0, 1fr) auto;
    }
}

@media (max-width: 520px) {
    .appointments-pro-hero-actions[b-1vl26bb60x] {
        grid-template-columns: 1fr;
        grid-template-areas:
            "result"
            "schedule"
            "refresh";
    }

        .appointments-pro-hero-actions > .appointments-pro-refresh-button[b-1vl26bb60x] {
            justify-self: end;
        }
}
/* /Components/Pages/SalonDashboard.razor.rz.scp.css */
.salon-dashboard-page[b-st1dfb12or] {
    --dash-primary: var(--mud-palette-primary, #15324b);
    --dash-secondary: var(--mud-palette-secondary, #b89b5e);
    --dash-success: var(--mud-palette-success, #2f7d72);
    --dash-warning: var(--mud-palette-warning, #c58a22);
    --dash-error: var(--mud-palette-error, #b42318);
    --dash-info: var(--mud-palette-info, #386fa4);
    --dash-surface: var(--mud-palette-surface, #fffdf8);
    --dash-background: var(--mud-palette-background, #f7f3ea);
    --dash-text: var(--mud-palette-text-primary, #18212b);
    --dash-muted: var(--mud-palette-text-secondary, #667085);
    --dash-divider: var(--mud-palette-divider, #e5dcce);
    width: 100%;
    max-width: 1380px;
    margin-inline: auto;
    padding-bottom: 3rem;
}

    .salon-dashboard-page[b-st1dfb12or]  .mud-button-root,
    .salon-dashboard-page[b-st1dfb12or]  .mud-input-root,
    .salon-dashboard-page[b-st1dfb12or]  .mud-paper,
    .salon-dashboard-page[b-st1dfb12or]  .mud-alert {
        border-radius: 12px;
    }

    .salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-hero {
        position: relative;
        overflow: hidden;
        min-height: 0;
        padding: 1.35rem 1.5rem;
        color: #fff;
        border: 1px solid color-mix(in srgb, var(--dash-secondary) 30%, transparent);
        border-radius: 24px !important;
        background: radial-gradient(circle at 88% 6%, color-mix(in srgb, var(--dash-secondary) 28%, transparent), transparent 30%), linear-gradient(135deg, color-mix(in srgb, var(--dash-primary) 96%, #07131d), var(--dash-primary)) !important;
        box-shadow: 0 22px 52px color-mix(in srgb, var(--dash-primary) 22%, transparent) !important;
    }

.dashboard-pro-hero-accent[b-st1dfb12or] {
    position: absolute;
    inset: 0 1.5rem auto;
    height: 3px;
    background: linear-gradient(90deg, transparent, var(--dash-secondary), transparent);
}

.dashboard-pro-hero-grid[b-st1dfb12or] {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(330px, 0.55fr);
    gap: 1.25rem;
    align-items: center;
}

.dashboard-pro-hero-copy[b-st1dfb12or] {
    min-width: 0;
    display: grid;
    gap: 0.8rem;
}

.dashboard-pro-workspace-tabs[b-st1dfb12or] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

    .dashboard-pro-workspace-tabs a[b-st1dfb12or] {
        display: inline-flex;
        align-items: center;
        gap: 0.4rem;
        min-height: 36px;
        padding: 0.42rem 0.72rem;
        color: rgba(255,255,255,0.78);
        font-size: 0.72rem;
        font-weight: 900;
        text-decoration: none;
        border: 1px solid rgba(255,255,255,0.14);
        border-radius: 10px;
        background: rgba(255,255,255,0.08);
    }

        .dashboard-pro-workspace-tabs a.is-active[b-st1dfb12or],
        .dashboard-pro-workspace-tabs a:hover[b-st1dfb12or] {
            color: var(--dash-primary);
            background: #fff;
            border-color: #fff;
        }

.salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-workspace-tabs .mud-icon-root {
    color: inherit !important;
    font-size: 1rem;
}

.dashboard-pro-eyebrow[b-st1dfb12or],
.dashboard-pro-status-top span[b-st1dfb12or],
.dashboard-pro-control-copy span[b-st1dfb12or],
.dashboard-pro-section-heading span[b-st1dfb12or],
.dashboard-pro-card-heading span[b-st1dfb12or],
.dashboard-pro-scheduler-period span[b-st1dfb12or],
.dashboard-pro-mobile-agenda-heading span[b-st1dfb12or],
.dashboard-pro-drawer-header span[b-st1dfb12or],
.dashboard-pro-attention-heading span[b-st1dfb12or] {
    color: var(--dash-secondary);
    font-size: 0.66rem;
    font-weight: 950;
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: uppercase;
}

.salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-title {
    margin: 0.2rem 0 0;
    color: #fff !important;
    font-size: clamp(1.8rem, 3vw, 2.75rem) !important;
    font-weight: 950 !important;
    line-height: 1.04 !important;
    letter-spacing: -0.045em !important;
}

.salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-subtitle {
    max-width: 760px;
    color: rgba(255,255,255,0.78) !important;
    font-size: 0.9rem !important;
    font-weight: 620;
    line-height: 1.48;
}

.dashboard-pro-meta-row[b-st1dfb12or] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

    .dashboard-pro-meta-row span[b-st1dfb12or] {
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
        min-height: 32px;
        padding: 0.36rem 0.55rem;
        color: rgba(255,255,255,0.84);
        font-size: 0.68rem;
        font-weight: 780;
        border: 1px solid rgba(255,255,255,0.12);
        border-radius: 9px;
        background: rgba(255,255,255,0.08);
    }

.salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-meta-row .mud-icon-root {
    color: var(--dash-secondary) !important;
}

.dashboard-pro-salon-status-card[b-st1dfb12or] {
    display: grid;
    gap: 0.8rem;
    padding: 1rem;
    color: var(--dash-text);
    border: 1px solid rgba(255,255,255,0.55);
    border-radius: 18px;
    background: rgba(255,255,255,0.96);
    box-shadow: 0 18px 38px rgba(0,0,0,0.18);
}

.dashboard-pro-status-top[b-st1dfb12or] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

    .dashboard-pro-status-top > div[b-st1dfb12or] {
        display: grid;
        gap: 0.15rem;
    }

    .dashboard-pro-status-top strong[b-st1dfb12or] {
        color: var(--dash-primary);
        font-size: 1.16rem;
        font-weight: 950;
    }

.dashboard-pro-hero-actions[b-st1dfb12or] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-hero-actions .mud-button-root {
    min-height: 40px;
    font-size: 0.7rem;
    font-weight: 900;
}

.salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-loading {
    min-height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.9rem;
    padding: 1.5rem;
    background: var(--dash-surface) !important;
    border: 1px solid var(--dash-divider);
    box-shadow: 0 16px 36px color-mix(in srgb, var(--dash-primary) 8%, transparent) !important;
}

.dashboard-pro-loading > div[b-st1dfb12or] {
    display: grid;
    gap: 0.2rem;
}

.dashboard-pro-loading strong[b-st1dfb12or] {
    color: var(--dash-text);
    font-weight: 950;
}

.dashboard-pro-loading span[b-st1dfb12or] {
    color: var(--dash-muted);
    font-size: 0.8rem;
}

.dashboard-pro-attention[b-st1dfb12or] {
    display: grid;
    gap: 0.75rem;
    padding: 1rem;
    border: 1px solid color-mix(in srgb, var(--dash-warning) 30%, var(--dash-divider));
    border-radius: 20px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--dash-warning) 9%, var(--dash-surface)), var(--dash-surface));
    box-shadow: 0 16px 36px color-mix(in srgb, var(--dash-warning) 9%, transparent);
}

.dashboard-pro-attention-heading[b-st1dfb12or] {
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto;
    gap: 0.7rem;
    align-items: center;
}

.dashboard-pro-attention-icon[b-st1dfb12or] {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    color: #fff;
    border-radius: 13px;
    background: var(--dash-warning);
}

.salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-attention-icon .mud-icon-root {
    color: #fff !important;
}

.dashboard-pro-attention-heading > div:nth-child(2)[b-st1dfb12or] {
    display: grid;
    gap: 0.12rem;
}

.dashboard-pro-attention-heading strong[b-st1dfb12or] {
    color: var(--dash-text);
    font-size: 1rem;
    font-weight: 950;
}

.dashboard-pro-attention-heading small[b-st1dfb12or] {
    color: var(--dash-muted);
    font-size: 0.72rem;
    font-weight: 650;
}

.dashboard-pro-attention-list[b-st1dfb12or] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 0.65rem;
}

.dashboard-pro-attention-item[b-st1dfb12or] {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    gap: 0.12rem 0.5rem;
    padding: 0.75rem;
    color: var(--dash-text);
    font-family: inherit;
    text-align: left;
    border: 1px solid color-mix(in srgb, var(--dash-warning) 24%, var(--dash-divider));
    border-left: 4px solid var(--dash-warning);
    border-radius: 14px;
    background: var(--dash-surface);
    cursor: pointer;
}

    .dashboard-pro-attention-item span[b-st1dfb12or],
    .dashboard-pro-attention-item strong[b-st1dfb12or],
    .dashboard-pro-attention-item small[b-st1dfb12or] {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .dashboard-pro-attention-item span[b-st1dfb12or] {
        grid-column: 1;
        color: var(--dash-warning);
        font-size: 0.66rem;
        font-weight: 900;
    }

    .dashboard-pro-attention-item strong[b-st1dfb12or] {
        grid-column: 1;
        font-size: 0.8rem;
        font-weight: 950;
    }

    .dashboard-pro-attention-item small[b-st1dfb12or] {
        grid-column: 1;
        color: var(--dash-muted);
        font-size: 0.66rem;
    }

.salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-attention-item > .mud-icon-root {
    grid-column: 2;
    grid-row: 1 / 4;
    align-self: center;
}

.dashboard-pro-attention-empty[b-st1dfb12or] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--dash-muted);
    font-size: 0.76rem;
    font-weight: 700;
}

.salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-attention-empty .mud-icon-root {
    color: var(--dash-success) !important;
}

.dashboard-pro-section[b-st1dfb12or] {
    display: grid;
    gap: 0.9rem;
}

.dashboard-pro-section-heading[b-st1dfb12or] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
}

    .dashboard-pro-section-heading > div[b-st1dfb12or] {
        min-width: 0;
        display: grid;
        gap: 0.25rem;
    }

    .dashboard-pro-section-heading h2[b-st1dfb12or] {
        margin: 0;
        color: var(--dash-text);
        font-size: clamp(1.45rem,2.4vw,2.05rem);
        font-weight: 950;
        letter-spacing: -0.035em;
    }

    .dashboard-pro-section-heading p[b-st1dfb12or] {
        max-width: 760px;
        margin: 0;
        color: var(--dash-muted);
        font-size: 0.82rem;
        font-weight: 620;
        line-height: 1.45;
    }

.salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-control-center,
.salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-scheduler-toolbar {
    padding: 0.85rem;
    border: 1px solid color-mix(in srgb, var(--dash-primary) 11%, var(--dash-divider));
    background: var(--dash-surface) !important;
    box-shadow: 0 12px 28px color-mix(in srgb, var(--dash-primary) 7%, transparent) !important;
}

.dashboard-pro-control-grid[b-st1dfb12or] {
    display: grid;
    grid-template-columns: minmax(190px,.85fr) minmax(260px,1.35fr) minmax(180px,.8fr) minmax(180px,.8fr) auto;
    gap: 0.65rem;
    align-items: end;
}

.dashboard-pro-control-copy[b-st1dfb12or] {
    display: grid;
    gap: 0.14rem;
    align-self: center;
}

    .dashboard-pro-control-copy strong[b-st1dfb12or] {
        color: var(--dash-text);
        font-size: 0.9rem;
        font-weight: 950;
    }

    .dashboard-pro-control-copy small[b-st1dfb12or] {
        color: var(--dash-muted);
        font-size: 0.68rem;
        line-height: 1.35;
    }

.dashboard-pro-filter-actions[b-st1dfb12or] {
    min-height: 46px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.35rem;
}

.salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-scheduler-toolbar {
    display: grid;
    grid-template-columns: auto minmax(220px,1fr) minmax(210px,.55fr) auto;
    gap: 0.75rem;
    align-items: center;
}

.dashboard-pro-scheduler-navigation[b-st1dfb12or] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.dashboard-pro-scheduler-period[b-st1dfb12or] {
    min-width: 0;
    display: grid;
    gap: 0.12rem;
}

    .dashboard-pro-scheduler-period strong[b-st1dfb12or] {
        overflow: hidden;
        color: var(--dash-text);
        font-size: 0.92rem;
        font-weight: 950;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.dashboard-pro-view-toggle[b-st1dfb12or] {
    display: grid;
    grid-template-columns: repeat(2,minmax(80px,1fr));
    padding: 0.2rem;
    border: 1px solid var(--dash-divider);
    border-radius: 11px;
    background: var(--dash-background);
}

    .dashboard-pro-view-toggle button[b-st1dfb12or] {
        min-height: 38px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.35rem;
        color: var(--dash-muted);
        font-family: inherit;
        font-size: 0.7rem;
        font-weight: 900;
        border: 0;
        border-radius: 9px;
        background: transparent;
        cursor: pointer;
    }

        .dashboard-pro-view-toggle button.is-active[b-st1dfb12or] {
            color: #fff;
            background: var(--dash-primary);
        }

.salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-view-toggle .mud-icon-root {
    color: inherit !important;
    font-size: 1rem;
}

.dashboard-pro-scheduler-legend[b-st1dfb12or] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

    .dashboard-pro-scheduler-legend span[b-st1dfb12or] {
        display: inline-flex;
        align-items: center;
        gap: 0.3rem;
        min-height: 28px;
        padding: 0.3rem 0.5rem;
        color: var(--dash-muted);
        font-size: 0.64rem;
        font-weight: 820;
        border: 1px solid var(--dash-divider);
        border-radius: 999px;
        background: var(--dash-surface);
    }

    .dashboard-pro-scheduler-legend i[b-st1dfb12or],
    .dashboard-pro-status-legend i[b-st1dfb12or] {
        width: 9px;
        height: 9px;
        border-radius: 999px;
        background: var(--metric-color,var(--dash-divider));
    }

.is-pending[b-st1dfb12or] {
    --metric-color: var(--dash-warning);
}

.is-confirmed[b-st1dfb12or] {
    --metric-color: var(--dash-primary);
}

.is-completed[b-st1dfb12or] {
    --metric-color: var(--dash-success);
}

.is-noshow[b-st1dfb12or] {
    --metric-color: var(--dash-error);
}

.is-cancelled[b-st1dfb12or] {
    --metric-color: #7b8492;
}

.is-expired[b-st1dfb12or] {
    --metric-color: #a37a45;
}

.is-break[b-st1dfb12or] {
    --metric-color: var(--dash-secondary);
}

.is-closure[b-st1dfb12or] {
    --metric-color: var(--dash-error);
}

.is-other[b-st1dfb12or] {
    --metric-color: var(--dash-divider);
}

.dashboard-pro-scheduler-shell[b-st1dfb12or] {
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--dash-primary) 12%, var(--dash-divider));
    border-radius: 20px;
    background: var(--dash-surface);
    box-shadow: 0 18px 42px color-mix(in srgb, var(--dash-primary) 9%, transparent);
}

.dashboard-pro-scheduler-scroll[b-st1dfb12or] {
    position: relative;
    overflow-x: auto;
    overflow-y: visible;
    overscroll-behavior-x: contain;
    overscroll-behavior-y: auto;
}

.dashboard-pro-scheduler-header[b-st1dfb12or],
.dashboard-pro-scheduler-body[b-st1dfb12or] {
    min-width: max-content;
    display: grid;
}

.dashboard-pro-scheduler-header[b-st1dfb12or] {
    position: sticky;
    top: 0;
    z-index: 20;
    border-bottom: 1px solid var(--dash-divider);
    background: color-mix(in srgb, var(--dash-surface) 96%, transparent);
    backdrop-filter: blur(15px);
}

.dashboard-pro-time-corner[b-st1dfb12or],
.dashboard-pro-column-header[b-st1dfb12or] {
    min-height: 76px;
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.65rem;
    border-right: 1px solid var(--dash-divider);
}

.dashboard-pro-time-corner[b-st1dfb12or] {
    min-width: 96px;
    justify-content: center;
    flex-direction: column;
    color: var(--dash-muted);
    font-size: 0.66rem;
    font-weight: 900;
}

.dashboard-pro-column-header img[b-st1dfb12or],
.dashboard-pro-column-header > span[b-st1dfb12or] {
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    object-fit: cover;
    color: #fff;
    font-size: 0.72rem;
    font-weight: 950;
    border-radius: 13px;
    background: linear-gradient(135deg,var(--dash-primary),var(--dash-secondary));
}

.dashboard-pro-column-header > div[b-st1dfb12or] {
    min-width: 0;
    display: grid;
    gap: 0.1rem;
}

.dashboard-pro-column-header strong[b-st1dfb12or] {
    overflow: hidden;
    color: var(--dash-text);
    font-size: 0.76rem;
    font-weight: 950;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-pro-column-header small[b-st1dfb12or] {
    overflow: hidden;
    color: var(--dash-muted);
    font-size: 0.62rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-pro-column-header em[b-st1dfb12or] {
    margin-left: auto;
    color: var(--dash-error);
    font-style: normal;
    font-size: 0.56rem;
    font-weight: 900;
}

.dashboard-pro-time-axis[b-st1dfb12or] {
    position: relative;
    min-width: 96px;
    border-right: 1px solid var(--dash-divider);
    background: color-mix(in srgb,var(--dash-background) 65%,var(--dash-surface));
}

    .dashboard-pro-time-axis > span[b-st1dfb12or] {
        position: absolute;
        inset-inline: 0;
        transform: translateY(-50%);
        padding-right: 0.75rem;
        color: color-mix(in srgb,var(--dash-primary) 78%, var(--dash-muted));
        font-size: 0.7rem;
        font-weight: 900;
        text-align: right;
    }

.dashboard-pro-scheduler-column[b-st1dfb12or] {
    position: relative;
    overflow: hidden;
    min-width: 240px;
    border-right: 1px solid var(--dash-divider);
    background: repeating-linear-gradient(to bottom,transparent 0 35px,color-mix(in srgb,var(--dash-divider) 60%,transparent) 35px 36px),color-mix(in srgb,var(--dash-background) 45%,var(--dash-surface));
}

    .dashboard-pro-scheduler-column.is-closed[b-st1dfb12or] {
        background: repeating-linear-gradient(135deg,color-mix(in srgb,var(--dash-primary) 3%,transparent) 0 8px,transparent 8px 16px),color-mix(in srgb,var(--dash-background) 70%,var(--dash-surface));
    }

.dashboard-pro-working-window[b-st1dfb12or] {
    position: absolute;
    inset-inline: 0;
    z-index: 1;
    background: color-mix(in srgb,var(--dash-surface) 94%,transparent);
    border-block: 1px solid color-mix(in srgb,var(--dash-success) 15%,transparent);
}

.dashboard-pro-schedule-overlay[b-st1dfb12or] {
    position: absolute;
    inset-inline: 3px;
    z-index: 4;
    overflow: hidden;
    display: grid;
    align-content: start;
    gap: 0.05rem;
    padding: 0.3rem 0.4rem;
    border-radius: 8px;
    pointer-events: none;
}

    .dashboard-pro-schedule-overlay.is-break[b-st1dfb12or] {
        color: #765b23;
        background: color-mix(in srgb,var(--dash-secondary) 12%,white);
        border: 1px dashed color-mix(in srgb,var(--dash-secondary) 40%,transparent);
    }

    .dashboard-pro-schedule-overlay.is-closure[b-st1dfb12or] {
        color: var(--dash-error);
        background: color-mix(in srgb,var(--dash-error) 8%,white);
        border: 1px dashed color-mix(in srgb,var(--dash-error) 35%,transparent);
    }

    .dashboard-pro-schedule-overlay strong[b-st1dfb12or] {
        overflow: hidden;
        font-size: 0.6rem;
        font-weight: 950;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .dashboard-pro-schedule-overlay small[b-st1dfb12or] {
        overflow: hidden;
        font-size: 0.54rem;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.dashboard-pro-current-time-line[b-st1dfb12or] {
    position: absolute;
    inset-inline: 0;
    z-index: 12;
    height: 2px;
    background: var(--dash-error);
    pointer-events: none;
}

    .dashboard-pro-current-time-line i[b-st1dfb12or] {
        position: absolute;
        left: -5px;
        top: -4px;
        width: 10px;
        height: 10px;
        border-radius: 999px;
        background: var(--dash-error);
    }

    .dashboard-pro-current-time-line span[b-st1dfb12or] {
        position: absolute;
        right: 4px;
        top: -12px;
        padding: 0.12rem 0.3rem;
        color: #fff;
        font-size: 0.54rem;
        font-weight: 950;
        border-radius: 999px;
        background: var(--dash-error);
    }

.dashboard-pro-scheduler-appointment[b-st1dfb12or] {
    position: absolute;
    z-index: 8;
    overflow: hidden;
    display: grid;
    align-content: start;
    gap: 0.16rem;
    min-width: 0;
    padding: 0.5rem 0.55rem;
    color: var(--appointment-text,var(--dash-primary));
    font-family: inherit;
    text-align: left;
    border: 1px solid var(--appointment-border,color-mix(in srgb,var(--dash-primary) 24%,transparent));
    border-left: 4px solid var(--appointment-accent,var(--dash-primary));
    border-radius: 11px;
    background: var(--appointment-background,color-mix(in srgb,var(--dash-primary) 9%,white));
    box-shadow: 0 8px 18px color-mix(in srgb,var(--appointment-accent,var(--dash-primary)) 12%,transparent);
    cursor: pointer;
}

    .dashboard-pro-scheduler-appointment.is-pending[b-st1dfb12or],
    .dashboard-pro-agenda-item.is-pending[b-st1dfb12or],
    .dashboard-pro-focus-card.is-pending[b-st1dfb12or] {
        --appointment-accent: var(--dash-warning);
        --appointment-background: color-mix(in srgb,var(--dash-warning) 11%,white);
        --appointment-text: #6d4c10;
    }

    .dashboard-pro-scheduler-appointment.is-confirmed[b-st1dfb12or],
    .dashboard-pro-agenda-item.is-confirmed[b-st1dfb12or],
    .dashboard-pro-focus-card.is-confirmed[b-st1dfb12or] {
        --appointment-accent: var(--dash-primary);
        --appointment-background: color-mix(in srgb,var(--dash-primary) 8%,white);
        --appointment-text: var(--dash-primary);
    }

    .dashboard-pro-scheduler-appointment.is-completed[b-st1dfb12or],
    .dashboard-pro-agenda-item.is-completed[b-st1dfb12or],
    .dashboard-pro-focus-card.is-completed[b-st1dfb12or] {
        --appointment-accent: var(--dash-success);
        --appointment-background: color-mix(in srgb,var(--dash-success) 8%,white);
        --appointment-text: #17635a;
    }

    .dashboard-pro-scheduler-appointment.is-noshow[b-st1dfb12or],
    .dashboard-pro-agenda-item.is-noshow[b-st1dfb12or],
    .dashboard-pro-focus-card.is-noshow[b-st1dfb12or] {
        --appointment-accent: var(--dash-error);
        --appointment-background: color-mix(in srgb,var(--dash-error) 8%,white);
        --appointment-text: var(--dash-error);
    }

    .dashboard-pro-scheduler-appointment.is-cancelled[b-st1dfb12or],
    .dashboard-pro-scheduler-appointment.is-expired[b-st1dfb12or],
    .dashboard-pro-agenda-item.is-cancelled[b-st1dfb12or],
    .dashboard-pro-agenda-item.is-expired[b-st1dfb12or],
    .dashboard-pro-focus-card.is-cancelled[b-st1dfb12or],
    .dashboard-pro-focus-card.is-expired[b-st1dfb12or] {
        --appointment-accent: var(--dash-muted);
        --appointment-background: color-mix(in srgb,var(--dash-muted) 7%,white);
        --appointment-text: var(--dash-muted);
    }

    .dashboard-pro-scheduler-appointment > span[b-st1dfb12or] {
        color: var(--appointment-accent);
        font-size: 0.72rem;
        font-weight: 950;
        line-height: 1.1;
    }

    .dashboard-pro-scheduler-appointment > strong[b-st1dfb12or] {
        overflow: hidden;
        font-size: 0.78rem;
        font-weight: 950;
        line-height: 1.15;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .dashboard-pro-scheduler-appointment > small[b-st1dfb12or],
    .dashboard-pro-scheduler-appointment > em[b-st1dfb12or] {
        overflow: hidden;
        color: color-mix(in srgb,var(--appointment-text) 72%,transparent);
        font-size: 0.64rem;
        font-style: normal;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.dashboard-pro-mobile-agenda[b-st1dfb12or] {
    display: none;
}

.dashboard-pro-kpi-grid[b-st1dfb12or] {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 0.8rem;
}

.dashboard-pro-kpi[b-st1dfb12or] {
    --kpi-accent: var(--dash-primary);
    position: relative;
    overflow: hidden;
    min-height: 132px;
    display: grid;
    align-content: start;
    gap: 0.35rem;
    padding: 0.9rem;
    border: 1px solid color-mix(in srgb,var(--kpi-accent) 17%,var(--dash-divider));
    border-left: 4px solid var(--kpi-accent);
    border-radius: 16px;
    background: linear-gradient(145deg,color-mix(in srgb,var(--kpi-accent) 7%,var(--dash-surface)),var(--dash-surface));
    box-shadow: 0 10px 24px color-mix(in srgb,var(--kpi-accent) 7%,transparent);
}

    .dashboard-pro-kpi.is-pending[b-st1dfb12or] {
        --kpi-accent: var(--dash-warning);
    }

    .dashboard-pro-kpi.is-confirmed[b-st1dfb12or] {
        --kpi-accent: var(--dash-primary);
    }

    .dashboard-pro-kpi.is-today[b-st1dfb12or] {
        --kpi-accent: var(--dash-info);
    }

    .dashboard-pro-kpi.is-completed[b-st1dfb12or] {
        --kpi-accent: var(--dash-success);
    }

    .dashboard-pro-kpi.is-utilization[b-st1dfb12or],
    .dashboard-pro-kpi.is-revenue[b-st1dfb12or] {
        --kpi-accent: var(--dash-secondary);
    }

    .dashboard-pro-kpi.is-noshow[b-st1dfb12or] {
        --kpi-accent: var(--dash-error);
    }

.dashboard-pro-kpi-top[b-st1dfb12or] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.45rem;
}

    .dashboard-pro-kpi-top span[b-st1dfb12or] {
        color: var(--dash-muted);
        font-size: 0.66rem;
        font-weight: 900;
        text-transform: uppercase;
    }

.salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-kpi-top .mud-icon-root {
    color: var(--kpi-accent) !important;
    font-size: 1.15rem;
}

.dashboard-pro-kpi > strong[b-st1dfb12or] {
    color: var(--dash-text);
    font-size: 1.85rem;
    font-weight: 950;
    line-height: 1;
    letter-spacing: -0.04em;
}

.dashboard-pro-kpi.is-revenue > strong[b-st1dfb12or] {
    color: var(--dash-secondary);
    font-size: 1.1rem;
    line-height: 1.1;
}

.dashboard-pro-kpi > small[b-st1dfb12or] {
    color: var(--dash-muted);
    font-size: 0.66rem;
    line-height: 1.35;
}

.dashboard-pro-analytics-grid[b-st1dfb12or] {
    display: grid;
    grid-template-columns: repeat(12,minmax(0,1fr));
    gap: 0.95rem;
    align-items: stretch;
}

.dashboard-pro-trend-card[b-st1dfb12or] {
    grid-column: span 5;
}

.dashboard-pro-outcomes-card[b-st1dfb12or] {
    grid-column: span 4;
}

.dashboard-pro-hours-card[b-st1dfb12or] {
    grid-column: span 3;
}

.dashboard-pro-services-card[b-st1dfb12or],
.dashboard-pro-team-card[b-st1dfb12or] {
    grid-column: span 6;
}

.dashboard-pro-ranking-grid[b-st1dfb12or] {
    display: contents;
}

.dashboard-pro-chart-card[b-st1dfb12or],
.dashboard-pro-ranking-card[b-st1dfb12or] {
    min-width: 0;
    display: grid;
    align-content: start;
    gap: 0.8rem;
    min-height: 220px;
    padding: 1rem;
    border: 1px solid color-mix(in srgb,var(--dash-primary) 10%,var(--dash-divider));
    border-radius: 18px;
    background: var(--dash-surface);
    box-shadow: 0 12px 30px color-mix(in srgb,var(--dash-primary) 7%,transparent);
}

.dashboard-pro-card-heading[b-st1dfb12or] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.7rem;
}

    .dashboard-pro-card-heading > div[b-st1dfb12or] {
        min-width: 0;
        display: grid;
        gap: 0.12rem;
    }

    .dashboard-pro-card-heading strong[b-st1dfb12or] {
        color: var(--dash-text);
        font-size: 0.9rem;
        font-weight: 950;
    }

    .dashboard-pro-card-heading > small[b-st1dfb12or] {
        color: var(--dash-secondary);
        font-size: 0.66rem;
        font-weight: 900;
        white-space: nowrap;
    }

.salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-card-heading > .mud-icon-root {
    color: var(--dash-secondary) !important;
}

.dashboard-pro-volume-chart[b-st1dfb12or] {
    min-height: 190px;
    display: grid;
    grid-template-columns: repeat(7, minmax(0,1fr));
    align-items: end;
    gap: 0.55rem;
    padding: 0.75rem 0.5rem 0.25rem;
    border-radius: 14px;
    background: linear-gradient(180deg, color-mix(in srgb,var(--dash-primary) 3%,white), transparent 58%), repeating-linear-gradient(to bottom,transparent 0 38px,color-mix(in srgb,var(--dash-divider) 70%,transparent) 38px 39px);
}

.dashboard-pro-volume-bar[b-st1dfb12or] {
    display: grid;
    justify-items: center;
    align-items: end;
    gap: 0.24rem;
    min-width: 0;
}

.dashboard-pro-volume-track[b-st1dfb12or] {
    position: relative;
    width: 100%;
    height: 122px;
    display: flex;
    align-items: end;
    justify-content: center;
}

    .dashboard-pro-volume-track b[b-st1dfb12or] {
        width: min(34px, 100%);
        min-height: 10%;
        border-radius: 12px 12px 6px 6px;
        background: linear-gradient(180deg, color-mix(in srgb,var(--dash-secondary) 80%,white), var(--dash-primary));
        box-shadow: 0 8px 18px color-mix(in srgb,var(--dash-primary) 10%,transparent);
    }

.dashboard-pro-volume-bar strong[b-st1dfb12or] {
    color: var(--dash-text);
    font-size: 0.74rem;
    font-weight: 950;
    line-height: 1;
}

.dashboard-pro-volume-bar small[b-st1dfb12or] {
    overflow: hidden;
    color: var(--dash-muted);
    font-size: 0.58rem;
    font-weight: 900;
    text-transform: uppercase;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-pro-chart-caption[b-st1dfb12or] {
    margin: 0;
    color: var(--dash-muted);
    font-size: 0.66rem;
    line-height: 1.4;
}

.dashboard-pro-donut-wrap[b-st1dfb12or] {
    display: grid;
    place-items: center;
    padding-block: 0.25rem;
}

.dashboard-pro-donut[b-st1dfb12or] {
    position: relative;
    width: 136px;
    height: 136px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    margin-inline: auto;
}

    .dashboard-pro-donut[b-st1dfb12or]::before {
        content: '';
        width: 92px;
        height: 92px;
        border-radius: inherit;
        background: var(--dash-surface);
        border: 1px solid var(--dash-divider);
    }

    .dashboard-pro-donut > div[b-st1dfb12or] {
        position: absolute;
        display: grid;
        justify-items: center;
    }

    .dashboard-pro-donut strong[b-st1dfb12or] {
        color: var(--dash-text);
        font-size: 1.55rem;
        font-weight: 950;
    }

    .dashboard-pro-donut span[b-st1dfb12or] {
        color: var(--dash-muted);
        font-size: 0.58rem;
    }

.dashboard-pro-status-legend[b-st1dfb12or] {
    display: grid;
    gap: 0.32rem;
}

    .dashboard-pro-status-legend > div[b-st1dfb12or] {
        display: grid;
        grid-template-columns: auto minmax(0,1fr) auto auto;
        gap: 0.4rem;
        align-items: center;
        min-height: 28px;
        padding: 0.28rem 0.35rem;
        border-radius: 8px;
        background: color-mix(in srgb,var(--dash-primary) 3%,transparent);
    }

    .dashboard-pro-status-legend span[b-st1dfb12or],
    .dashboard-pro-status-legend strong[b-st1dfb12or],
    .dashboard-pro-status-legend small[b-st1dfb12or] {
        font-size: 0.64rem;
    }

    .dashboard-pro-status-legend span[b-st1dfb12or],
    .dashboard-pro-status-legend small[b-st1dfb12or] {
        color: var(--dash-muted);
    }

.dashboard-pro-horizontal-bars[b-st1dfb12or] {
    min-height: 150px;
    display: grid;
    align-content: center;
    gap: 0.75rem;
}

    .dashboard-pro-horizontal-bars > div[b-st1dfb12or] {
        display: grid;
        grid-template-columns: 52px minmax(0,1fr) 28px;
        gap: 0.55rem;
        align-items: center;
    }

    .dashboard-pro-horizontal-bars span[b-st1dfb12or],
    .dashboard-pro-horizontal-bars strong[b-st1dfb12or] {
        color: var(--dash-text);
        font-size: 0.72rem;
        font-weight: 900;
    }

    .dashboard-pro-horizontal-bars i[b-st1dfb12or],
    .dashboard-pro-ranking-copy i[b-st1dfb12or],
    .dashboard-pro-team-row i[b-st1dfb12or] {
        position: relative;
        overflow: hidden;
        height: 7px;
        border-radius: 999px;
        background: color-mix(in srgb,var(--dash-divider) 78%,white);
    }

    .dashboard-pro-horizontal-bars b[b-st1dfb12or],
    .dashboard-pro-ranking-copy b[b-st1dfb12or],
    .dashboard-pro-team-row b[b-st1dfb12or] {
        position: absolute;
        inset: 0 auto 0 0;
        border-radius: inherit;
        background: linear-gradient(90deg,var(--dash-primary),var(--dash-secondary));
    }

.dashboard-pro-ranking-list[b-st1dfb12or],
.dashboard-pro-team-list[b-st1dfb12or] {
    display: grid;
    gap: 0.5rem;
}

.dashboard-pro-ranking-row[b-st1dfb12or],
.dashboard-pro-team-row[b-st1dfb12or] {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0,1fr);
    gap: 0.6rem;
    align-items: center;
    padding: 0.6rem;
    border: 1px solid var(--dash-divider);
    border-radius: 12px;
    background: color-mix(in srgb,var(--dash-primary) 3%,var(--dash-surface));
}

.dashboard-pro-ranking-index[b-st1dfb12or],
.dashboard-pro-team-avatar[b-st1dfb12or] {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    color: #fff;
    font-size: 0.68rem;
    font-weight: 950;
    border-radius: 11px;
    background: linear-gradient(135deg,var(--dash-primary),var(--dash-secondary));
}

.dashboard-pro-team-row img[b-st1dfb12or] {
    width: 36px;
    height: 36px;
    object-fit: cover;
    border-radius: 11px;
}

.dashboard-pro-ranking-copy[b-st1dfb12or],
.dashboard-pro-team-row > div[b-st1dfb12or] {
    min-width: 0;
    display: grid;
    gap: 0.12rem;
}

    .dashboard-pro-ranking-copy strong[b-st1dfb12or],
    .dashboard-pro-team-row strong[b-st1dfb12or] {
        overflow: hidden;
        color: var(--dash-text);
        font-size: 0.72rem;
        font-weight: 950;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .dashboard-pro-ranking-copy small[b-st1dfb12or],
    .dashboard-pro-team-row small[b-st1dfb12or] {
        color: var(--dash-muted);
        font-size: 0.62rem;
    }

.dashboard-pro-chart-empty[b-st1dfb12or] {
    min-height: 180px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 0.3rem;
    padding: 0.8rem;
    text-align: center;
    border: 1px dashed color-mix(in srgb,var(--dash-secondary) 35%,var(--dash-divider));
    border-radius: 14px;
    background: color-mix(in srgb,var(--dash-secondary) 4%,var(--dash-surface));
}

    .dashboard-pro-chart-empty.compact[b-st1dfb12or] {
        min-height: 140px;
    }

.salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-chart-empty .mud-icon-root {
    color: var(--dash-secondary) !important;
    font-size: 1.7rem;
}

.dashboard-pro-chart-empty strong[b-st1dfb12or] {
    color: var(--dash-text);
    font-size: 0.8rem;
    font-weight: 950;
}

.dashboard-pro-chart-empty span[b-st1dfb12or] {
    color: var(--dash-muted);
    font-size: 0.66rem;
}

.dashboard-pro-focus-grid[b-st1dfb12or] {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 0.65rem;
}

.dashboard-pro-focus-card[b-st1dfb12or] {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(82px,auto) minmax(0,1fr) auto;
    gap: 0.6rem;
    align-items: center;
    padding: 0.75rem;
    color: var(--dash-text);
    font-family: inherit;
    text-align: left;
    border: 1px solid var(--dash-divider);
    border-left: 4px solid var(--appointment-accent,var(--dash-primary));
    border-radius: 14px;
    background: var(--appointment-background,var(--dash-surface));
    cursor: pointer;
}

.dashboard-pro-focus-time[b-st1dfb12or],
.dashboard-pro-focus-copy[b-st1dfb12or],
.dashboard-pro-focus-status[b-st1dfb12or] {
    min-width: 0;
    display: grid;
    gap: 0.1rem;
}

    .dashboard-pro-focus-time span[b-st1dfb12or],
    .dashboard-pro-focus-copy span[b-st1dfb12or],
    .dashboard-pro-focus-copy small[b-st1dfb12or] {
        overflow: hidden;
        color: var(--dash-muted);
        font-size: 0.62rem;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .dashboard-pro-focus-time strong[b-st1dfb12or],
    .dashboard-pro-focus-copy strong[b-st1dfb12or] {
        overflow: hidden;
        color: var(--dash-text);
        font-size: 0.7rem;
        font-weight: 950;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.dashboard-pro-focus-status[b-st1dfb12or] {
    justify-items: center;
    color: var(--appointment-accent,var(--dash-primary));
}

.salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-focus-status .mud-icon-root {
    color: inherit !important;
}

.dashboard-pro-focus-status span[b-st1dfb12or] {
    font-size: 0.55rem;
    font-weight: 900;
}

.dashboard-pro-focus-empty[b-st1dfb12or],
.dashboard-pro-agenda-empty[b-st1dfb12or] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.8rem;
    border: 1px solid color-mix(in srgb,var(--dash-success) 18%,var(--dash-divider));
    border-radius: 14px;
    background: color-mix(in srgb,var(--dash-success) 6%,var(--dash-surface));
}

    .dashboard-pro-focus-empty > div[b-st1dfb12or] {
        display: grid;
        gap: 0.1rem;
    }

    .dashboard-pro-focus-empty strong[b-st1dfb12or],
    .dashboard-pro-agenda-empty strong[b-st1dfb12or] {
        color: var(--dash-text);
        font-size: 0.76rem;
        font-weight: 950;
    }

    .dashboard-pro-focus-empty span[b-st1dfb12or],
    .dashboard-pro-agenda-empty span[b-st1dfb12or] {
        color: var(--dash-muted);
        font-size: 0.66rem;
    }

.dashboard-pro-drawer-layer[b-st1dfb12or] {
    position: fixed;
    inset: 0;
    z-index: 1700;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.25rem;
}

.dashboard-pro-drawer-backdrop[b-st1dfb12or] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    background: rgba(15,23,42,0.34);
    backdrop-filter: blur(10px);
}

.dashboard-pro-appointment-drawer[b-st1dfb12or] {
    position: relative;
    z-index: 1;
    width: min(720px, calc(100vw - 2rem));
    max-height: min(88vh, 860px);
    overflow-y: auto;
    display: grid;
    align-content: start;
    gap: 0.8rem;
    padding: 1rem;
    background: var(--dash-background);
    border: 1px solid var(--dash-divider);
    border-radius: 22px;
    box-shadow: 0 24px 70px rgba(15,23,42,0.22);
}

.dashboard-pro-drawer-header[b-st1dfb12or] {
    position: sticky;
    top: -1rem;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.7rem;
    margin: -1rem -1rem 0;
    padding: 0.9rem 1rem;
    background: color-mix(in srgb,var(--dash-background) 96%,transparent);
    border-bottom: 1px solid var(--dash-divider);
    border-radius: 22px 22px 0 0;
    backdrop-filter: blur(14px);
}

    .dashboard-pro-drawer-header > div[b-st1dfb12or] {
        display: grid;
        gap: 0.12rem;
    }

    .dashboard-pro-drawer-header strong[b-st1dfb12or] {
        color: var(--dash-text);
        font-size: 0.9rem;
        font-weight: 950;
    }

@media (max-width: 1180px) {
    .dashboard-pro-hero-grid[b-st1dfb12or] {
        grid-template-columns: 1fr;
    }

    .dashboard-pro-hero-side[b-st1dfb12or] {
        max-width: 620px;
    }

    .dashboard-pro-control-grid[b-st1dfb12or] {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .dashboard-pro-control-copy[b-st1dfb12or],
    .dashboard-pro-filter-actions[b-st1dfb12or] {
        grid-column: 1 / -1;
    }

    .dashboard-pro-filter-actions[b-st1dfb12or] {
        justify-content: flex-start;
    }

    .dashboard-pro-kpi-grid[b-st1dfb12or] {
        grid-template-columns: repeat(3,minmax(0,1fr));
    }

    .dashboard-pro-trend-card[b-st1dfb12or],
    .dashboard-pro-outcomes-card[b-st1dfb12or] {
        grid-column: span 6;
    }

    .dashboard-pro-hours-card[b-st1dfb12or],
    .dashboard-pro-services-card[b-st1dfb12or],
    .dashboard-pro-team-card[b-st1dfb12or] {
        grid-column: span 6;
    }

    .dashboard-pro-scheduler-toolbar[b-st1dfb12or] {
        grid-template-columns: auto minmax(0,1fr);
    }

    .dashboard-pro-view-toggle[b-st1dfb12or] {
        justify-self: end;
    }
}

@media (max-width: 960px) {
    .dashboard-pro-attention-list[b-st1dfb12or],
    .dashboard-pro-focus-grid[b-st1dfb12or] {
        grid-template-columns: 1fr;
    }

    .dashboard-pro-kpi-grid[b-st1dfb12or] {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .dashboard-pro-trend-card[b-st1dfb12or],
    .dashboard-pro-outcomes-card[b-st1dfb12or],
    .dashboard-pro-hours-card[b-st1dfb12or],
    .dashboard-pro-services-card[b-st1dfb12or],
    .dashboard-pro-team-card[b-st1dfb12or] {
        grid-column: 1 / -1;
    }

    .dashboard-pro-scheduler-shell[b-st1dfb12or] {
        display: none;
    }

    .dashboard-pro-mobile-agenda[b-st1dfb12or] {
        display: grid;
        gap: 0.7rem;
        padding: 0.85rem;
        border: 1px solid var(--dash-divider);
        border-radius: 18px;
        background: var(--dash-surface);
    }

    .dashboard-pro-mobile-agenda-heading[b-st1dfb12or] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.7rem;
    }

        .dashboard-pro-mobile-agenda-heading > div[b-st1dfb12or] {
            display: grid;
            gap: 0.1rem;
        }

        .dashboard-pro-mobile-agenda-heading strong[b-st1dfb12or] {
            color: var(--dash-text);
            font-size: 0.82rem;
            font-weight: 950;
        }

    .dashboard-pro-agenda-day[b-st1dfb12or] {
        display: grid;
        grid-template-columns: 68px minmax(0,1fr);
        gap: 0.6rem;
        align-items: start;
    }

    .dashboard-pro-agenda-date[b-st1dfb12or] {
        display: grid;
        justify-items: center;
        gap: 0.08rem;
        padding: 0.5rem 0.3rem;
        color: #fff;
        border-radius: 12px;
        background: var(--dash-primary);
    }

        .dashboard-pro-agenda-date span[b-st1dfb12or] {
            font-size: 0.58rem;
            font-weight: 900;
            text-transform: uppercase;
        }

        .dashboard-pro-agenda-date strong[b-st1dfb12or] {
            font-size: 0.66rem;
        }

    .dashboard-pro-agenda-list[b-st1dfb12or] {
        min-width: 0;
        display: grid;
        gap: 0.45rem;
    }

    .dashboard-pro-agenda-item[b-st1dfb12or] {
        min-width: 0;
        display: grid;
        grid-template-columns: auto minmax(0,1fr) auto;
        gap: 0.55rem;
        align-items: center;
        padding: 0.65rem;
        color: var(--dash-text);
        font-family: inherit;
        text-align: left;
        border: 1px solid var(--dash-divider);
        border-left: 4px solid var(--appointment-accent,var(--dash-primary));
        border-radius: 12px;
        background: var(--appointment-background,var(--dash-surface));
    }

        .dashboard-pro-agenda-item > span[b-st1dfb12or] {
            color: var(--appointment-accent);
            font-size: 0.62rem;
            font-weight: 950;
        }

        .dashboard-pro-agenda-item > div[b-st1dfb12or] {
            min-width: 0;
            display: grid;
            gap: 0.08rem;
        }

        .dashboard-pro-agenda-item strong[b-st1dfb12or],
        .dashboard-pro-agenda-item small[b-st1dfb12or] {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .dashboard-pro-agenda-item strong[b-st1dfb12or] {
            font-size: 0.68rem;
        }

        .dashboard-pro-agenda-item small[b-st1dfb12or] {
            color: var(--dash-muted);
            font-size: 0.6rem;
        }
}

@media (max-width: 680px) {
    .salon-dashboard-page[b-st1dfb12or] {
        padding-bottom: 2rem;
    }

        .salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-hero {
            padding: 1rem;
            border-radius: 18px !important;
        }

        .salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-title {
            font-size: 1.8rem !important;
        }

    .dashboard-pro-meta-row[b-st1dfb12or],
    .dashboard-pro-hero-actions[b-st1dfb12or] {
        display: grid;
    }

        .dashboard-pro-meta-row span[b-st1dfb12or],
        .salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-hero-actions .mud-button-root {
            width: 100%;
        }

    .dashboard-pro-attention-heading[b-st1dfb12or] {
        grid-template-columns: auto minmax(0,1fr);
    }

    .salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-attention-heading > .mud-button-root {
        grid-column: 1 / -1;
        width: 100%;
    }

    .dashboard-pro-control-grid[b-st1dfb12or],
    .salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-scheduler-toolbar,
    .dashboard-pro-kpi-grid[b-st1dfb12or] {
        grid-template-columns: 1fr;
    }

    .dashboard-pro-view-toggle[b-st1dfb12or] {
        width: 100%;
        justify-self: stretch;
    }

    .dashboard-pro-section-heading[b-st1dfb12or] {
        align-items: flex-start;
        flex-direction: column;
    }

    .dashboard-pro-drawer-layer[b-st1dfb12or] {
        padding: 0.75rem;
    }

    .dashboard-pro-drawer-backdrop[b-st1dfb12or] {
        display: block;
    }

    .dashboard-pro-appointment-drawer[b-st1dfb12or] {
        width: min(100%, calc(100vw - 1.5rem));
        border-left: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .salon-dashboard-page *[b-st1dfb12or],
    .salon-dashboard-page *[b-st1dfb12or]::before,
    .salon-dashboard-page *[b-st1dfb12or]::after {
        scroll-behavior: auto !important;
        transition: none !important;
        animation: none !important;
    }
}


/* BB-SALON-DASHBOARD-PERFORMANCE-SCHEDULER-FIX-01 */
.dashboard-pro-section[b-st1dfb12or],
.dashboard-pro-analytics-grid[b-st1dfb12or],
.dashboard-pro-ranking-grid[b-st1dfb12or] {
    width: 100%;
    min-width: 0;
}

.dashboard-pro-scheduler-shell.is-week-view .dashboard-pro-scheduler-column[b-st1dfb12or] {
    min-width: 150px;
}

.dashboard-pro-scheduler-shell.is-day-view .dashboard-pro-scheduler-column[b-st1dfb12or] {
    min-width: 240px;
}

.dashboard-pro-scheduler-appointment.is-cancelled[b-st1dfb12or] {
    border-style: dashed;
    background: repeating-linear-gradient(135deg, color-mix(in srgb, var(--dash-muted) 9%, white) 0 8px, color-mix(in srgb, var(--dash-muted) 4%, white) 8px 16px);
}

.dashboard-pro-scheduler-appointment.is-expired[b-st1dfb12or] {
    border-style: dashed;
    background: repeating-linear-gradient(135deg, color-mix(in srgb, #a37a45 10%, white) 0 8px, color-mix(in srgb, #a37a45 5%, white) 8px 16px);
}

.dashboard-pro-scheduler-status[b-st1dfb12or] {
    width: fit-content;
    max-width: 100%;
    margin-top: 0.08rem;
    padding: 0.16rem 0.38rem;
    overflow: hidden;
    color: var(--appointment-text) !important;
    font-size: 0.56rem !important;
    font-weight: 950;
    font-style: normal;
    line-height: 1.1;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
    border: 1px solid color-mix(in srgb, var(--appointment-accent) 25%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--appointment-accent) 9%, white);
}

.dashboard-pro-performance-summary[b-st1dfb12or] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.45rem;
}

.dashboard-pro-analytics-grid[b-st1dfb12or] {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 0.95fr);
    gap: 1rem;
    align-items: stretch;
}

.dashboard-pro-trend-card[b-st1dfb12or],
.dashboard-pro-outcomes-card[b-st1dfb12or],
.dashboard-pro-hours-card[b-st1dfb12or],
.dashboard-pro-services-card[b-st1dfb12or],
.dashboard-pro-team-card[b-st1dfb12or] {
    grid-column: auto;
}

.dashboard-pro-ranking-grid[b-st1dfb12or] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.dashboard-pro-chart-card[b-st1dfb12or],
.dashboard-pro-ranking-card[b-st1dfb12or] {
    min-height: 300px;
}

.dashboard-pro-volume-chart[b-st1dfb12or] {
    min-height: 210px;
}

.dashboard-pro-volume-track[b-st1dfb12or] {
    height: 142px;
}

.dashboard-pro-donut[b-st1dfb12or] {
    width: 160px;
    height: 160px;
    box-shadow: 0 16px 34px color-mix(in srgb, var(--dash-primary) 10%, transparent);
}

    .dashboard-pro-donut[b-st1dfb12or]::before {
        width: 96px;
        height: 96px;
    }

.dashboard-pro-ranking-copy[b-st1dfb12or],
.dashboard-pro-team-row > div[b-st1dfb12or] {
    gap: 0.3rem;
}

.dashboard-pro-ranking-stats[b-st1dfb12or] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

    .dashboard-pro-ranking-stats span[b-st1dfb12or] {
        display: inline-flex;
        align-items: center;
        min-height: 26px;
        padding: 0.25rem 0.45rem;
        color: var(--dash-muted);
        font-size: 0.62rem;
        font-weight: 780;
        line-height: 1.2;
        border: 1px solid var(--dash-divider);
        border-radius: 999px;
        background: color-mix(in srgb, var(--dash-primary) 3%, var(--dash-surface));
    }

.salon-dashboard-page[b-st1dfb12or]  .dashboard-pro-control-center input::placeholder {
    color: color-mix(in srgb, var(--dash-muted) 88%, transparent);
    font-size: 0.72rem;
    opacity: 1;
}

@media (max-width: 1120px) {
    .dashboard-pro-analytics-grid[b-st1dfb12or] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-pro-trend-card[b-st1dfb12or] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 820px) {
    .dashboard-pro-analytics-grid[b-st1dfb12or],
    .dashboard-pro-ranking-grid[b-st1dfb12or] {
        grid-template-columns: 1fr;
    }

    .dashboard-pro-performance-summary[b-st1dfb12or] {
        justify-content: flex-start;
    }
}


/* BB-DASHBOARD-FINAL-SCHEDULER-POLISH-01 */
.dashboard-pro-scheduler-appointment[b-st1dfb12or] {
    grid-template-rows: auto auto auto;
    align-content: start;
    row-gap: 0.12rem;
}

    .dashboard-pro-scheduler-appointment > span[b-st1dfb12or],
    .dashboard-pro-scheduler-appointment > strong[b-st1dfb12or],
    .dashboard-pro-scheduler-appointment > small[b-st1dfb12or],
    .dashboard-pro-scheduler-appointment > em[b-st1dfb12or] {
        min-width: 0;
        max-width: 100%;
        line-height: 1.08;
    }

    .dashboard-pro-scheduler-appointment > strong[b-st1dfb12or],
    .dashboard-pro-scheduler-appointment > small[b-st1dfb12or] {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .dashboard-pro-scheduler-appointment > span[b-st1dfb12or] {
        font-variant-numeric: tabular-nums;
    }

.dashboard-pro-scheduler-status[b-st1dfb12or] {
    width: fit-content;
    max-width: 100%;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    min-height: 17px;
    padding: 0.1rem 0.32rem;
    color: var(--appointment-text, var(--dash-muted));
    font-size: 0.54rem !important;
    font-weight: 950;
    line-height: 1 !important;
    letter-spacing: 0.025em;
    text-transform: uppercase;
    text-overflow: ellipsis;
    white-space: nowrap;
    border: 1px solid color-mix(in srgb, var(--appointment-accent, var(--dash-muted)) 25%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--appointment-background, white) 74%, white);
}

/* The modal is rendered outside .salon-dashboard-page, so declare its theme
   values here instead of relying on inherited dashboard custom properties. */
.dashboard-pro-drawer-layer[b-st1dfb12or] {
    --dash-primary: var(--mud-palette-primary, #15324b);
    --dash-secondary: var(--mud-palette-secondary, #b89b5e);
    --dash-success: var(--mud-palette-success, #2f7d72);
    --dash-warning: var(--mud-palette-warning, #c58a22);
    --dash-error: var(--mud-palette-error, #b42318);
    --dash-surface: var(--mud-palette-surface, #fffdf8);
    --dash-background: var(--mud-palette-background, #f7f3ea);
    --dash-text: var(--mud-palette-text-primary, #18212b);
    --dash-muted: var(--mud-palette-text-secondary, #667085);
    --dash-divider: var(--mud-palette-divider, #e5dcce);
}

.dashboard-pro-appointment-drawer[b-st1dfb12or] {
    opacity: 1;
    background: radial-gradient(circle at 94% 4%, color-mix(in srgb, var(--dash-secondary) 10%, transparent), transparent 30%), linear-gradient(145deg, var(--dash-surface), color-mix(in srgb, var(--dash-secondary) 5%, var(--dash-background)));
    border-color: color-mix(in srgb, var(--dash-primary) 13%, var(--dash-divider));
}

.dashboard-pro-drawer-header[b-st1dfb12or] {
    background: color-mix(in srgb, var(--dash-surface) 98%, var(--dash-background));
}

.dashboard-pro-appointment-drawer[b-st1dfb12or]  .mud-paper,
.dashboard-pro-appointment-drawer[b-st1dfb12or]  .mud-card {
    opacity: 1;
    background-color: var(--dash-surface) !important;
}

.dashboard-pro-status-legend > div.is-cancelled i[b-st1dfb12or] {
    background: #7b8492;
}

.dashboard-pro-status-legend > div.is-expired i[b-st1dfb12or] {
    background: #a37a45;
}


/* BB-SCHEDULER-CARD-TEXT-FIX-01 */
.dashboard-pro-scheduler-appointment[b-st1dfb12or] {
    grid-template-rows: minmax(0, auto) minmax(0, auto);
    align-content: center;
    row-gap: 0.18rem;
    padding-block: 0.42rem;
}

.dashboard-pro-scheduler-primary-line[b-st1dfb12or] {
    min-width: 0;
    max-width: 100%;
    display: flex;
    align-items: baseline;
    gap: 0.38rem;
    overflow: hidden;
    line-height: 1.05;
}

    .dashboard-pro-scheduler-primary-line time[b-st1dfb12or] {
        flex: 0 0 auto;
        color: var(--appointment-accent);
        font-size: 0.68rem;
        font-weight: 950;
        font-variant-numeric: tabular-nums;
        line-height: 1;
    }

    .dashboard-pro-scheduler-primary-line strong[b-st1dfb12or] {
        min-width: 0;
        overflow: hidden;
        color: var(--appointment-text, var(--dash-primary));
        font-size: 0.73rem;
        font-weight: 950;
        line-height: 1.05;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.dashboard-pro-scheduler-appointment > small[b-st1dfb12or],
.dashboard-pro-scheduler-appointment > .dashboard-pro-scheduler-status[b-st1dfb12or] {
    min-width: 0;
    max-width: 100%;
    margin: 0;
    line-height: 1;
}

.dashboard-pro-scheduler-appointment > small[b-st1dfb12or] {
    overflow: hidden;
    color: color-mix(in srgb, var(--appointment-text) 70%, transparent);
    font-size: 0.6rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-pro-scheduler-appointment > .dashboard-pro-scheduler-status[b-st1dfb12or] {
    justify-self: start;
    min-height: 15px;
    padding: 0.08rem 0.28rem;
    font-size: 0.49rem !important;
    letter-spacing: 0.015em;
}

.dashboard-pro-scheduler-appointment.is-cancelled[b-st1dfb12or],
.dashboard-pro-scheduler-appointment.is-expired[b-st1dfb12or] {
    align-content: center;
}

@media (max-width: 1180px) {
    .dashboard-pro-scheduler-primary-line[b-st1dfb12or] {
        gap: 0.28rem;
    }

        .dashboard-pro-scheduler-primary-line time[b-st1dfb12or] {
            font-size: 0.64rem;
        }

        .dashboard-pro-scheduler-primary-line strong[b-st1dfb12or] {
            font-size: 0.68rem;
        }
}
/* /Components/Pages/SalonDetails.razor.rz.scp.css */
.salon-details-page[b-cy0nhsszp0] {
    --salon-details-primary: var(--mud-palette-primary);
    --salon-details-secondary: var(--mud-palette-secondary);
    --salon-details-info: var(--mud-palette-info);
    --salon-details-success: var(--mud-palette-success);
    --salon-details-warning: var(--mud-palette-warning);
    --salon-details-surface: var(--mud-palette-surface);
    --salon-details-background: var(--mud-palette-background);
    --salon-details-text-primary: var(--mud-palette-text-primary);
    --salon-details-text-secondary: var(--mud-palette-text-secondary);
    --salon-details-divider: var(--mud-palette-divider);
    padding-bottom: 4rem;
}

    .salon-details-page[b-cy0nhsszp0]  .salon-details-loading-panel {
        padding: 1.25rem;
        border-radius: 24px;
        background: var(--salon-details-surface);
        border: 1px solid color-mix(in srgb, var(--salon-details-primary) 10%, var(--salon-details-divider));
        box-shadow: 0 16px 42px color-mix(in srgb, var(--salon-details-text-primary) 6%, transparent);
    }

    .salon-details-page[b-cy0nhsszp0]  .salon-details-error-alert {
        border-radius: 18px;
        box-shadow: 0 16px 40px color-mix(in srgb, var(--mud-palette-error) 16%, transparent);
    }

    .salon-details-page[b-cy0nhsszp0]  .salon-profile-hero {
        position: relative;
        overflow: hidden;
        padding: 2.45rem;
        border-radius: 36px;
        background: radial-gradient(circle at 88% 14%, color-mix(in srgb, var(--salon-details-secondary) 22%, transparent), transparent 30%), radial-gradient(circle at 12% 92%, color-mix(in srgb, var(--salon-details-primary) 16%, transparent), transparent 32%), linear-gradient(135deg, color-mix(in srgb, var(--salon-details-surface) 98%, var(--salon-details-primary)), var(--salon-details-surface) 52%, color-mix(in srgb, var(--salon-details-secondary) 8%, var(--salon-details-surface)));
        border: 1px solid color-mix(in srgb, var(--salon-details-primary) 12%, var(--salon-details-divider));
        box-shadow: 0 30px 76px color-mix(in srgb, var(--salon-details-primary) 12%, transparent);
    }

        .salon-details-page[b-cy0nhsszp0]  .salon-profile-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(112deg, color-mix(in srgb, var(--salon-details-surface) 78%, transparent), transparent 54%), radial-gradient(circle at 42% 14%, color-mix(in srgb, var(--salon-details-primary) 7%, transparent), transparent 25%);
            pointer-events: none;
        }

.salon-profile-hero-glow[b-cy0nhsszp0] {
    position: absolute;
    border-radius: 999px;
    pointer-events: none;
    filter: blur(10px);
}

.salon-profile-hero-glow-one[b-cy0nhsszp0] {
    top: 2.5rem;
    right: 8rem;
    width: 175px;
    height: 175px;
    background: color-mix(in srgb, var(--salon-details-secondary) 14%, transparent);
}

.salon-profile-hero-glow-two[b-cy0nhsszp0] {
    left: -4rem;
    bottom: -6rem;
    width: 310px;
    height: 310px;
    background: color-mix(in srgb, var(--salon-details-primary) 11%, transparent);
}

.salon-details-page[b-cy0nhsszp0]  .salon-profile-hero-grid {
    position: relative;
    z-index: 2;
    align-items: stretch;
}

.salon-details-page[b-cy0nhsszp0]  .salon-profile-hero-copy {
    position: relative;
    z-index: 3;
    height: 100%;
    justify-content: center;
}

.salon-details-page[b-cy0nhsszp0]  .salon-profile-badges {
    flex-wrap: wrap;
}

.salon-details-page[b-cy0nhsszp0]  .salon-profile-title {
    max-width: 720px;
    color: var(--salon-details-text-primary);
    font-size: clamp(2.05rem, 3.25vw, 3.15rem);
    font-weight: 950;
    line-height: 1.04;
    letter-spacing: -0.047em;
    text-wrap: balance;
    overflow-wrap: anywhere;
}

.salon-profile-location-line[b-cy0nhsszp0] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin-top: 0.78rem;
    padding: 0.62rem 0.9rem;
    color: var(--salon-details-secondary);
    font-size: 0.94rem;
    font-weight: 850;
    border-radius: 10px;
    background: color-mix(in srgb, var(--salon-details-secondary) 8%, var(--salon-details-surface));
    border: 1px solid color-mix(in srgb, var(--salon-details-secondary) 13%, var(--salon-details-divider));
}

.salon-details-page[b-cy0nhsszp0]  .salon-profile-location-line .mud-icon-root {
    color: var(--salon-details-secondary);
}

.salon-details-page[b-cy0nhsszp0]  .salon-profile-description {
    max-width: 710px;
    color: var(--salon-details-text-secondary);
    font-size: 1.02rem;
    line-height: 1.68;
    font-weight: 620;
}

.salon-profile-actions[b-cy0nhsszp0] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
}

.salon-details-page[b-cy0nhsszp0]  .salon-profile-actions .mud-button-root {
    min-height: 52px;
    border-radius: 10px !important;
    font-weight: 950;
    letter-spacing: 0.02em;
}

.salon-profile-trust-row[b-cy0nhsszp0] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

    .salon-profile-trust-row span[b-cy0nhsszp0] {
        display: inline-flex;
        align-items: center;
        gap: 0.38rem;
        padding: 0.58rem 0.78rem;
        color: var(--salon-details-text-primary);
        font-size: 0.82rem;
        font-weight: 850;
        border-radius: 10px;
        background: color-mix(in srgb, var(--salon-details-primary) 6%, var(--salon-details-surface));
        border: 1px solid color-mix(in srgb, var(--salon-details-primary) 9%, var(--salon-details-divider));
    }

.salon-details-page[b-cy0nhsszp0]  .salon-profile-trust-row .mud-icon-root {
    color: var(--salon-details-primary);
}

.salon-profile-preview-card[b-cy0nhsszp0] {
    position: relative;
    overflow: hidden;
    min-height: 100%;
    display: grid;
    gap: 1.25rem;
    align-content: space-between;
    padding: 1.45rem;
    border-radius: 32px;
    color: #ffffff;
    background: radial-gradient(circle at 86% 14%, color-mix(in srgb, var(--salon-details-secondary) 42%, transparent), transparent 34%), radial-gradient(circle at 12% 94%, color-mix(in srgb, var(--salon-details-primary) 36%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--salon-details-text-primary) 92%, var(--salon-details-primary)), var(--salon-details-primary) 56%, color-mix(in srgb, var(--salon-details-primary) 78%, var(--salon-details-secondary)));
    border: 1px solid color-mix(in srgb, var(--salon-details-surface) 16%, transparent);
    box-shadow: 0 24px 62px color-mix(in srgb, var(--salon-details-text-primary) 16%, transparent);
}

    .salon-profile-preview-card[b-cy0nhsszp0]::before {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(135deg, rgba(255,255,255,0.16), transparent 48%), repeating-linear-gradient(135deg, rgba(255,255,255,0.06) 0 1px, transparent 1px 18px);
        pointer-events: none;
    }

    .salon-profile-preview-card > *[b-cy0nhsszp0] {
        position: relative;
        z-index: 2;
    }

.salon-profile-preview-card-with-image[b-cy0nhsszp0] {
    background: linear-gradient(135deg, color-mix(in srgb, var(--salon-details-text-primary) 92%, var(--salon-details-primary)), var(--salon-details-primary));
}

.salon-profile-preview-image[b-cy0nhsszp0] {
    position: absolute !important;
    inset: 0;
    z-index: 0 !important;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.01);
    filter: saturate(1.05) contrast(1.02);
}

.salon-profile-preview-image-overlay[b-cy0nhsszp0] {
    position: absolute !important;
    inset: 0;
    z-index: 1 !important;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.20), rgba(15, 23, 42, 0.76)), radial-gradient(circle at 18% 12%, rgba(255, 255, 255, 0.16), transparent 28%), radial-gradient(circle at 84% 18%, color-mix(in srgb, var(--salon-details-secondary) 28%, transparent), transparent 30%);
    pointer-events: none;
}

.salon-profile-preview-card-with-image[b-cy0nhsszp0]::before {
    z-index: 2;
    background: linear-gradient(135deg, rgba(255,255,255,0.12), transparent 48%), repeating-linear-gradient(135deg, rgba(255,255,255,0.05) 0 1px, transparent 1px 18px);
}

.salon-profile-preview-card-with-image > *[b-cy0nhsszp0] {
    position: relative;
    z-index: 3;
}

.salon-profile-preview-card-with-image .salon-profile-preview-image[b-cy0nhsszp0],
.salon-profile-preview-card-with-image .salon-profile-preview-image-overlay[b-cy0nhsszp0] {
    position: absolute !important;
}

.salon-profile-preview-top[b-cy0nhsszp0] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.salon-profile-preview-initials[b-cy0nhsszp0] {
    width: 74px;
    height: 74px;
    display: grid;
    place-items: center;
    color: #ffffff;
    font-size: 1.35rem;
    font-weight: 950;
    letter-spacing: -0.04em;
    border-radius: 24px;
    background: rgba(255,255,255,0.18);
    border: 1px solid rgba(255,255,255,0.28);
    backdrop-filter: blur(14px);
    box-shadow: 0 18px 38px rgba(15, 23, 42, 0.26);
}

.salon-profile-preview-chips[b-cy0nhsszp0] {
    flex-wrap: wrap;
    justify-content: flex-end;
}

    .salon-profile-preview-chips span[b-cy0nhsszp0] {
        padding: 0.34rem 0.58rem;
        color: rgba(255,255,255,0.92);
        font-size: 0.68rem;
        font-weight: 950;
        text-transform: uppercase;
        letter-spacing: 0.07em;
        border-radius: 10px;
        background: rgba(255,255,255,0.15);
        border: 1px solid rgba(255,255,255,0.22);
    }

.salon-details-page[b-cy0nhsszp0]  .salon-profile-preview-label {
    color: rgba(255,255,255,0.78);
    font-weight: 950;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.salon-details-page[b-cy0nhsszp0]  .salon-profile-preview-name {
    color: #ffffff;
    font-weight: 950;
    line-height: 1.08;
    letter-spacing: -0.04em;
    text-wrap: balance;
    overflow-wrap: anywhere;
}

.salon-details-page[b-cy0nhsszp0]  .salon-profile-preview-location {
    color: rgba(255,255,255,0.82);
    font-weight: 700;
}

.salon-profile-preview-stats[b-cy0nhsszp0] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.7rem;
}

.salon-profile-preview-stat[b-cy0nhsszp0] {
    min-width: 0;
    display: grid;
    gap: 0.22rem;
    padding: 0.78rem;
    border-radius: 18px;
    background: rgba(255,255,255,0.13);
    border: 1px solid rgba(255,255,255,0.18);
    backdrop-filter: blur(12px);
}

    .salon-profile-preview-stat strong[b-cy0nhsszp0] {
        color: #ffffff;
        font-size: 0.98rem;
        font-weight: 950;
        line-height: 1.12;
        overflow-wrap: anywhere;
    }

    .salon-profile-preview-stat span[b-cy0nhsszp0] {
        color: rgba(255,255,255,0.74);
        font-size: 0.68rem;
        font-weight: 850;
        line-height: 1.2;
    }

.salon-profile-preview-stat-price strong[b-cy0nhsszp0] {
    font-size: 0.92rem;
}

.salon-profile-preview-note[b-cy0nhsszp0] {
    padding: 0.95rem;
    color: rgba(255,255,255,0.86);
    font-size: 0.86rem;
    font-weight: 650;
    line-height: 1.45;
    border-radius: 20px;
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.18);
}

.salon-profile-content-grid[b-cy0nhsszp0] {
    align-items: flex-start;
}

.salon-details-page[b-cy0nhsszp0]  .salon-profile-panel {
    padding: 1.45rem;
    border-radius: 30px;
    background: radial-gradient(circle at 92% 12%, color-mix(in srgb, var(--salon-details-secondary) 7%, transparent), transparent 30%), var(--salon-details-surface);
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 9%, var(--salon-details-divider));
    box-shadow: 0 18px 46px color-mix(in srgb, var(--salon-details-text-primary) 7%, transparent);
}

.salon-details-page[b-cy0nhsszp0]  .media-panel {
    background: radial-gradient(circle at 90% 12%, color-mix(in srgb, var(--salon-details-secondary) 10%, transparent), transparent 30%), linear-gradient(135deg, color-mix(in srgb, var(--salon-details-surface) 96%, var(--salon-details-primary)), var(--salon-details-surface));
}

.salon-media-grid[b-cy0nhsszp0] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
}

.salon-media-card[b-cy0nhsszp0] {
    position: relative;
    overflow: hidden;
    min-height: 170px;
    margin: 0;
    border-radius: 24px;
    background: color-mix(in srgb, var(--salon-details-primary) 8%, var(--salon-details-surface));
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 10%, var(--salon-details-divider));
    box-shadow: 0 14px 34px color-mix(in srgb, var(--salon-details-text-primary) 7%, transparent);
}

.salon-media-card-primary[b-cy0nhsszp0] {
    grid-column: span 2;
    min-height: 260px;
}

.salon-media-card img[b-cy0nhsszp0] {
    width: 100%;
    min-height: 170px;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 180ms ease, filter 180ms ease;
}

.salon-media-card-primary img[b-cy0nhsszp0] {
    min-height: 260px;
}

.salon-media-card:hover img[b-cy0nhsszp0] {
    transform: scale(1.035);
    filter: saturate(1.07);
}

.salon-media-card[b-cy0nhsszp0]::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 50%, rgba(15, 23, 42, 0.52));
    pointer-events: none;
}

.salon-media-card figcaption[b-cy0nhsszp0] {
    position: absolute;
    left: 0.8rem;
    bottom: 0.75rem;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 0.28rem;
    padding: 0.38rem 0.58rem;
    color: #ffffff;
    font-size: 0.72rem;
    font-weight: 950;
    line-height: 1;
    border-radius: 10px;
    background: rgba(15, 23, 42, 0.52);
    border: 1px solid rgba(255,255,255,0.18);
    backdrop-filter: blur(12px);
}

.salon-details-page[b-cy0nhsszp0]  .salon-media-card figcaption .mud-icon-root {
    color: var(--salon-details-secondary);
    font-size: 0.9rem;
}

.salon-details-page[b-cy0nhsszp0]  .services-panel {
    background: radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--salon-details-primary) 9%, transparent), transparent 30%), radial-gradient(circle at 10% 94%, color-mix(in srgb, var(--salon-details-secondary) 8%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--salon-details-surface) 94%, var(--salon-details-primary)), color-mix(in srgb, var(--salon-details-surface) 91%, var(--salon-details-secondary)));
}

.salon-details-page[b-cy0nhsszp0]  .salon-section-header {
    gap: 1rem;
}

.salon-details-page[b-cy0nhsszp0]  .salon-section-title {
    color: var(--salon-details-text-primary);
    font-weight: 950;
    letter-spacing: -0.03em;
}

.salon-details-page[b-cy0nhsszp0]  .salon-section-subtitle {
    color: var(--salon-details-text-secondary);
    font-weight: 600;
}

.salon-service-list[b-cy0nhsszp0] {
    display: grid;
    gap: 1.15rem;
}

.salon-details-page[b-cy0nhsszp0]  .salon-service-card {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 1.35rem;
    align-items: center;
    padding: 1.55rem 1.75rem;
    cursor: pointer;
    outline: none;
    border-radius: 32px;
    background: radial-gradient(circle at 7% 12%, color-mix(in srgb, var(--salon-details-primary) 13%, transparent), transparent 28%), radial-gradient(circle at 94% 10%, color-mix(in srgb, var(--salon-details-secondary) 16%, transparent), transparent 34%), radial-gradient(circle at 86% 94%, color-mix(in srgb, var(--salon-details-primary) 9%, transparent), transparent 36%), linear-gradient(135deg, color-mix(in srgb, var(--salon-details-surface) 96%, white) 0%, color-mix(in srgb, var(--salon-details-primary) 5%, var(--salon-details-surface)) 48%, color-mix(in srgb, var(--salon-details-secondary) 6%, var(--salon-details-surface)) 100%);
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 18%, var(--salon-details-divider));
    box-shadow: 0 20px 48px color-mix(in srgb, var(--salon-details-text-primary) 8%, transparent), 0 8px 24px color-mix(in srgb, var(--salon-details-primary) 6%, transparent), inset 0 1px 0 rgba(255,255,255,0.82);
    transition: transform 170ms ease, box-shadow 170ms ease, border-color 170ms ease, background 170ms ease;
}

    .salon-details-page[b-cy0nhsszp0]  .salon-service-card::before {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(105deg, rgba(255,255,255,0.6) 0%, rgba(255,255,255,0.26) 36%, transparent 72%), linear-gradient(90deg, color-mix(in srgb, var(--salon-details-primary) 5%, transparent), transparent 30%, color-mix(in srgb, var(--salon-details-secondary) 6%, transparent));
        opacity: 1;
        pointer-events: none;
    }

    .salon-details-page[b-cy0nhsszp0]  .salon-service-card::after {
        content: "";
        position: absolute;
        right: -58px;
        bottom: -78px;
        width: 190px;
        height: 190px;
        border-radius: 999px;
        background: color-mix(in srgb, var(--salon-details-secondary) 9%, transparent);
        pointer-events: none;
        transition: transform 170ms ease, background 170ms ease;
    }

    .salon-details-page[b-cy0nhsszp0]  .salon-service-card:hover,
    .salon-details-page[b-cy0nhsszp0]  .salon-service-card:focus-visible {
        transform: translateY(-5px);
        border-color: color-mix(in srgb, var(--salon-details-primary) 38%, var(--salon-details-divider));
        box-shadow: 0 32px 76px color-mix(in srgb, var(--salon-details-primary) 16%, transparent), 0 12px 30px color-mix(in srgb, var(--salon-details-secondary) 9%, transparent), inset 0 1px 0 rgba(255,255,255,0.86);
    }

        .salon-details-page[b-cy0nhsszp0]  .salon-service-card:hover::after,
        .salon-details-page[b-cy0nhsszp0]  .salon-service-card:focus-visible::after {
            transform: scale(1.12);
            background: color-mix(in srgb, var(--salon-details-secondary) 12%, transparent);
        }

    .salon-details-page[b-cy0nhsszp0]  .salon-service-card:focus-visible {
        box-shadow: 0 0 0 4px color-mix(in srgb, var(--salon-details-primary) 16%, transparent), 0 32px 76px color-mix(in srgb, var(--salon-details-primary) 16%, transparent);
    }

.salon-details-page[b-cy0nhsszp0]  .salon-service-card-selected {
    border-color: color-mix(in srgb, var(--salon-details-success) 52%, var(--salon-details-divider));
    background: radial-gradient(circle at 7% 12%, color-mix(in srgb, var(--salon-details-success) 15%, transparent), transparent 28%), radial-gradient(circle at 94% 10%, color-mix(in srgb, var(--salon-details-secondary) 16%, transparent), transparent 34%), radial-gradient(circle at 86% 94%, color-mix(in srgb, var(--salon-details-primary) 9%, transparent), transparent 36%), linear-gradient(135deg, color-mix(in srgb, var(--salon-details-success) 9%, var(--salon-details-surface)) 0%, color-mix(in srgb, var(--salon-details-surface) 98%, white) 52%, color-mix(in srgb, var(--salon-details-secondary) 6%, var(--salon-details-surface)) 100%);
    box-shadow: 0 28px 68px color-mix(in srgb, var(--salon-details-success) 14%, transparent), 0 8px 24px color-mix(in srgb, var(--salon-details-primary) 8%, transparent), inset 0 1px 0 rgba(255,255,255,0.82);
}

    .salon-details-page[b-cy0nhsszp0]  .salon-service-card-selected::before {
        background: linear-gradient(105deg, rgba(255,255,255,0.62) 0%, rgba(255,255,255,0.28) 36%, transparent 72%), linear-gradient(90deg, color-mix(in srgb, var(--salon-details-success) 9%, transparent), transparent 30%, color-mix(in srgb, var(--salon-details-secondary) 6%, transparent));
    }

.salon-service-logo-mark[b-cy0nhsszp0] {
    position: relative;
    z-index: 2;
    width: 64px;
    height: 64px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 21px;
    background: transparent;
    box-shadow: 0 18px 38px color-mix(in srgb, var(--salon-details-primary) 14%, transparent), 0 6px 18px color-mix(in srgb, var(--salon-details-secondary) 9%, transparent);
    transition: transform 170ms ease, box-shadow 170ms ease;
}

    .salon-service-logo-mark img[b-cy0nhsszp0] {
        width: 64px;
        max-width: 64px;
        height: 64px;
        display: block;
        object-fit: contain;
        border-radius: 21px;
    }

.salon-details-page[b-cy0nhsszp0]  .salon-service-card:hover .salon-service-logo-mark,
.salon-details-page[b-cy0nhsszp0]  .salon-service-card:focus-visible .salon-service-logo-mark {
    transform: translateY(-2px) scale(1.04);
    box-shadow: 0 22px 48px color-mix(in srgb, var(--salon-details-primary) 18%, transparent), 0 8px 22px color-mix(in srgb, var(--salon-details-secondary) 11%, transparent);
}

.salon-service-card-copy[b-cy0nhsszp0] {
    position: relative;
    z-index: 2;
    min-width: 0;
    display: grid;
    gap: 0.55rem;
    padding-left: 0.15rem;
}

.salon-service-title-row[b-cy0nhsszp0] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.55rem;
    min-width: 0;
}

.salon-details-page[b-cy0nhsszp0]  .salon-service-name {
    color: var(--salon-details-text-primary);
    font-size: 1.1rem;
    font-weight: 950;
    line-height: 1.16;
    letter-spacing: -0.02em;
    overflow-wrap: anywhere;
}

.salon-service-selected-pill[b-cy0nhsszp0] {
    display: inline-flex;
    align-items: center;
    gap: 0.28rem;
    padding: 0.3rem 0.56rem;
    color: #ffffff;
    font-size: 0.72rem;
    font-weight: 950;
    line-height: 1;
    border-radius: 10px;
    background: var(--salon-details-success);
    box-shadow: 0 10px 22px color-mix(in srgb, var(--salon-details-success) 20%, transparent);
}

.salon-details-page[b-cy0nhsszp0]  .salon-service-selected-pill .mud-icon-root {
    color: #ffffff;
    font-size: 0.92rem;
}

.salon-details-page[b-cy0nhsszp0]  .salon-service-description {
    max-width: 560px;
    color: var(--salon-details-text-secondary);
    font-size: 0.9rem;
    line-height: 1.52;
    font-weight: 650;
}

.salon-service-meta[b-cy0nhsszp0] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.52rem;
    padding-top: 0.08rem;
}

    .salon-service-meta span[b-cy0nhsszp0] {
        display: inline-flex;
        align-items: center;
        gap: 0.32rem;
        padding: 0.46rem 0.68rem;
        color: var(--salon-details-text-primary);
        font-size: 0.75rem;
        font-weight: 850;
        border-radius: 10px;
        background: linear-gradient(180deg, rgba(255,255,255,0.62), rgba(255,255,255,0.34)), color-mix(in srgb, var(--salon-details-primary) 7%, var(--salon-details-surface));
        border: 1px solid color-mix(in srgb, var(--salon-details-primary) 13%, var(--salon-details-divider));
        box-shadow: 0 8px 18px color-mix(in srgb, var(--salon-details-primary) 4%, transparent);
    }

.salon-details-page[b-cy0nhsszp0]  .salon-service-meta .mud-icon-root {
    color: var(--salon-details-primary);
}

.salon-service-card-side[b-cy0nhsszp0] {
    position: relative;
    z-index: 2;
    min-width: 142px;
    display: grid;
    justify-items: end;
    gap: 0.42rem;
    padding-left: 1.25rem;
}

    .salon-service-card-side strong[b-cy0nhsszp0] {
        color: var(--salon-details-text-primary);
        font-size: 1.1rem;
        font-weight: 950;
        line-height: 1.1;
        letter-spacing: -0.02em;
        overflow-wrap: anywhere;
        text-align: right;
    }

.salon-service-select-hint[b-cy0nhsszp0] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    padding: 0.36rem 0.66rem;
    color: var(--salon-details-primary);
    font-size: 0.7rem;
    font-weight: 950;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    border-radius: 10px;
    background: linear-gradient(180deg, rgba(255,255,255,0.66), rgba(255,255,255,0.36)), color-mix(in srgb, var(--salon-details-primary) 8%, var(--salon-details-surface));
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 10%, var(--salon-details-divider));
    box-shadow: 0 8px 18px color-mix(in srgb, var(--salon-details-primary) 5%, transparent);
}

.salon-service-card-selected .salon-service-select-hint[b-cy0nhsszp0] {
    color: var(--salon-details-success);
    background: linear-gradient(180deg, rgba(255,255,255,0.66), rgba(255,255,255,0.36)), color-mix(in srgb, var(--salon-details-success) 9%, var(--salon-details-surface));
    border-color: color-mix(in srgb, var(--salon-details-success) 14%, var(--salon-details-divider));
}

.salon-profile-empty-block[b-cy0nhsszp0] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.9rem;
    align-items: center;
    padding: 1rem;
    border-radius: 24px;
    background: color-mix(in srgb, var(--salon-details-primary) 6%, var(--salon-details-surface));
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 9%, var(--salon-details-divider));
}

.salon-profile-empty-icon[b-cy0nhsszp0] {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border-radius: 20px;
    background: linear-gradient(135deg, var(--salon-details-primary), var(--salon-details-secondary));
    box-shadow: 0 14px 30px color-mix(in srgb, var(--salon-details-primary) 18%, transparent);
}

.salon-details-page[b-cy0nhsszp0]  .salon-profile-empty-icon .mud-icon-root {
    color: #ffffff;
    font-size: 1.45rem;
}

.salon-details-page[b-cy0nhsszp0]  .salon-profile-empty-title {
    color: var(--salon-details-text-primary);
    font-weight: 950;
}

.salon-details-page[b-cy0nhsszp0]  .salon-profile-empty-text {
    color: var(--salon-details-text-secondary);
    line-height: 1.55;
    font-weight: 560;
}

.salon-professional-grid[b-cy0nhsszp0] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
}

.salon-professional-card[b-cy0nhsszp0] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.85rem;
    padding: 1rem;
    border-radius: 24px;
    background: radial-gradient(circle at 92% 12%, color-mix(in srgb, var(--salon-details-secondary) 8%, transparent), transparent 32%), color-mix(in srgb, var(--salon-details-surface) 96%, transparent);
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 9%, var(--salon-details-divider));
    box-shadow: 0 12px 30px color-mix(in srgb, var(--salon-details-text-primary) 5%, transparent);
}

.salon-professional-avatar[b-cy0nhsszp0] {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    color: #ffffff;
    font-size: 0.96rem;
    font-weight: 950;
    letter-spacing: -0.04em;
    border-radius: 20px;
    background: linear-gradient(135deg, var(--salon-details-secondary), var(--salon-details-primary));
    box-shadow: 0 14px 30px color-mix(in srgb, var(--salon-details-secondary) 18%, transparent);
}

.salon-professional-copy[b-cy0nhsszp0] {
    min-width: 0;
    display: grid;
    gap: 0.18rem;
}

    .salon-professional-copy strong[b-cy0nhsszp0] {
        color: var(--salon-details-text-primary);
        font-size: 1rem;
        font-weight: 950;
        line-height: 1.16;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .salon-professional-copy small[b-cy0nhsszp0] {
        color: var(--salon-details-secondary);
        font-size: 0.78rem;
        font-weight: 850;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .salon-professional-copy p[b-cy0nhsszp0] {
        margin: 0.35rem 0 0;
        color: var(--salon-details-text-secondary);
        font-size: 0.84rem;
        line-height: 1.45;
        font-weight: 560;
    }

.salon-details-page[b-cy0nhsszp0]  .booking-side-column {
    position: sticky;
    top: 96px;
}

.salon-location-icon[b-cy0nhsszp0] {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border-radius: 18px;
    background: color-mix(in srgb, var(--salon-details-primary) 9%, var(--salon-details-surface));
    box-shadow: 0 12px 24px color-mix(in srgb, var(--salon-details-primary) 10%, transparent);
}

.salon-details-page[b-cy0nhsszp0]  .salon-location-icon .mud-icon-root {
    color: var(--salon-details-primary);
    font-size: 1.32rem;
}

.salon-location-card[b-cy0nhsszp0] {
    display: grid;
    gap: 0.28rem;
    padding: 0.95rem;
    border-radius: 22px;
    background: color-mix(in srgb, var(--salon-details-primary) 6%, var(--salon-details-surface));
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 9%, var(--salon-details-divider));
}

    .salon-location-card strong[b-cy0nhsszp0] {
        color: var(--salon-details-text-primary);
        font-size: 0.96rem;
        font-weight: 950;
        line-height: 1.35;
    }

    .salon-location-card span[b-cy0nhsszp0] {
        color: var(--salon-details-text-secondary);
        font-size: 0.86rem;
        font-weight: 700;
    }

html[b-cy0nhsszp0] {
    scroll-behavior: smooth;
}

@media (max-width: 1100px) {
    .salon-details-page[b-cy0nhsszp0]  .booking-side-column {
        position: static;
    }
}

@media (max-width: 960px) {
    .salon-details-page[b-cy0nhsszp0]  .salon-profile-hero {
        padding: 2rem;
        border-radius: 30px;
    }

    .salon-profile-preview-card[b-cy0nhsszp0] {
        min-height: 420px;
    }

    .salon-details-page[b-cy0nhsszp0]  .salon-section-header {
        flex-direction: column;
        align-items: flex-start !important;
    }

    .salon-details-page[b-cy0nhsszp0]  .salon-profile-title {
        font-size: clamp(2rem, 7vw, 2.7rem);
    }
}

@media (max-width: 760px) {
    .salon-media-grid[b-cy0nhsszp0] {
        grid-template-columns: 1fr;
    }

    .salon-media-card-primary[b-cy0nhsszp0] {
        grid-column: auto;
        min-height: 220px;
    }

        .salon-media-card-primary img[b-cy0nhsszp0] {
            min-height: 220px;
        }

    .salon-details-page[b-cy0nhsszp0]  .salon-service-card {
        grid-template-columns: auto minmax(0, 1fr);
        padding: 1.2rem;
    }

    .salon-service-card-side[b-cy0nhsszp0] {
        grid-column: 1 / -1;
        min-width: 0;
        justify-items: start;
        padding-left: 0;
        padding-top: 0.85rem;
    }

        .salon-service-card-side strong[b-cy0nhsszp0] {
            text-align: left;
        }

    .salon-professional-grid[b-cy0nhsszp0] {
        grid-template-columns: 1fr;
    }

    .salon-profile-preview-stats[b-cy0nhsszp0] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .salon-details-page[b-cy0nhsszp0] {
        padding-bottom: 2.5rem;
    }

        .salon-details-page[b-cy0nhsszp0]  .salon-profile-hero,
        .salon-details-page[b-cy0nhsszp0]  .salon-profile-panel,
        .salon-details-page[b-cy0nhsszp0]  .salon-details-loading-panel {
            padding: 1rem;
            border-radius: 24px;
        }

        .salon-details-page[b-cy0nhsszp0]  .salon-profile-title {
            font-size: 2.02rem;
            line-height: 1.08;
            letter-spacing: -0.04em;
        }

        .salon-details-page[b-cy0nhsszp0]  .salon-profile-description {
            font-size: 0.98rem;
        }

    .salon-profile-actions[b-cy0nhsszp0] {
        display: grid;
    }

    .salon-details-page[b-cy0nhsszp0]  .salon-profile-actions .mud-button-root {
        width: 100%;
    }

    .salon-profile-trust-row[b-cy0nhsszp0] {
        display: grid;
    }

    .salon-profile-preview-card[b-cy0nhsszp0] {
        min-height: 0;
        padding: 1rem;
        border-radius: 24px;
    }

    .salon-profile-preview-card-with-image[b-cy0nhsszp0] {
        min-height: 360px;
    }

    .salon-media-card[b-cy0nhsszp0],
    .salon-media-card img[b-cy0nhsszp0],
    .salon-media-card-primary[b-cy0nhsszp0],
    .salon-media-card-primary img[b-cy0nhsszp0] {
        min-height: 190px;
    }

    .salon-details-page[b-cy0nhsszp0]  .salon-service-card {
        grid-template-columns: 1fr;
        padding: 1rem;
        border-radius: 24px;
    }

    .salon-service-card-side[b-cy0nhsszp0] {
        grid-column: auto;
    }

    .salon-service-logo-mark[b-cy0nhsszp0],
    .salon-profile-empty-icon[b-cy0nhsszp0],
    .salon-professional-avatar[b-cy0nhsszp0] {
        width: 52px;
        height: 52px;
        border-radius: 17px;
    }

        .salon-service-logo-mark img[b-cy0nhsszp0] {
            width: 52px;
            max-width: 52px;
            height: 52px;
            border-radius: 17px;
        }

    .salon-service-card-copy[b-cy0nhsszp0] {
        padding-left: 0;
    }

    .salon-profile-empty-block[b-cy0nhsszp0],
    .salon-professional-card[b-cy0nhsszp0] {
        grid-template-columns: 1fr;
    }
}


/* BB-MEDIA-03 public service portfolio image presentation */
.salon-details-page[b-cy0nhsszp0]  .salon-service-media {
    position: relative;
    z-index: 2;
    width: 124px;
    height: 108px;
    overflow: hidden;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 24px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--salon-details-primary) 9%, var(--salon-details-surface)), color-mix(in srgb, var(--salon-details-secondary) 8%, var(--salon-details-surface)));
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 12%, var(--salon-details-divider));
    box-shadow: 0 18px 38px color-mix(in srgb, var(--salon-details-primary) 14%, transparent), 0 6px 18px color-mix(in srgb, var(--salon-details-secondary) 9%, transparent);
    transition: transform 170ms ease, box-shadow 170ms ease;
}

    .salon-details-page[b-cy0nhsszp0]  .salon-service-media img {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
    }

.salon-details-page[b-cy0nhsszp0]  .salon-service-media-empty {
    width: 64px;
    height: 64px;
    background: transparent;
    border: 0;
}

    .salon-details-page[b-cy0nhsszp0]  .salon-service-media-empty img {
        width: 64px;
        max-width: 64px;
        height: 64px;
        object-fit: contain;
        border-radius: 21px;
    }

.salon-details-page[b-cy0nhsszp0]  .salon-service-media-with-image img {
    transform: scale(1.01);
    filter: saturate(1.04) contrast(1.02);
    transition: transform 180ms ease, filter 180ms ease;
}

.salon-details-page[b-cy0nhsszp0]  .salon-service-card:hover .salon-service-media,
.salon-details-page[b-cy0nhsszp0]  .salon-service-card:focus-visible .salon-service-media {
    transform: translateY(-2px) scale(1.025);
    box-shadow: 0 24px 52px color-mix(in srgb, var(--salon-details-primary) 18%, transparent), 0 8px 24px color-mix(in srgb, var(--salon-details-secondary) 12%, transparent);
}

.salon-details-page[b-cy0nhsszp0]  .salon-service-card:hover .salon-service-media-with-image img,
.salon-details-page[b-cy0nhsszp0]  .salon-service-card:focus-visible .salon-service-media-with-image img {
    transform: scale(1.06);
    filter: brightness(1.05) saturate(1.08);
}

.salon-service-media-shade[b-cy0nhsszp0] {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.04), rgba(15, 23, 42, 0.56));
    pointer-events: none;
}

.salon-service-media-count[b-cy0nhsszp0] {
    position: absolute;
    left: 0.62rem;
    right: 0.62rem;
    bottom: 0.58rem;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.28rem;
    padding: 0.36rem 0.48rem;
    color: #ffffff;
    font-size: 0.7rem;
    font-weight: 950;
    line-height: 1;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.56);
    border: 1px solid rgba(255,255,255,0.18);
    backdrop-filter: blur(12px);
}

.salon-details-page[b-cy0nhsszp0]  .salon-service-media-count .mud-icon-root {
    color: var(--salon-details-secondary);
    font-size: 0.9rem;
}

.salon-service-mini-gallery[b-cy0nhsszp0] {
    display: flex;
    align-items: center;
    gap: 0.38rem;
    padding-top: 0.1rem;
}

    .salon-service-mini-gallery img[b-cy0nhsszp0] {
        width: 44px;
        height: 34px;
        display: block;
        object-fit: cover;
        border-radius: 10px;
        border: 1px solid color-mix(in srgb, var(--salon-details-primary) 12%, var(--salon-details-divider));
        box-shadow: 0 8px 16px color-mix(in srgb, var(--salon-details-text-primary) 5%, transparent);
    }

@media (max-width: 760px) {
    .salon-details-page[b-cy0nhsszp0]  .salon-service-media {
        width: 96px;
        height: 86px;
    }

    .salon-details-page[b-cy0nhsszp0]  .salon-service-media-empty {
        width: 52px;
        height: 52px;
    }

        .salon-details-page[b-cy0nhsszp0]  .salon-service-media-empty img {
            width: 52px;
            max-width: 52px;
            height: 52px;
            border-radius: 17px;
        }

    .salon-service-media-count[b-cy0nhsszp0] {
        left: 0.46rem;
        right: 0.46rem;
        bottom: 0.44rem;
        font-size: 0.64rem;
        padding: 0.3rem 0.38rem;
    }
}

@media (max-width: 600px) {
    .salon-details-page[b-cy0nhsszp0]  .salon-service-media {
        width: 100%;
        height: 170px;
        border-radius: 22px;
    }

    .salon-details-page[b-cy0nhsszp0]  .salon-service-media-empty {
        width: 52px;
        height: 52px;
    }

    .salon-service-mini-gallery img[b-cy0nhsszp0] {
        width: 40px;
        height: 32px;
    }
}


/* BB-BOOKING-UX-01 service pagination polish */
.salon-service-pagination[b-cy0nhsszp0] {
    display: grid;
    gap: 0.95rem;
    padding: 1rem;
    border-radius: 26px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--salon-details-primary) 5%, var(--salon-details-surface)), color-mix(in srgb, var(--salon-details-secondary) 5%, var(--salon-details-surface)));
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 12%, var(--salon-details-divider));
    box-shadow: 0 14px 34px color-mix(in srgb, var(--salon-details-text-primary) 5%, transparent);
}

.salon-service-pagination-summary[b-cy0nhsszp0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    min-width: 0;
}

    .salon-service-pagination-summary span[b-cy0nhsszp0] {
        color: var(--salon-details-text-secondary);
        font-size: 0.82rem;
        font-weight: 760;
        line-height: 1.35;
    }

    .salon-service-pagination-summary strong[b-cy0nhsszp0] {
        color: var(--salon-details-text-primary);
        font-size: 0.82rem;
        font-weight: 950;
        line-height: 1.2;
        white-space: nowrap;
    }

.salon-service-pagination-actions[b-cy0nhsszp0] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.72rem;
    align-items: center;
}

.salon-service-pagination-pages[b-cy0nhsszp0] {
    min-width: 0;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.46rem;
}

.salon-service-pagination-button[b-cy0nhsszp0],
.salon-service-page-button[b-cy0nhsszp0] {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.34rem;
    color: var(--salon-details-primary);
    font-family: inherit;
    font-size: 0.78rem;
    font-weight: 950;
    line-height: 1;
    border-radius: 999px;
    background: color-mix(in srgb, var(--salon-details-surface) 94%, transparent);
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 14%, var(--salon-details-divider));
    box-shadow: 0 8px 18px color-mix(in srgb, var(--salon-details-text-primary) 4%, transparent);
    cursor: pointer;
    transition: transform 160ms ease, border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.salon-service-pagination-button[b-cy0nhsszp0] {
    padding: 0 0.88rem;
}

.salon-service-page-button[b-cy0nhsszp0] {
    width: 40px;
    padding: 0;
}

    .salon-service-pagination-button:hover:not(:disabled)[b-cy0nhsszp0],
    .salon-service-pagination-button:focus-visible:not(:disabled)[b-cy0nhsszp0],
    .salon-service-page-button:hover[b-cy0nhsszp0],
    .salon-service-page-button:focus-visible[b-cy0nhsszp0] {
        transform: translateY(-1px);
        border-color: color-mix(in srgb, var(--salon-details-primary) 30%, var(--salon-details-divider));
        background: color-mix(in srgb, var(--salon-details-primary) 8%, var(--salon-details-surface));
        box-shadow: 0 14px 28px color-mix(in srgb, var(--salon-details-primary) 8%, transparent);
        outline: none;
    }

.salon-service-page-button-active[b-cy0nhsszp0] {
    color: #ffffff;
    background: linear-gradient(135deg, var(--salon-details-primary), color-mix(in srgb, var(--salon-details-primary) 82%, var(--salon-details-secondary)));
    border-color: color-mix(in srgb, var(--salon-details-primary) 58%, var(--salon-details-secondary));
    box-shadow: 0 16px 34px color-mix(in srgb, var(--salon-details-primary) 16%, transparent);
}

.salon-service-pagination-button:disabled[b-cy0nhsszp0] {
    cursor: not-allowed;
    opacity: 0.48;
    transform: none;
    box-shadow: none;
}

.salon-details-page[b-cy0nhsszp0]  .salon-service-pagination-button .mud-icon-root {
    color: inherit;
    font-size: 1.05rem;
}

@media (max-width: 760px) {
    .salon-service-pagination-actions[b-cy0nhsszp0] {
        grid-template-columns: 1fr;
    }

    .salon-service-pagination-button[b-cy0nhsszp0] {
        width: 100%;
    }

    .salon-service-pagination-summary[b-cy0nhsszp0] {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* BB-PUBLIC-PROFILE-UX-01 fullscreen image affordance */
.salon-image-expand-button[b-cy0nhsszp0] {
    position: absolute;
    right: 0.72rem;
    bottom: 0.72rem;
    z-index: 4;
    width: 38px;
    height: 38px;
    display: inline-grid;
    place-items: center;
    color: #ffffff;
    background: rgba(15, 23, 42, 0.66);
    border: 1px solid rgba(255,255,255,0.22);
    border-radius: 12px;
    box-shadow: 0 12px 26px rgba(15, 23, 42, 0.24);
    backdrop-filter: blur(14px);
    cursor: pointer;
    transition: transform 150ms ease, background 150ms ease, border-color 150ms ease, box-shadow 150ms ease;
}

    .salon-image-expand-button:hover[b-cy0nhsszp0],
    .salon-image-expand-button:focus-visible[b-cy0nhsszp0] {
        transform: translateY(-1px) scale(1.04);
        background: color-mix(in srgb, var(--salon-details-primary) 82%, rgba(15, 23, 42, 0.74));
        border-color: rgba(255,255,255,0.34);
        box-shadow: 0 16px 34px color-mix(in srgb, var(--salon-details-primary) 22%, transparent);
        outline: none;
    }

.salon-details-page[b-cy0nhsszp0]  .salon-image-expand-button .mud-icon-root {
    color: #ffffff !important;
    font-size: 1rem;
}

.salon-profile-preview-expand-button[b-cy0nhsszp0] {
    right: 1rem;
    bottom: 1rem;
}

.salon-service-media-expand-button[b-cy0nhsszp0] {
    right: 0.5rem;
    bottom: 0.5rem;
    width: 32px;
    height: 32px;
    border-radius: 10px;
}

.salon-service-media-count + .salon-service-media-expand-button[b-cy0nhsszp0] {
    top: 0.5rem;
    bottom: auto;
}

.salon-service-mini-gallery-image-button[b-cy0nhsszp0] {
    position: relative;
    overflow: hidden;
    width: 44px;
    height: 34px;
    padding: 0;
    border: 0;
    border-radius: 10px;
    background: transparent;
    cursor: pointer;
    box-shadow: 0 8px 16px color-mix(in srgb, var(--salon-details-text-primary) 5%, transparent);
}

    .salon-service-mini-gallery-image-button img[b-cy0nhsszp0] {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
        border-radius: inherit;
        border: 1px solid color-mix(in srgb, var(--salon-details-primary) 12%, var(--salon-details-divider));
        transition: transform 150ms ease, filter 150ms ease;
    }

    .salon-service-mini-gallery-image-button span[b-cy0nhsszp0] {
        position: absolute;
        right: 0.22rem;
        bottom: 0.22rem;
        z-index: 2;
        width: 16px;
        height: 16px;
        display: grid;
        place-items: center;
        color: #ffffff;
        background: rgba(15, 23, 42, 0.68);
        border: 1px solid rgba(255,255,255,0.2);
        border-radius: 6px;
        backdrop-filter: blur(8px);
    }

    .salon-service-mini-gallery-image-button:hover img[b-cy0nhsszp0],
    .salon-service-mini-gallery-image-button:focus-visible img[b-cy0nhsszp0] {
        transform: scale(1.05);
        filter: saturate(1.08);
    }

    .salon-service-mini-gallery-image-button:focus-visible[b-cy0nhsszp0] {
        outline: 2px solid color-mix(in srgb, var(--salon-details-secondary) 70%, #ffffff);
        outline-offset: 2px;
    }

.salon-details-page[b-cy0nhsszp0]  .salon-service-mini-gallery-image-button .mud-icon-root {
    color: #ffffff !important;
    font-size: 0.68rem;
}

.salon-service-mini-gallery img[b-cy0nhsszp0] {
    box-shadow: none;
}

@media (max-width: 600px) {
    .salon-image-expand-button[b-cy0nhsszp0] {
        width: 36px;
        height: 36px;
        right: 0.6rem;
        bottom: 0.6rem;
    }

    .salon-service-mini-gallery-image-button[b-cy0nhsszp0] {
        width: 40px;
        height: 32px;
    }
}


/* BB-PUBLIC-PROFILE-UX-01 v02 make fullscreen affordance visible */
.salon-image-expand-button[b-cy0nhsszp0] {
    width: auto !important;
    min-width: 38px !important;
    height: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.34rem !important;
    padding: 0 0.62rem !important;
}

    .salon-image-expand-button span[b-cy0nhsszp0] {
        color: #ffffff;
        font-size: 0.68rem;
        font-weight: 950;
        line-height: 1;
        letter-spacing: 0.035em;
        text-transform: uppercase;
    }

.salon-service-media-expand-button[b-cy0nhsszp0] {
    width: auto !important;
    min-width: 32px !important;
    height: 32px !important;
    padding: 0 0.48rem !important;
    border-radius: 10px !important;
}

    .salon-service-media-expand-button span[b-cy0nhsszp0] {
        font-size: 0.6rem;
    }

.salon-details-lightbox-hint[b-cy0nhsszp0] {
    width: fit-content;
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    gap: 0.42rem;
    margin-top: 0.25rem;
    padding: 0.44rem 0.64rem;
    color: var(--salon-details-text-primary);
    font-size: 0.76rem;
    font-weight: 850;
    line-height: 1.25;
    border-radius: 999px;
    background: color-mix(in srgb, var(--salon-details-primary) 7%, var(--salon-details-surface));
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 12%, var(--salon-details-divider));
}

    .salon-details-lightbox-hint .mud-icon-root[b-cy0nhsszp0] {
        color: var(--salon-details-secondary);
    }

@media (max-width: 600px) {
    .salon-image-expand-button span[b-cy0nhsszp0] {
        display: none;
    }

    .salon-image-expand-button[b-cy0nhsszp0] {
        width: 36px !important;
        min-width: 36px !important;
        padding: 0 !important;
    }
}


/* BB-SALON-ADDRESS-VERIFY-01 public map action polish */
.salon-details-page[b-cy0nhsszp0]  .location-panel .mud-button-filled-primary {
    min-height: 46px;
    border-radius: 12px;
    font-weight: 950;
}

/* BB-PUBLIC-SALON-LOCATION-01 verified public location card */
.salon-location-card[b-cy0nhsszp0] {
    position: relative;
    overflow: hidden;
    display: grid;
    gap: 0.85rem;
    padding: 1rem;
    border-radius: 24px;
    background: radial-gradient(circle at 92% 12%, color-mix(in srgb, var(--salon-details-secondary) 8%, transparent), transparent 32%), color-mix(in srgb, var(--salon-details-primary) 6%, var(--salon-details-surface));
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 9%, var(--salon-details-divider));
    box-shadow: 0 12px 30px color-mix(in srgb, var(--salon-details-text-primary) 5%, transparent);
}

    .salon-location-card[b-cy0nhsszp0]::before {
        content: "";
        position: absolute;
        inset: 0 auto 0 0;
        width: 4px;
        background: linear-gradient(180deg, var(--salon-details-primary), var(--salon-details-secondary));
        pointer-events: none;
    }

.salon-location-card-verified[b-cy0nhsszp0] {
    background: radial-gradient(circle at 92% 12%, color-mix(in srgb, var(--salon-details-success) 10%, transparent), transparent 32%), radial-gradient(circle at 8% 92%, color-mix(in srgb, var(--salon-details-secondary) 8%, transparent), transparent 30%), color-mix(in srgb, var(--salon-details-surface) 96%, transparent);
    border-color: color-mix(in srgb, var(--salon-details-success) 18%, var(--salon-details-divider));
}

    .salon-location-card-verified[b-cy0nhsszp0]::before {
        background: linear-gradient(180deg, var(--salon-details-success), var(--salon-details-secondary));
    }

.salon-location-card-header[b-cy0nhsszp0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
    min-width: 0;
}

.salon-location-status-pill[b-cy0nhsszp0] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 0.36rem;
    padding: 0.4rem 0.66rem;
    color: var(--salon-details-primary);
    font-size: 0.68rem;
    font-weight: 950;
    line-height: 1;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    border-radius: 999px;
    background: color-mix(in srgb, var(--salon-details-primary) 8%, var(--salon-details-surface));
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 10%, var(--salon-details-divider));
}

.salon-location-status-pill-verified[b-cy0nhsszp0] {
    color: var(--salon-details-success);
    background: color-mix(in srgb, var(--salon-details-success) 10%, var(--salon-details-surface));
    border-color: color-mix(in srgb, var(--salon-details-success) 15%, var(--salon-details-divider));
}

.salon-details-page[b-cy0nhsszp0]  .salon-location-status-pill .mud-icon-root {
    color: currentColor;
    font-size: 0.94rem;
}

.salon-location-address-block[b-cy0nhsszp0] {
    display: grid;
    gap: 0.22rem;
    min-width: 0;
}

    .salon-location-address-block strong[b-cy0nhsszp0] {
        color: var(--salon-details-text-primary);
        font-size: 1.02rem;
        font-weight: 950;
        line-height: 1.28;
        overflow-wrap: anywhere;
    }

    .salon-location-address-block span[b-cy0nhsszp0],
    .salon-location-address-block small[b-cy0nhsszp0] {
        color: var(--salon-details-text-secondary);
        font-size: 0.88rem;
        font-weight: 720;
        line-height: 1.36;
        overflow-wrap: anywhere;
    }

    .salon-location-address-block small[b-cy0nhsszp0] {
        color: color-mix(in srgb, var(--salon-details-secondary) 78%, var(--salon-details-text-secondary));
        font-size: 0.78rem;
        font-weight: 850;
    }

.salon-location-map-note[b-cy0nhsszp0] {
    display: flex;
    align-items: flex-start;
    gap: 0.45rem;
    padding: 0.65rem 0.72rem;
    color: var(--salon-details-text-primary);
    font-size: 0.78rem;
    font-weight: 760;
    line-height: 1.35;
    border-radius: 16px;
    background: color-mix(in srgb, var(--salon-details-surface) 72%, transparent);
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 8%, var(--salon-details-divider));
}

.salon-details-page[b-cy0nhsszp0]  .salon-location-map-note .mud-icon-root {
    flex: 0 0 auto;
    color: var(--salon-details-secondary);
    margin-top: 0.05rem;
}

@media (max-width: 600px) {
    .salon-location-card[b-cy0nhsszp0] {
        padding: 0.9rem;
        border-radius: 20px;
    }

    .salon-location-status-pill[b-cy0nhsszp0] {
        max-width: 100%;
        white-space: normal;
        line-height: 1.2;
    }
}

/* BB-PUBLIC-SALON-MAP-DISTANCE-01 salon map preview + distance guard */
.salon-location-map-shell[b-cy0nhsszp0] {
    position: relative;
    overflow: hidden;
    min-height: 245px;
    border-radius: 22px;
    background: radial-gradient(circle at 88% 14%, color-mix(in srgb, var(--salon-details-secondary) 12%, transparent), transparent 32%), color-mix(in srgb, var(--salon-details-primary) 5%, var(--salon-details-surface));
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 10%, var(--salon-details-divider));
    box-shadow: inset 0 1px 0 color-mix(in srgb, white 38%, transparent), 0 12px 28px color-mix(in srgb, var(--salon-details-primary) 7%, transparent);
}

.salon-location-map-preview[b-cy0nhsszp0] {
    position: relative;
    width: 100%;
    min-height: 245px;
    height: 245px;
    overflow: hidden;
    border-radius: inherit;
    isolation: isolate;
}

.salon-location-map-placeholder[b-cy0nhsszp0],
.salon-location-map-unavailable[b-cy0nhsszp0] {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    gap: 0.5rem;
    padding: 1rem;
    color: var(--salon-details-text-secondary);
    font-size: 0.82rem;
    font-weight: 800;
    text-align: center;
    background: radial-gradient(circle at 50% 30%, color-mix(in srgb, var(--salon-details-secondary) 10%, transparent), transparent 34%), color-mix(in srgb, var(--salon-details-surface) 92%, transparent);
}

.salon-location-map-unavailable[b-cy0nhsszp0] {
    color: var(--salon-details-text-primary);
}

.salon-location-distance-note[b-cy0nhsszp0] {
    display: flex;
    align-items: flex-start;
    gap: 0.45rem;
    padding: 0.65rem 0.72rem;
    color: var(--salon-details-text-primary);
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1.35;
    border-radius: 16px;
    background: color-mix(in srgb, var(--salon-details-success) 8%, var(--salon-details-surface));
    border: 1px solid color-mix(in srgb, var(--salon-details-success) 16%, var(--salon-details-divider));
}

.salon-location-distance-note-warning[b-cy0nhsszp0] {
    background: color-mix(in srgb, var(--salon-details-warning) 9%, var(--salon-details-surface));
    border-color: color-mix(in srgb, var(--salon-details-warning) 18%, var(--salon-details-divider));
}

.salon-details-page[b-cy0nhsszp0]  .salon-location-distance-note .mud-icon-root {
    flex: 0 0 auto;
    color: var(--salon-details-success);
    margin-top: 0.05rem;
}

.salon-details-page[b-cy0nhsszp0]  .salon-location-distance-note-warning .mud-icon-root {
    color: var(--salon-details-warning);
}

.salon-details-page[b-cy0nhsszp0]  .salon-location-map-alert {
    border-radius: 16px;
}

.salon-details-page[b-cy0nhsszp0]  .location-panel .mud-button-outlined-secondary {
    min-height: 44px;
    border-radius: 12px;
    font-weight: 950;
}

.salon-details-page[b-cy0nhsszp0]  .salon-location-map-preview .leaflet-container,
.salon-location-map-preview.leaflet-container[b-cy0nhsszp0] {
    width: 100%;
    height: 100%;
    font-family: inherit;
    background: color-mix(in srgb, var(--salon-details-primary) 5%, var(--salon-details-surface));
}

.salon-details-page[b-cy0nhsszp0]  .salon-location-map-preview .leaflet-control-zoom a {
    color: var(--salon-details-primary);
    font-weight: 950;
}

@media (max-width: 600px) {
    .salon-location-map-shell[b-cy0nhsszp0],
    .salon-location-map-preview[b-cy0nhsszp0] {
        min-height: 190px;
        height: 190px;
        border-radius: 18px;
    }
}


/* BB-PUBLIC-SALON-MAP-DISTANCE-01A v2 map readability polish */
.salon-details-page[b-cy0nhsszp0]  .location-panel .mud-button-root {
    min-height: 44px;
    border-radius: 12px !important;
    font-family: inherit;
    font-weight: 950;
    letter-spacing: 0.025em;
}

.salon-details-page[b-cy0nhsszp0]  .location-panel .mud-button-filled-primary .mud-button-label,
.salon-details-page[b-cy0nhsszp0]  .location-panel .mud-button-filled-primary .mud-icon-root {
    color: #ffffff !important;
}

.salon-details-page[b-cy0nhsszp0]  .salon-location-map-preview .leaflet-popup-content-wrapper,
.salon-details-page[b-cy0nhsszp0]  .salon-location-map-preview .leaflet-popup-content,
.salon-details-page[b-cy0nhsszp0]  .salon-location-map-preview .leaflet-popup-content * {
    font-family: inherit !important;
}

@media (max-width: 600px) {
    .salon-location-map-shell[b-cy0nhsszp0],
    .salon-location-map-preview[b-cy0nhsszp0] {
        min-height: 220px;
        height: 220px;
    }
}

/* BB-PUBLIC-SALON-MAP-DISTANCE-01A final embedded map expand button */
.salon-location-map-expand-button[b-cy0nhsszp0] {
    position: absolute;
    right: 0.72rem;
    bottom: 0.72rem;
    z-index: 500;
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    padding: 0 0.72rem;
    color: #ffffff;
    font-family: inherit;
    font-size: 0.68rem;
    font-weight: 950;
    line-height: 1;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 22%, transparent);
    border-radius: 999px;
    background: linear-gradient(135deg, var(--salon-details-primary), color-mix(in srgb, var(--salon-details-primary) 72%, var(--salon-details-secondary)));
    box-shadow: 0 14px 28px color-mix(in srgb, var(--salon-details-primary) 22%, transparent);
    cursor: pointer;
    transition: transform 150ms ease, box-shadow 150ms ease, filter 150ms ease;
}

    .salon-location-map-expand-button:hover[b-cy0nhsszp0],
    .salon-location-map-expand-button:focus-visible[b-cy0nhsszp0] {
        transform: translateY(-1px);
        box-shadow: 0 18px 34px color-mix(in srgb, var(--salon-details-primary) 28%, transparent);
        filter: saturate(1.05);
        outline: none;
    }

.salon-details-page[b-cy0nhsszp0]  .salon-location-map-expand-button .mud-icon-root {
    color: #ffffff !important;
    font-size: 1rem;
}

@media (max-width: 600px) {
    .salon-location-map-expand-button[b-cy0nhsszp0] {
        right: 0.56rem;
        bottom: 0.56rem;
        min-height: 34px;
        padding-inline: 0.62rem;
    }
}


/* BB-FOUNDING-50-01 */
.salon-details-page[b-cy0nhsszp0]  .salon-profile-founding-chip {
    color: #fffaf0 !important;
    font-weight: 950;
    background: linear-gradient(135deg, #7a5d27, #c7a15a 58%, #8b6b2f) !important;
    border: 1px solid rgba(255,255,255,0.28) !important;
    box-shadow: 0 12px 26px rgba(82, 62, 24, 0.28);
}

.salon-profile-preview-founding[b-cy0nhsszp0] {
    color: #fffaf0 !important;
    background: linear-gradient(135deg, rgba(122,93,39,.96), rgba(199,161,90,.96)) !important;
}

/* BB-OWNER-READY-EMPLOYEE-01 professional profile photos */
.salon-professional-avatar-with-image[b-cy0nhsszp0] {
    overflow: hidden;
    padding: 0;
    border: 2px solid color-mix(in srgb, var(--salon-details-surface) 86%, transparent);
    background: color-mix(in srgb, var(--salon-details-primary) 8%, var(--salon-details-surface));
}

    .salon-professional-avatar-with-image img[b-cy0nhsszp0] {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
    }

/* BB-LOCALIZATION-HOTFIX-01
 * Keep the translated preview action clear of the preview message. */
.salon-profile-preview-note[b-cy0nhsszp0] {
    min-height: 58px;
    padding-right: 8.75rem;
}

.salon-profile-preview-expand-button[b-cy0nhsszp0] {
    max-width: calc(100% - 2rem);
    white-space: nowrap;
}

@media (max-width: 600px) {
    .salon-profile-preview-note[b-cy0nhsszp0] {
        min-height: 56px;
        padding-right: 4.2rem;
    }
}

/* BB-CUSTOMER-FAVORITES-01 */
.salon-details-page[b-cy0nhsszp0]  .salon-favorite-action-button {
    min-width: 150px;
}

    .salon-details-page[b-cy0nhsszp0]  .salon-favorite-action-button.mud-button-filled-error {
        color: #ffffff;
        box-shadow: 0 14px 30px color-mix(in srgb, var(--mud-palette-error) 20%, transparent);
    }

        .salon-details-page[b-cy0nhsszp0]  .salon-favorite-action-button.mud-button-filled-error .mud-icon-root,
        .salon-details-page[b-cy0nhsszp0]  .salon-favorite-action-button.mud-button-filled-error .mud-button-label {
            color: #ffffff !important;
        }

@media (max-width: 600px) {
    .salon-details-page[b-cy0nhsszp0]  .salon-favorite-action-button {
        width: 100%;
    }
}
/* /Components/Pages/SalonMapDialog.razor.rz.scp.css */
.salon-map-dialog-shell[b-pnt1hfhoal] {
    position: relative;
    overflow: hidden;
    width: min(96vw, 1180px);
    max-width: 100%;
    height: min(78vh, 700px);
    min-height: 440px;
    border-radius: 30px;
    background: radial-gradient(circle at 12% 10%, color-mix(in srgb, var(--mud-palette-primary) 16%, transparent), transparent 30%), radial-gradient(circle at 92% 18%, color-mix(in srgb, var(--mud-palette-secondary) 18%, transparent), transparent 32%), color-mix(in srgb, var(--mud-palette-primary) 5%, var(--mud-palette-surface));
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 12%, var(--mud-palette-divider));
    box-shadow: inset 0 1px 0 color-mix(in srgb, white 40%, transparent), 0 24px 58px color-mix(in srgb, var(--mud-palette-primary) 13%, transparent);
    isolation: isolate;
}

    .salon-map-dialog-shell[b-pnt1hfhoal]::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 2;
        pointer-events: none;
        background: linear-gradient(180deg, color-mix(in srgb, var(--mud-palette-surface) 20%, transparent), transparent 28%, transparent 72%, color-mix(in srgb, var(--mud-palette-surface) 18%, transparent));
    }

.salon-map-dialog-canvas[b-pnt1hfhoal] {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
    min-height: inherit;
    overflow: hidden;
    border-radius: inherit;
    isolation: isolate;
}

    .salon-map-dialog-placeholder[b-pnt1hfhoal],
    .salon-map-dialog-canvas .salon-location-map-placeholder[b-pnt1hfhoal],
    .salon-map-dialog-canvas .salon-location-map-unavailable[b-pnt1hfhoal] {
        position: absolute;
        inset: 0;
        display: grid;
        place-items: center;
        align-content: center;
        gap: 0.65rem;
        padding: 1rem;
        color: var(--mud-palette-text-secondary);
        font-size: 0.9rem;
        font-weight: 850;
        text-align: center;
        background: radial-gradient(circle at 50% 30%, color-mix(in srgb, var(--mud-palette-secondary) 10%, transparent), transparent 34%), color-mix(in srgb, var(--mud-palette-surface) 92%, transparent);
    }

    .salon-map-dialog-canvas.leaflet-container[b-pnt1hfhoal],
    .salon-map-dialog-canvas .leaflet-container[b-pnt1hfhoal] {
        width: 100%;
        height: 100%;
        font-family: inherit;
        background: color-mix(in srgb, var(--mud-palette-primary) 5%, var(--mud-palette-surface));
    }

.salon-map-dialog-story-card[b-pnt1hfhoal] {
    position: absolute;
    top: 1rem;
    left: 1rem;
    z-index: 6;
    width: min(380px, calc(100% - 2rem));
    display: grid;
    gap: 0.28rem;
    padding: 0.9rem 1rem;
    pointer-events: none;
    border-radius: 20px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--mud-palette-surface) 94%, transparent), color-mix(in srgb, var(--mud-palette-primary) 6%, var(--mud-palette-surface)));
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 18%, var(--mud-palette-divider));
    box-shadow: 0 20px 48px color-mix(in srgb, var(--mud-palette-primary) 16%, transparent);
    backdrop-filter: blur(16px);
}

.salon-map-dialog-eyebrow[b-pnt1hfhoal] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 0.38rem;
    color: var(--mud-palette-primary);
    font-size: 0.66rem;
    font-weight: 950;
    line-height: 1;
    letter-spacing: 0.075em;
    text-transform: uppercase;
}

.salon-map-dialog-story-card strong[b-pnt1hfhoal] {
    color: var(--mud-palette-text-primary);
    font-size: 1.1rem;
    font-weight: 950;
    line-height: 1.1;
    letter-spacing: -0.025em;
}

.salon-map-dialog-story-card > span:last-child[b-pnt1hfhoal] {
    color: var(--mud-palette-text-secondary);
    font-size: 0.82rem;
    font-weight: 720;
    line-height: 1.38;
}

.salon-map-dialog-chip-rail[b-pnt1hfhoal] {
    position: absolute;
    left: 1rem;
    right: 1rem;
    bottom: 1rem;
    z-index: 6;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    pointer-events: none;
}

    .salon-map-dialog-chip-rail span[b-pnt1hfhoal] {
        display: inline-flex;
        align-items: center;
        gap: 0.38rem;
        padding: 0.52rem 0.72rem;
        color: var(--mud-palette-text-primary);
        font-size: 0.76rem;
        font-weight: 900;
        line-height: 1;
        border-radius: 999px;
        background: linear-gradient(135deg, color-mix(in srgb, var(--mud-palette-surface) 92%, transparent), color-mix(in srgb, var(--mud-palette-secondary) 7%, var(--mud-palette-surface)));
        border: 1px solid color-mix(in srgb, var(--mud-palette-secondary) 18%, var(--mud-palette-divider));
        box-shadow: 0 14px 30px color-mix(in srgb, var(--mud-palette-primary) 11%, transparent);
        backdrop-filter: blur(14px);
    }

.salon-map-dialog-shell[b-pnt1hfhoal]  .salon-map-dialog-chip-rail .mud-icon-root,
.salon-map-dialog-shell[b-pnt1hfhoal]  .salon-map-dialog-eyebrow .mud-icon-root {
    color: var(--mud-palette-primary) !important;
}

@media (max-width: 760px) {
    .salon-map-dialog-story-card[b-pnt1hfhoal] {
        top: 0.75rem;
        left: 0.75rem;
        right: 0.75rem;
        width: auto;
        padding: 0.78rem 0.85rem;
    }

        .salon-map-dialog-story-card strong[b-pnt1hfhoal] {
            font-size: 1rem;
        }

        .salon-map-dialog-story-card > span:last-child[b-pnt1hfhoal] {
            font-size: 0.76rem;
        }

    .salon-map-dialog-chip-rail[b-pnt1hfhoal] {
        left: 0.75rem;
        right: 0.75rem;
        bottom: 0.75rem;
    }

        .salon-map-dialog-chip-rail span[b-pnt1hfhoal] {
            font-size: 0.7rem;
            padding: 0.46rem 0.6rem;
        }
}

@media (max-width: 600px) {
    .salon-map-dialog-shell[b-pnt1hfhoal] {
        width: calc(100vw - 2rem);
        height: 70vh;
        min-height: 380px;
        border-radius: 22px;
    }

    .salon-map-dialog-chip-rail span:nth-child(3)[b-pnt1hfhoal] {
        display: none;
    }
}


/* BB-PUBLIC-SALON-MAP-DISTANCE-02 v10 dialog fit/theme polish */
.salon-map-dialog-shell[b-pnt1hfhoal]  .leaflet-control-zoom {
    color: var(--mud-palette-primary) !important;
}

@media (min-width: 961px) {
    .salon-map-dialog-shell[b-pnt1hfhoal] {
        width: min(96vw, 1180px);
    }
}

/* BB-PUBLIC-SALON-MAP-DISTANCE-02 v11 final dialog fit/overlay polish */
.salon-map-dialog-shell[b-pnt1hfhoal] {
    width: min(calc(100vw - 3rem), 1320px);
    max-width: none;
    height: min(82vh, 760px);
}

.salon-map-dialog-story-card[b-pnt1hfhoal] {
    width: min(420px, calc(100% - 2rem));
    padding-right: 3rem;
}

.salon-map-dialog-story-close[b-pnt1hfhoal] {
    position: absolute;
    top: 0.72rem;
    right: 0.72rem;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    padding: 0;
    color: var(--mud-palette-text-primary);
    cursor: pointer;
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 10%, var(--mud-palette-divider));
    border-radius: 999px;
    background: color-mix(in srgb, var(--mud-palette-surface) 92%, transparent);
    box-shadow: 0 10px 22px color-mix(in srgb, var(--mud-palette-primary) 10%, transparent);
    transition: transform 150ms ease, background 150ms ease, border-color 150ms ease;
}

    .salon-map-dialog-story-close:hover[b-pnt1hfhoal],
    .salon-map-dialog-story-close:focus-visible[b-pnt1hfhoal] {
        transform: translateY(-1px);
        color: var(--mud-palette-primary);
        background: color-mix(in srgb, var(--mud-palette-primary) 8%, var(--mud-palette-surface));
        border-color: color-mix(in srgb, var(--mud-palette-primary) 22%, var(--mud-palette-divider));
        outline: none;
    }

.salon-map-dialog-shell[b-pnt1hfhoal]  .salon-map-dialog-story-close .mud-icon-root {
    color: currentColor !important;
    font-size: 1.05rem;
}

.salon-map-dialog-shell[b-pnt1hfhoal]  .leaflet-top.leaflet-right {
    z-index: 8;
    top: 0.9rem;
    right: 0.9rem;
}

.salon-map-dialog-shell[b-pnt1hfhoal]  .leaflet-control-zoom {
    border-color: color-mix(in srgb, var(--mud-palette-primary) 18%, var(--mud-palette-divider)) !important;
    box-shadow: 0 16px 34px color-mix(in srgb, var(--mud-palette-primary) 16%, transparent) !important;
}

    .salon-map-dialog-shell[b-pnt1hfhoal]  .leaflet-control-zoom a {
        color: var(--mud-palette-primary) !important;
        background: color-mix(in srgb, var(--mud-palette-surface) 96%, transparent) !important;
    }

        .salon-map-dialog-shell[b-pnt1hfhoal]  .leaflet-control-zoom a:hover,
        .salon-map-dialog-shell[b-pnt1hfhoal]  .leaflet-control-zoom a:focus-visible {
            color: var(--mud-palette-secondary) !important;
            background: color-mix(in srgb, var(--mud-palette-primary) 8%, var(--mud-palette-surface)) !important;
        }

@media (max-width: 760px) {
    .salon-map-dialog-shell[b-pnt1hfhoal] {
        width: calc(100vw - 1.25rem);
        height: 78vh;
        min-height: 430px;
    }

    .salon-map-dialog-story-card[b-pnt1hfhoal] {
        width: min(76%, 330px);
        right: auto;
        padding: 0.78rem 2.8rem 0.78rem 0.85rem;
    }

    .salon-map-dialog-chip-rail[b-pnt1hfhoal] {
        right: 0.75rem;
        max-width: calc(100% - 1.5rem);
    }
}

@media (max-width: 520px) {
    .salon-map-dialog-story-card[b-pnt1hfhoal] {
        width: min(72%, 290px);
    }

        .salon-map-dialog-story-card > span:last-child[b-pnt1hfhoal] {
            display: none;
        }

    .salon-map-dialog-chip-rail span:nth-child(2)[b-pnt1hfhoal] {
        display: none;
    }
}


/* BB-PUBLIC-SALON-MAP-DISTANCE-02 v12 remove dialog whitespace and keep map dominant */
.salon-map-dialog-shell[b-pnt1hfhoal] {
    width: calc(100vw - 1.75rem) !important;
    max-width: none !important;
    height: min(84vh, 780px) !important;
    margin-inline: auto;
}

.salon-map-dialog-canvas[b-pnt1hfhoal] {
    width: 100% !important;
    height: 100% !important;
}

.salon-map-dialog-shell[b-pnt1hfhoal]  .leaflet-container {
    width: 100% !important;
    height: 100% !important;
}

.salon-map-dialog-story-card[b-pnt1hfhoal] {
    max-width: min(420px, calc(100% - 2rem));
}

.salon-map-dialog-chip-rail[b-pnt1hfhoal] {
    max-width: calc(100% - 2rem);
}

@media (min-width: 1280px) {
    .salon-map-dialog-shell[b-pnt1hfhoal] {
        width: calc(100vw - 2.25rem) !important;
        height: min(84vh, 800px) !important;
    }
}

@media (max-width: 760px) {
    .salon-map-dialog-shell[b-pnt1hfhoal] {
        width: calc(100vw - 0.75rem) !important;
        height: 80vh !important;
        min-height: 430px;
    }
}
/* /Components/Pages/SalonOnboarding.razor.rz.scp.css */
.salon-onboarding-luxury[b-l2f3zzezq3] {
    --lux-primary: var(--mud-palette-primary);
    --lux-secondary: var(--mud-palette-secondary);
    --lux-surface: var(--mud-palette-surface);
    --lux-background: var(--mud-palette-background);
    --lux-text: var(--mud-palette-text-primary);
    --lux-muted: var(--mud-palette-text-secondary);
    --lux-divider: var(--mud-palette-divider);
    --lux-primary-text: var(--mud-palette-primary-text);
    --lux-secondary-text: var(--mud-palette-secondary-text);
    --lux-success: var(--mud-palette-success);
    --lux-warning: var(--mud-palette-warning);
    --lux-error: var(--mud-palette-error);
    --lux-info: var(--mud-palette-info);
    --lux-line: color-mix(in srgb, var(--lux-primary) 11%, var(--lux-divider));
    --lux-line-strong: color-mix(in srgb, var(--lux-secondary) 28%, var(--lux-divider));
    --lux-soft-primary: color-mix(in srgb, var(--lux-primary) 6%, var(--lux-surface));
    --lux-soft-secondary: color-mix(in srgb, var(--lux-secondary) 9%, var(--lux-surface));
    --lux-shadow: color-mix(in srgb, var(--lux-primary) 12%, transparent);
    padding-bottom: 4rem;
}

    .salon-onboarding-luxury *[b-l2f3zzezq3],
    .salon-onboarding-luxury *[b-l2f3zzezq3]::before,
    .salon-onboarding-luxury *[b-l2f3zzezq3]::after {
        box-sizing: border-box;
    }

    .salon-onboarding-luxury[b-l2f3zzezq3]  .lux-alert {
        border-radius: 16px;
        box-shadow: none;
    }

    .salon-onboarding-luxury[b-l2f3zzezq3]  .lux-status-banner {
        border-radius: 20px;
        border-color: var(--lux-line-strong);
        background: color-mix(in srgb, var(--lux-surface) 92%, transparent);
        box-shadow: 0 14px 38px color-mix(in srgb, var(--lux-primary) 7%, transparent);
    }

.lux-status-banner-copy[b-l2f3zzezq3] {
    display: grid;
    gap: 0.18rem;
}

    .lux-status-banner-copy strong[b-l2f3zzezq3] {
        color: var(--lux-text);
        font-size: 0.78rem;
        font-weight: 950;
        letter-spacing: 0.05em;
        text-transform: uppercase;
    }

    .lux-status-banner-copy span[b-l2f3zzezq3],
    .lux-status-banner-copy small[b-l2f3zzezq3] {
        color: var(--lux-muted);
        font-weight: 650;
        line-height: 1.45;
    }

    .lux-status-banner-copy small[b-l2f3zzezq3] {
        margin-top: 0.3rem;
        padding-top: 0.55rem;
        border-top: 1px solid var(--lux-line);
    }

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-loading-card {
    min-height: 420px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 1rem;
    padding: 2rem;
    text-align: center;
    border: 1px solid var(--lux-line);
    border-radius: 32px;
    background: radial-gradient(circle at 50% 0%, var(--lux-soft-secondary), transparent 40%), var(--lux-surface);
    box-shadow: 0 24px 70px var(--lux-shadow);
}

.lux-loading-mark[b-l2f3zzezq3] {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    color: var(--lux-secondary-text);
    border-radius: 20px;
    background: linear-gradient(135deg, var(--lux-secondary), color-mix(in srgb, var(--lux-secondary) 72%, var(--lux-primary)));
    box-shadow: 0 16px 34px color-mix(in srgb, var(--lux-secondary) 24%, transparent);
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-loading-mark .mud-icon-root {
    color: inherit;
}

.lux-loading-card > div:last-child[b-l2f3zzezq3] {
    display: grid;
    gap: 0.25rem;
}

.lux-loading-card strong[b-l2f3zzezq3] {
    color: var(--lux-text);
    font-size: 1.05rem;
    font-weight: 900;
}

.lux-loading-card span[b-l2f3zzezq3] {
    color: var(--lux-muted);
    font-weight: 600;
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-onboarding-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.65fr);
    gap: clamp(1.25rem, 3vw, 3rem);
    align-items: stretch;
    padding: clamp(1.5rem, 3.2vw, 3.2rem);
    color: var(--lux-primary-text);
    border: 1px solid color-mix(in srgb, var(--lux-secondary) 28%, transparent);
    border-radius: 36px;
    background: radial-gradient(circle at 12% 10%, color-mix(in srgb, var(--lux-secondary) 36%, transparent), transparent 29%), radial-gradient(circle at 90% 14%, color-mix(in srgb, var(--lux-secondary) 22%, transparent), transparent 24%), linear-gradient(135deg, color-mix(in srgb, var(--lux-primary) 92%, var(--lux-text)), var(--lux-primary) 58%, color-mix(in srgb, var(--lux-primary) 78%, var(--lux-secondary)));
    box-shadow: 0 34px 90px color-mix(in srgb, var(--lux-primary) 25%, transparent);
}

    .salon-onboarding-luxury[b-l2f3zzezq3]  .lux-onboarding-hero::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: -1;
        background: linear-gradient(112deg, color-mix(in srgb, var(--lux-primary-text) 13%, transparent), transparent 46%), repeating-linear-gradient(135deg, color-mix(in srgb, var(--lux-primary-text) 4%, transparent) 0 1px, transparent 1px 20px);
        pointer-events: none;
    }

.lux-onboarding-hero-copy[b-l2f3zzezq3] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1.25rem;
    padding-block: 0.75rem;
}

.lux-kicker[b-l2f3zzezq3] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    color: color-mix(in srgb, var(--lux-primary-text) 84%, transparent);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.lux-kicker-icon[b-l2f3zzezq3] {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    color: var(--lux-secondary-text);
    border: 1px solid color-mix(in srgb, var(--lux-primary-text) 22%, transparent);
    border-radius: 13px;
    background: linear-gradient(135deg, var(--lux-secondary), color-mix(in srgb, var(--lux-secondary) 72%, var(--lux-primary)));
    box-shadow: 0 12px 30px color-mix(in srgb, var(--lux-secondary) 24%, transparent);
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-kicker-icon .mud-icon-root {
    color: inherit;
    font-size: 1.1rem;
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-hero-title {
    max-width: 760px;
    margin: 0;
    color: var(--lux-primary-text);
    font-size: clamp(2.45rem, 5vw, 5.25rem);
    font-weight: 950;
    line-height: 0.98;
    letter-spacing: -0.065em;
    text-wrap: balance;
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-hero-subtitle {
    max-width: 720px;
    color: color-mix(in srgb, var(--lux-primary-text) 80%, transparent);
    font-size: clamp(1rem, 1.35vw, 1.18rem);
    font-weight: 600;
    line-height: 1.65;
}

.lux-hero-actions[b-l2f3zzezq3] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
    margin-top: 0.35rem;
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-primary-button,
.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-hero-outline-button,
.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-submit-button,
.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-form-actions .mud-button-root,
.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-stage-footer .mud-button-root {
    min-height: 50px;
    border-radius: 14px;
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-primary-button {
    color: var(--lux-secondary-text);
    background: linear-gradient(135deg, var(--lux-secondary), color-mix(in srgb, var(--lux-secondary) 72%, var(--lux-primary)));
    box-shadow: 0 18px 42px color-mix(in srgb, var(--lux-secondary) 28%, transparent);
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-hero-outline-button {
    color: var(--lux-primary-text);
    border-color: color-mix(in srgb, var(--lux-primary-text) 42%, transparent);
    background: color-mix(in srgb, var(--lux-primary-text) 7%, transparent);
    backdrop-filter: blur(10px);
}

.lux-progress-card[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    align-content: start;
    gap: 1rem;
    padding: 1.25rem;
    color: var(--lux-text);
    border: 1px solid color-mix(in srgb, var(--lux-primary-text) 24%, transparent);
    border-radius: 28px;
    background: color-mix(in srgb, var(--lux-surface) 88%, transparent);
    box-shadow: 0 24px 60px color-mix(in srgb, var(--lux-text) 18%, transparent);
    backdrop-filter: blur(20px);
}

.lux-progress-card-header[b-l2f3zzezq3] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

    .lux-progress-card-header > div:first-child[b-l2f3zzezq3] {
        display: grid;
        gap: 0.3rem;
    }

    .lux-progress-card-header span[b-l2f3zzezq3],
    .lux-progress-next small[b-l2f3zzezq3] {
        color: var(--lux-muted);
        font-size: 0.7rem;
        font-weight: 900;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .lux-progress-card-header strong[b-l2f3zzezq3] {
        color: var(--lux-text);
        font-size: clamp(1.45rem, 2vw, 2rem);
        font-weight: 950;
        letter-spacing: -0.045em;
    }

.lux-progress-seal[b-l2f3zzezq3] {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    color: var(--lux-secondary-text);
    border-radius: 15px;
    background: linear-gradient(135deg, var(--lux-secondary), color-mix(in srgb, var(--lux-secondary) 75%, var(--lux-primary)));
    box-shadow: 0 14px 30px color-mix(in srgb, var(--lux-secondary) 22%, transparent);
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-progress-seal .mud-icon-root {
    color: inherit;
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-progress-bar {
    height: 9px;
}

.lux-progress-next[b-l2f3zzezq3] {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    padding: 0.8rem;
    border: 1px solid var(--lux-line);
    border-radius: 18px;
    background: var(--lux-soft-secondary);
}

.lux-progress-next-icon[b-l2f3zzezq3] {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    color: var(--lux-secondary);
    border-radius: 14px;
    background: var(--lux-surface);
    box-shadow: 0 10px 24px color-mix(in srgb, var(--lux-primary) 9%, transparent);
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-progress-next-icon .mud-icon-root {
    color: inherit;
}

.lux-progress-next > div[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.15rem;
}

.lux-progress-next strong[b-l2f3zzezq3] {
    overflow: hidden;
    color: var(--lux-text);
    font-size: 0.95rem;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lux-progress-metrics[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.55rem;
}

    .lux-progress-metrics div[b-l2f3zzezq3] {
        min-width: 0;
        display: grid;
        gap: 0.18rem;
        padding: 0.72rem;
        border: 1px solid var(--lux-line);
        border-radius: 16px;
        background: color-mix(in srgb, var(--lux-primary) 4%, var(--lux-surface));
    }

    .lux-progress-metrics strong[b-l2f3zzezq3] {
        color: var(--lux-text);
        font-size: 1.05rem;
        font-weight: 950;
    }

    .lux-progress-metrics span[b-l2f3zzezq3] {
        overflow: hidden;
        color: var(--lux-muted);
        font-size: 0.66rem;
        font-weight: 800;
        text-overflow: ellipsis;
        white-space: nowrap;
        text-transform: uppercase;
    }

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-stepper-shell {
    position: sticky;
    top: 0.75rem;
    z-index: 30;
    padding: 0.75rem;
    border: 1px solid var(--lux-line);
    border-radius: 24px;
    background: color-mix(in srgb, var(--lux-surface) 92%, transparent);
    box-shadow: 0 18px 50px color-mix(in srgb, var(--lux-primary) 10%, transparent);
    backdrop-filter: blur(20px);
}

.lux-stepper-mobile-header[b-l2f3zzezq3],
.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-stepper-mobile-progress {
    display: none;
}

.lux-stepper[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 0.55rem;
}

.lux-step[b-l2f3zzezq3] {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.68rem;
    color: var(--lux-text);
    font: inherit;
    text-align: left;
    border: 1px solid transparent;
    border-radius: 17px;
    background: transparent;
    cursor: pointer;
    transition: transform 160ms ease, border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

    .lux-step:hover:not(:disabled)[b-l2f3zzezq3],
    .lux-step:focus-visible:not(:disabled)[b-l2f3zzezq3] {
        transform: translateY(-2px);
        border-color: var(--lux-line-strong);
        background: var(--lux-soft-secondary);
        outline: none;
    }

.lux-step-active[b-l2f3zzezq3] {
    color: var(--lux-secondary-text);
    border-color: color-mix(in srgb, var(--lux-secondary) 60%, transparent);
    background: linear-gradient(135deg, var(--lux-secondary), color-mix(in srgb, var(--lux-secondary) 72%, var(--lux-primary)));
    box-shadow: 0 13px 30px color-mix(in srgb, var(--lux-secondary) 23%, transparent);
}

.lux-step-complete:not(.lux-step-active)[b-l2f3zzezq3] {
    border-color: color-mix(in srgb, var(--lux-success) 22%, var(--lux-divider));
    background: color-mix(in srgb, var(--lux-success) 7%, var(--lux-surface));
}

.lux-step-disabled[b-l2f3zzezq3] {
    cursor: not-allowed;
    opacity: 0.42;
}

.lux-step-icon[b-l2f3zzezq3] {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    color: var(--lux-primary);
    border-radius: 13px;
    background: var(--lux-soft-primary);
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-step-icon .mud-icon-root {
    color: inherit;
    font-size: 1.05rem;
}

.lux-step-active .lux-step-icon[b-l2f3zzezq3] {
    color: var(--lux-secondary-text);
    background: color-mix(in srgb, var(--lux-secondary-text) 15%, transparent);
}

.lux-step-complete:not(.lux-step-active) .lux-step-icon[b-l2f3zzezq3] {
    color: var(--lux-success);
    background: color-mix(in srgb, var(--lux-success) 10%, var(--lux-surface));
}

.lux-step-copy[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.12rem;
}

    .lux-step-copy strong[b-l2f3zzezq3],
    .lux-step-copy small[b-l2f3zzezq3] {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .lux-step-copy strong[b-l2f3zzezq3] {
        color: inherit;
        font-size: 0.78rem;
        font-weight: 900;
    }

    .lux-step-copy small[b-l2f3zzezq3] {
        color: var(--lux-muted);
        font-size: 0.63rem;
        font-weight: 700;
    }

.lux-step-active .lux-step-copy small[b-l2f3zzezq3] {
    color: color-mix(in srgb, var(--lux-secondary-text) 78%, transparent);
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-workspace {
    overflow: hidden;
    border: 1px solid var(--lux-line);
    border-radius: 32px;
    background: var(--lux-surface);
    box-shadow: 0 26px 74px color-mix(in srgb, var(--lux-primary) 11%, transparent);
}

.lux-workspace-header[b-l2f3zzezq3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    padding: clamp(1.2rem, 2.4vw, 2rem);
    border-bottom: 1px solid var(--lux-line);
    background: radial-gradient(circle at 92% 0%, var(--lux-soft-secondary), transparent 34%), linear-gradient(135deg, var(--lux-surface), color-mix(in srgb, var(--lux-primary) 2%, var(--lux-surface)));
}

.lux-workspace-heading[b-l2f3zzezq3] {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.lux-workspace-icon[b-l2f3zzezq3] {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    color: var(--lux-secondary-text);
    border-radius: 18px;
    background: linear-gradient(135deg, var(--lux-secondary), color-mix(in srgb, var(--lux-secondary) 75%, var(--lux-primary)));
    box-shadow: 0 16px 36px color-mix(in srgb, var(--lux-secondary) 22%, transparent);
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-workspace-icon .mud-icon-root {
    color: inherit;
    font-size: 1.35rem;
}

.lux-workspace-heading > div[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.18rem;
}

.lux-workspace-heading small[b-l2f3zzezq3],
.lux-section-heading > div > span[b-l2f3zzezq3],
.lux-submit-copy > small[b-l2f3zzezq3],
.lux-readiness-heading small[b-l2f3zzezq3],
.lux-preview-main > small[b-l2f3zzezq3],
.lux-upload-copy small[b-l2f3zzezq3],
.lux-portfolio-section .lux-section-heading span[b-l2f3zzezq3] {
    color: var(--lux-secondary);
    font-size: 0.68rem;
    font-weight: 950;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.lux-workspace-heading strong[b-l2f3zzezq3] {
    color: var(--lux-text);
    font-size: clamp(1.35rem, 2.2vw, 2rem);
    font-weight: 950;
    line-height: 1.08;
    letter-spacing: -0.04em;
}

.lux-workspace-heading p[b-l2f3zzezq3] {
    max-width: 820px;
    margin: 0;
    color: var(--lux-muted);
    font-size: 0.92rem;
    font-weight: 600;
    line-height: 1.5;
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-status-chip {
    flex: 0 0 auto;
    font-weight: 850;
}

.lux-workspace-body[b-l2f3zzezq3] {
    padding: clamp(1rem, 2.5vw, 2rem);
}

.lux-stage-card[b-l2f3zzezq3] {
    display: grid;
    gap: 1.25rem;
}

.lux-section-heading[b-l2f3zzezq3] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--lux-line);
}

    .lux-section-heading > div[b-l2f3zzezq3] {
        min-width: 0;
        display: grid;
        gap: 0.25rem;
    }

    .lux-section-heading h3[b-l2f3zzezq3] {
        margin: 0;
        color: var(--lux-text);
        font-size: clamp(1.45rem, 2.4vw, 2.15rem);
        font-weight: 950;
        line-height: 1.1;
        letter-spacing: -0.045em;
        text-wrap: balance;
    }

    .lux-section-heading p[b-l2f3zzezq3] {
        max-width: 760px;
        margin: 0;
        color: var(--lux-muted);
        font-size: 0.92rem;
        font-weight: 600;
        line-height: 1.5;
    }

.lux-section-heading-small[b-l2f3zzezq3] {
    padding-bottom: 0.9rem;
}

    .lux-section-heading-small h3[b-l2f3zzezq3] {
        font-size: clamp(1.25rem, 2vw, 1.75rem);
    }

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-form-grid {
    margin-top: -0.35rem;
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-field,
.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-field .mud-input-control,
.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-field .mud-input-root,
.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-field input,
.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-field textarea,
.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-field label {
    font-family: inherit;
}

    .salon-onboarding-luxury[b-l2f3zzezq3]  .lux-field .mud-input-outlined-border {
        border-color: var(--lux-line);
        border-radius: 14px;
    }

    .salon-onboarding-luxury[b-l2f3zzezq3]  .lux-field:hover .mud-input-outlined-border {
        border-color: var(--lux-line-strong);
    }

    .salon-onboarding-luxury[b-l2f3zzezq3]  .lux-field .mud-input-label {
        color: var(--lux-muted);
        font-weight: 750;
    }

    .salon-onboarding-luxury[b-l2f3zzezq3]  .lux-field input,
    .salon-onboarding-luxury[b-l2f3zzezq3]  .lux-field textarea {
        color: var(--lux-text);
        font-weight: 650;
    }

    .salon-onboarding-luxury[b-l2f3zzezq3]  .lux-field .mud-input-helper-text {
        color: var(--lux-muted);
        font-size: 0.72rem;
    }

.lux-form-actions[b-l2f3zzezq3] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.65rem;
    padding-top: 0.25rem;
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-form-actions .mud-button-filled-secondary,
.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-submit-button {
    color: var(--lux-secondary-text);
    background: linear-gradient(135deg, var(--lux-secondary), color-mix(in srgb, var(--lux-secondary) 72%, var(--lux-primary)));
    box-shadow: 0 15px 34px color-mix(in srgb, var(--lux-secondary) 23%, transparent);
}

.lux-address-field[b-l2f3zzezq3] {
    position: relative;
}

.lux-address-loading[b-l2f3zzezq3] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.7rem 0.8rem;
    color: var(--lux-muted);
    font-size: 0.8rem;
    font-weight: 700;
}

.lux-address-results[b-l2f3zzezq3] {
    position: absolute;
    top: calc(100% + 0.35rem);
    left: 0;
    right: 0;
    z-index: 50;
    overflow: hidden auto;
    max-height: 340px;
    padding: 0.45rem;
    border: 1px solid var(--lux-line-strong);
    border-radius: 18px;
    background: var(--lux-surface);
    box-shadow: 0 24px 60px color-mix(in srgb, var(--lux-primary) 18%, transparent);
}

.lux-address-option[b-l2f3zzezq3] {
    width: 100%;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    color: var(--lux-text);
    font: inherit;
    text-align: left;
    border: 0;
    border-radius: 14px;
    background: transparent;
    cursor: pointer;
    transition: background 150ms ease, transform 150ms ease;
}

    .lux-address-option:hover[b-l2f3zzezq3],
    .lux-address-option:focus-visible[b-l2f3zzezq3] {
        transform: translateX(2px);
        background: var(--lux-soft-secondary);
        outline: none;
    }

    .lux-address-option > span[b-l2f3zzezq3] {
        width: 38px;
        height: 38px;
        display: grid;
        place-items: center;
        color: var(--lux-secondary);
        border-radius: 12px;
        background: var(--lux-soft-secondary);
    }

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-address-option > span .mud-icon-root,
.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-address-option > .mud-icon-root {
    color: inherit;
}

.lux-address-option > div[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.1rem;
}

.lux-address-option strong[b-l2f3zzezq3],
.lux-address-option small[b-l2f3zzezq3] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lux-address-option strong[b-l2f3zzezq3] {
    font-size: 0.84rem;
    font-weight: 850;
}

.lux-address-option small[b-l2f3zzezq3] {
    color: var(--lux-muted);
    font-size: 0.72rem;
}

.lux-address-confirmed[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid color-mix(in srgb, var(--lux-success) 22%, var(--lux-divider));
    border-radius: 20px;
    background: color-mix(in srgb, var(--lux-success) 7%, var(--lux-surface));
}

.lux-address-pending[b-l2f3zzezq3] {
    border-color: var(--lux-line-strong);
    background: var(--lux-soft-secondary);
}

.lux-address-confirmed-icon[b-l2f3zzezq3] {
    width: 50px;
    height: 50px;
    display: grid;
    place-items: center;
    color: var(--lux-success);
    border-radius: 17px;
    background: color-mix(in srgb, var(--lux-success) 11%, var(--lux-surface));
}

.lux-address-pending .lux-address-confirmed-icon[b-l2f3zzezq3] {
    color: var(--lux-secondary);
    background: var(--lux-surface);
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-address-confirmed-icon .mud-icon-root {
    color: inherit;
    font-size: 1.35rem;
}

.lux-address-confirmed > div[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.2rem;
}

    .lux-address-confirmed > div > small[b-l2f3zzezq3] {
        color: var(--lux-secondary);
        font-size: 0.66rem;
        font-weight: 900;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .lux-address-confirmed > div > strong[b-l2f3zzezq3] {
        color: var(--lux-text);
        font-size: 0.96rem;
        font-weight: 900;
    }

.lux-address-confirmed p[b-l2f3zzezq3] {
    margin: 0;
    color: var(--lux-muted);
    font-size: 0.8rem;
    line-height: 1.4;
}

.lux-address-facts[b-l2f3zzezq3] {
    display: flex;
    gap: 0.45rem;
}

    .lux-address-facts span[b-l2f3zzezq3] {
        min-width: 80px;
        display: grid;
        gap: 0.12rem;
        padding: 0.65rem;
        border: 1px solid var(--lux-line);
        border-radius: 14px;
        background: var(--lux-surface);
    }

    .lux-address-facts b[b-l2f3zzezq3] {
        overflow: hidden;
        color: var(--lux-text);
        font-size: 0.82rem;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .lux-address-facts small[b-l2f3zzezq3] {
        color: var(--lux-muted);
        font-size: 0.62rem;
        font-weight: 750;
    }

.lux-phone-field[b-l2f3zzezq3] {
    position: relative;
}

.lux-phone-prefix[b-l2f3zzezq3] {
    position: absolute;
    left: 12px;
    top: 50%;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    transform: translateY(-50%);
    padding: 0.3rem 0.48rem;
    color: var(--lux-text);
    font-size: 0.76rem;
    border: 1px solid var(--lux-line);
    border-radius: 10px;
    background: var(--lux-soft-primary);
    pointer-events: none;
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-phone-input .mud-input-adornment-start {
    visibility: hidden;
    width: 72px;
}

.lux-locked-value[b-l2f3zzezq3] {
    min-height: 66px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    border: 1px solid var(--lux-line);
    border-radius: 16px;
    background: var(--lux-soft-primary);
}

.lux-locked-value-icon[b-l2f3zzezq3] {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    color: var(--lux-secondary);
    border-radius: 13px;
    background: var(--lux-surface);
}

.lux-locked-value-flag[b-l2f3zzezq3] {
    font-size: 1.2rem;
}

.lux-locked-value > div[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.12rem;
}

.lux-locked-value small[b-l2f3zzezq3] {
    color: var(--lux-muted);
    font-size: 0.64rem;
    font-weight: 800;
    text-transform: uppercase;
}

.lux-locked-value strong[b-l2f3zzezq3] {
    overflow: hidden;
    color: var(--lux-text);
    font-size: 0.83rem;
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-locked-value > .mud-icon-root {
    color: var(--lux-muted);
    font-size: 1rem;
}

.lux-editor-card[b-l2f3zzezq3],
.lux-team-list-card[b-l2f3zzezq3],
.lux-closure-list-card[b-l2f3zzezq3],
.lux-upload-card[b-l2f3zzezq3],
.lux-portfolio-card[b-l2f3zzezq3],
.lux-readiness-panel[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid var(--lux-line);
    border-radius: 22px;
    background: linear-gradient(135deg, var(--lux-surface), color-mix(in srgb, var(--lux-primary) 2%, var(--lux-surface)));
    box-shadow: 0 14px 38px color-mix(in srgb, var(--lux-primary) 6%, transparent);
}

.lux-editor-card-header[b-l2f3zzezq3],
.lux-team-intro[b-l2f3zzezq3],
.lux-team-list-header[b-l2f3zzezq3],
.lux-readiness-heading[b-l2f3zzezq3],
.lux-upload-copy[b-l2f3zzezq3],
.lux-portfolio-service[b-l2f3zzezq3] {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .lux-editor-card-header > span[b-l2f3zzezq3],
    .lux-team-intro > span[b-l2f3zzezq3],
    .lux-readiness-heading > span[b-l2f3zzezq3],
    .lux-upload-icon[b-l2f3zzezq3],
    .lux-portfolio-service > span[b-l2f3zzezq3] {
        width: 46px;
        height: 46px;
        display: grid;
        place-items: center;
        flex: 0 0 auto;
        color: var(--lux-secondary);
        border-radius: 15px;
        background: var(--lux-soft-secondary);
    }

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-editor-card-header > span .mud-icon-root,
.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-team-intro > span .mud-icon-root,
.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-readiness-heading > span .mud-icon-root,
.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-upload-icon .mud-icon-root,
.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-portfolio-service > span .mud-icon-root {
    color: inherit;
}

.lux-editor-card-header > div[b-l2f3zzezq3],
.lux-team-intro > div[b-l2f3zzezq3],
.lux-team-list-header > div[b-l2f3zzezq3],
.lux-readiness-heading > div[b-l2f3zzezq3],
.lux-upload-copy > div[b-l2f3zzezq3],
.lux-portfolio-service > div[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.18rem;
}

.lux-editor-card-header strong[b-l2f3zzezq3],
.lux-team-intro strong[b-l2f3zzezq3],
.lux-team-list-header strong[b-l2f3zzezq3],
.lux-upload-copy strong[b-l2f3zzezq3],
.lux-portfolio-service strong[b-l2f3zzezq3] {
    color: var(--lux-text);
    font-weight: 900;
}

.lux-editor-card-header small[b-l2f3zzezq3],
.lux-team-intro p[b-l2f3zzezq3],
.lux-team-list-header span[b-l2f3zzezq3],
.lux-upload-copy p[b-l2f3zzezq3],
.lux-portfolio-service small[b-l2f3zzezq3] {
    margin: 0;
    color: var(--lux-muted);
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1.4;
}

.lux-toolbar[b-l2f3zzezq3] {
    display: flex;
    align-items: flex-end;
    gap: 0.65rem;
    padding: 0.75rem;
    border: 1px solid var(--lux-line);
    border-radius: 18px;
    background: var(--lux-soft-primary);
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-search-field {
    flex: 1;
}

.lux-service-list[b-l2f3zzezq3],
.lux-team-list[b-l2f3zzezq3],
.lux-closure-list[b-l2f3zzezq3],
.lux-portfolio-list[b-l2f3zzezq3],
.lux-hours-list[b-l2f3zzezq3],
.lux-readiness-list[b-l2f3zzezq3] {
    display: grid;
    gap: 0.75rem;
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .owner-service-card {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid var(--lux-line);
    border-radius: 20px;
    background: var(--lux-surface);
    box-shadow: 0 12px 30px color-mix(in srgb, var(--lux-primary) 5%, transparent);
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

    .salon-onboarding-luxury[b-l2f3zzezq3]  .owner-service-card:hover {
        transform: translateY(-2px);
        border-color: var(--lux-line-strong);
        box-shadow: 0 18px 44px color-mix(in srgb, var(--lux-primary) 9%, transparent);
    }

.salon-onboarding-luxury[b-l2f3zzezq3]  .owner-service-card-editing {
    border-color: color-mix(in srgb, var(--lux-info) 35%, var(--lux-divider));
    background: color-mix(in srgb, var(--lux-info) 5%, var(--lux-surface));
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .owner-service-card-inactive {
    opacity: 0.64;
    background: var(--lux-soft-primary);
}

.lux-service-icon[b-l2f3zzezq3] {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    color: var(--lux-secondary);
    border-radius: 17px;
    background: var(--lux-soft-secondary);
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-service-icon .mud-icon-root {
    color: inherit;
    font-size: 1.3rem;
}

.lux-service-copy[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.35rem;
}

    .lux-service-copy > strong[b-l2f3zzezq3] {
        overflow: hidden;
        color: var(--lux-text);
        font-size: 0.98rem;
        font-weight: 900;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .lux-service-copy p[b-l2f3zzezq3] {
        display: -webkit-box;
        overflow: hidden;
        margin: 0;
        color: var(--lux-muted);
        font-size: 0.82rem;
        line-height: 1.4;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

.lux-service-tags[b-l2f3zzezq3] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

    .lux-service-tags span[b-l2f3zzezq3] {
        padding: 0.3rem 0.5rem;
        color: var(--lux-text);
        font-size: 0.68rem;
        font-weight: 800;
        border: 1px solid var(--lux-line);
        border-radius: 999px;
        background: var(--lux-soft-primary);
    }

.lux-service-actions[b-l2f3zzezq3] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    gap: 0.35rem;
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-service-actions .mud-button-root {
    min-height: 34px;
    border-radius: 10px;
    font-size: 0.69rem;
    font-weight: 850;
}

.lux-pagination[b-l2f3zzezq3] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    padding-top: 0.25rem;
}

    .lux-pagination span[b-l2f3zzezq3] {
        min-width: 120px;
        color: var(--lux-muted);
        font-size: 0.76rem;
        font-weight: 800;
        text-align: center;
    }

.lux-empty-state[b-l2f3zzezq3] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 1rem;
    border: 1px dashed var(--lux-line-strong);
    border-radius: 20px;
    background: var(--lux-soft-secondary);
}

    .lux-empty-state > span[b-l2f3zzezq3] {
        width: 48px;
        height: 48px;
        display: grid;
        place-items: center;
        flex: 0 0 auto;
        color: var(--lux-secondary);
        border-radius: 16px;
        background: var(--lux-surface);
    }

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-empty-state > span .mud-icon-root {
    color: inherit;
}

.lux-empty-state > div[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.2rem;
}

.lux-empty-state strong[b-l2f3zzezq3] {
    color: var(--lux-text);
    font-weight: 900;
}

.lux-empty-state p[b-l2f3zzezq3] {
    margin: 0;
    color: var(--lux-muted);
    font-size: 0.82rem;
    line-height: 1.4;
}

.lux-empty-state-compact[b-l2f3zzezq3] {
    padding: 0.8rem;
}

.lux-team-intro[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    padding: 0.85rem;
    border: 1px solid var(--lux-line-strong);
    border-radius: 20px;
    background: var(--lux-soft-secondary);
}

.lux-team-layout[b-l2f3zzezq3],
.lux-closure-layout[b-l2f3zzezq3],
.lux-preview-layout[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: minmax(320px, 0.95fr) minmax(0, 1.05fr);
    gap: 1rem;
    align-items: start;
}

.lux-photo-editor[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 1rem;
    padding: 0.85rem;
    border: 1px solid var(--lux-line);
    border-radius: 18px;
    background: var(--lux-soft-primary);
}

.lux-photo-preview[b-l2f3zzezq3] {
    overflow: hidden;
    width: 82px;
    height: 82px;
    display: grid;
    place-items: center;
    color: var(--lux-secondary);
    border: 2px solid color-mix(in srgb, var(--lux-secondary) 22%, var(--lux-divider));
    border-radius: 26px;
    background: var(--lux-soft-secondary);
}

    .lux-photo-preview img[b-l2f3zzezq3] {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
    }

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-photo-preview .mud-icon-root {
    color: inherit;
    font-size: 2rem;
}

.lux-photo-editor-copy[b-l2f3zzezq3] {
    display: grid;
    gap: 0.3rem;
}

    .lux-photo-editor-copy strong[b-l2f3zzezq3] {
        color: var(--lux-text);
        font-weight: 900;
    }

    .lux-photo-editor-copy > span[b-l2f3zzezq3] {
        color: var(--lux-muted);
        font-size: 0.8rem;
    }

.lux-photo-editor-actions[b-l2f3zzezq3] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem;
}

.lux-file-button[b-l2f3zzezq3],
.lux-portfolio-file-button[b-l2f3zzezq3] {
    position: relative;
    overflow: hidden;
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    padding: 0.55rem 0.8rem;
    color: var(--lux-secondary-text);
    font-size: 0.73rem;
    font-weight: 900;
    letter-spacing: 0.035em;
    text-transform: uppercase;
    border-radius: 12px;
    background: linear-gradient(135deg, var(--lux-secondary), color-mix(in srgb, var(--lux-secondary) 74%, var(--lux-primary)));
    cursor: pointer;
}

    .lux-file-button input[b-l2f3zzezq3],
    .lux-portfolio-file-button input[b-l2f3zzezq3],
    .lux-dropzone input[b-l2f3zzezq3] {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        cursor: pointer;
    }

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-file-button .mud-icon-root,
.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-portfolio-file-button .mud-icon-root {
    color: inherit;
    font-size: 1rem;
}

.lux-service-picker[b-l2f3zzezq3] {
    display: grid;
    gap: 0.65rem;
    padding: 0.8rem;
    border: 1px solid var(--lux-line);
    border-radius: 18px;
    background: var(--lux-soft-primary);
}

    .lux-service-picker > div:first-child[b-l2f3zzezq3] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
    }

        .lux-service-picker > div:first-child strong[b-l2f3zzezq3] {
            color: var(--lux-text);
            font-size: 0.86rem;
            font-weight: 900;
        }

        .lux-service-picker > div:first-child span[b-l2f3zzezq3] {
            color: var(--lux-muted);
            font-size: 0.72rem;
            font-weight: 750;
        }

.lux-service-picker-list[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
}

.lux-service-choice[b-l2f3zzezq3] {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.55rem;
    border: 1px solid var(--lux-line);
    border-radius: 14px;
    background: var(--lux-surface);
    cursor: pointer;
    transition: border-color 150ms ease, background 150ms ease, transform 150ms ease;
}

    .lux-service-choice:hover[b-l2f3zzezq3] {
        transform: translateY(-1px);
        border-color: var(--lux-line-strong);
    }

.lux-service-choice-selected[b-l2f3zzezq3] {
    border-color: color-mix(in srgb, var(--lux-secondary) 40%, var(--lux-divider));
    background: var(--lux-soft-secondary);
}

.lux-service-choice > span[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.1rem;
}

.lux-service-choice strong[b-l2f3zzezq3],
.lux-service-choice small[b-l2f3zzezq3] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lux-service-choice strong[b-l2f3zzezq3] {
    color: var(--lux-text);
    font-size: 0.78rem;
    font-weight: 850;
}

.lux-service-choice small[b-l2f3zzezq3] {
    color: var(--lux-muted);
    font-size: 0.66rem;
}

.lux-team-list-header[b-l2f3zzezq3] {
    justify-content: space-between;
}

.lux-count-badge[b-l2f3zzezq3] {
    min-width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    color: var(--lux-secondary-text) !important;
    font-size: 0.82rem !important;
    font-weight: 950 !important;
    border-radius: 13px;
    background: var(--lux-secondary);
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .owner-professional-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.75rem;
    padding: 0.8rem;
    border: 1px solid var(--lux-line);
    border-radius: 18px;
    background: var(--lux-surface);
    cursor: pointer;
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

    .salon-onboarding-luxury[b-l2f3zzezq3]  .owner-professional-card:hover,
    .salon-onboarding-luxury[b-l2f3zzezq3]  .owner-professional-card:focus-visible {
        transform: translateY(-2px);
        border-color: var(--lux-line-strong);
        box-shadow: 0 16px 38px color-mix(in srgb, var(--lux-primary) 8%, transparent);
        outline: none;
    }

.salon-onboarding-luxury[b-l2f3zzezq3]  .owner-professional-card-editing {
    border-color: color-mix(in srgb, var(--lux-info) 35%, var(--lux-divider));
    background: color-mix(in srgb, var(--lux-info) 5%, var(--lux-surface));
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .owner-professional-card-inactive {
    cursor: default;
    opacity: 0.62;
}

.owner-professional-avatar[b-l2f3zzezq3] {
    overflow: hidden;
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    color: var(--lux-secondary-text);
    font-size: 0.9rem;
    font-weight: 950;
    border-radius: 18px;
    background: linear-gradient(135deg, var(--lux-secondary), color-mix(in srgb, var(--lux-secondary) 74%, var(--lux-primary)));
}

    .owner-professional-avatar img[b-l2f3zzezq3] {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
    }

.owner-professional-copy[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.22rem;
}

.owner-professional-title-row[b-l2f3zzezq3] {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

    .owner-professional-title-row > strong[b-l2f3zzezq3] {
        overflow: hidden;
        color: var(--lux-text);
        font-size: 0.88rem;
        font-weight: 900;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.owner-professional-copy > span[b-l2f3zzezq3],
.owner-professional-copy > small[b-l2f3zzezq3] {
    color: var(--lux-muted);
    font-size: 0.72rem;
    line-height: 1.35;
}

.owner-professional-action-buttons[b-l2f3zzezq3] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.25rem;
    padding-top: 0.25rem;
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .owner-professional-action-buttons .mud-button-root {
    min-height: 31px;
    border-radius: 10px;
    font-size: 0.66rem;
    font-weight: 850;
}

.lux-upload-card[b-l2f3zzezq3] {
    grid-template-columns: minmax(230px, 0.72fr) minmax(260px, 0.72fr) minmax(280px, 1fr);
    align-items: center;
}

.lux-dropzone[b-l2f3zzezq3] {
    position: relative;
    overflow: hidden;
    min-height: 116px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.8rem;
    padding: 1rem;
    text-align: left;
    border: 1.5px dashed color-mix(in srgb, var(--lux-secondary) 38%, var(--lux-divider));
    border-radius: 20px;
    background: radial-gradient(circle at 12% 10%, var(--lux-soft-secondary), transparent 40%), var(--lux-soft-primary);
    cursor: pointer;
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

    .lux-dropzone:hover[b-l2f3zzezq3] {
        transform: translateY(-2px);
        border-color: var(--lux-secondary);
        box-shadow: 0 16px 36px color-mix(in srgb, var(--lux-secondary) 12%, transparent);
    }

.lux-dropzone-disabled[b-l2f3zzezq3],
.lux-portfolio-file-button-disabled[b-l2f3zzezq3] {
    cursor: not-allowed;
    opacity: 0.48;
}

.lux-dropzone-icon[b-l2f3zzezq3] {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    color: var(--lux-secondary-text);
    border-radius: 18px;
    background: linear-gradient(135deg, var(--lux-secondary), color-mix(in srgb, var(--lux-secondary) 72%, var(--lux-primary)));
    box-shadow: 0 14px 30px color-mix(in srgb, var(--lux-secondary) 20%, transparent);
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-dropzone-icon .mud-icon-root {
    color: inherit;
    font-size: 1.4rem;
}

.lux-dropzone-copy[b-l2f3zzezq3] {
    display: grid;
    gap: 0.15rem;
}

    .lux-dropzone-copy strong[b-l2f3zzezq3] {
        color: var(--lux-text);
        font-size: 0.88rem;
        font-weight: 900;
    }

    .lux-dropzone-copy small[b-l2f3zzezq3] {
        color: var(--lux-muted);
        font-size: 0.72rem;
        font-weight: 650;
    }

.lux-media-grid[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.8rem;
}

    .lux-media-grid > figure[b-l2f3zzezq3],
    .lux-portfolio-media-grid > figure[b-l2f3zzezq3] {
        position: relative;
        overflow: hidden;
        min-height: 240px;
        margin: 0;
        border: 1px solid var(--lux-line);
        border-radius: 24px;
        background: var(--lux-soft-primary);
        box-shadow: 0 16px 38px color-mix(in srgb, var(--lux-primary) 9%, transparent);
    }

    .lux-media-grid > .owner-media-card-primary[b-l2f3zzezq3] {
        grid-column: span 2;
        min-height: 330px;
    }

    .lux-media-grid img[b-l2f3zzezq3],
    .lux-portfolio-media-grid img[b-l2f3zzezq3] {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
        transition: transform 220ms ease, filter 220ms ease;
    }

    .lux-media-grid > figure:hover img[b-l2f3zzezq3],
    .lux-portfolio-media-grid > figure:hover img[b-l2f3zzezq3] {
        transform: scale(1.035);
        filter: saturate(1.04);
    }

    .lux-media-grid > figure[b-l2f3zzezq3]::after,
    .lux-portfolio-media-grid > figure[b-l2f3zzezq3]::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(180deg, transparent 34%, color-mix(in srgb, var(--lux-primary) 78%, transparent));
        pointer-events: none;
    }

    .lux-media-grid figcaption[b-l2f3zzezq3],
    .lux-portfolio-media-grid figcaption[b-l2f3zzezq3] {
        position: absolute;
        inset: 0;
        z-index: 2;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        gap: 0.75rem;
        padding: 0.75rem;
    }

.lux-media-open[b-l2f3zzezq3] {
    position: absolute;
    top: 0.7rem;
    right: 0.7rem;
    z-index: 4;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    color: var(--lux-primary-text);
    border: 1px solid color-mix(in srgb, var(--lux-primary-text) 24%, transparent);
    border-radius: 13px;
    background: color-mix(in srgb, var(--lux-primary) 52%, transparent);
    backdrop-filter: blur(12px);
    cursor: pointer;
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-media-open .mud-icon-root {
    color: inherit;
}

.lux-media-badges[b-l2f3zzezq3] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    padding-right: 48px;
}

    .lux-media-badges span[b-l2f3zzezq3] {
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
        padding: 0.34rem 0.5rem;
        color: var(--lux-primary-text);
        font-size: 0.66rem;
        font-weight: 850;
        border: 1px solid color-mix(in srgb, var(--lux-primary-text) 20%, transparent);
        border-radius: 999px;
        background: color-mix(in srgb, var(--lux-primary) 50%, transparent);
        backdrop-filter: blur(10px);
    }

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-media-badges .mud-icon-root {
    color: inherit;
    font-size: 0.8rem;
}

.lux-media-actions[b-l2f3zzezq3] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.35rem;
    margin-top: auto;
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-media-actions .mud-button-root {
    min-height: 34px;
    border-radius: 11px;
    font-size: 0.66rem;
    font-weight: 850;
    box-shadow: 0 10px 24px color-mix(in srgb, var(--lux-primary) 18%, transparent);
}

.lux-portfolio-section[b-l2f3zzezq3] {
    display: grid;
    gap: 1rem;
    margin-top: 0.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--lux-line);
}

.lux-portfolio-card > header[b-l2f3zzezq3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.lux-portfolio-upload-row[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.65rem;
}

.lux-portfolio-file-button[b-l2f3zzezq3] {
    min-height: 52px;
}

.lux-portfolio-media-grid[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.65rem;
}

    .lux-portfolio-media-grid > figure[b-l2f3zzezq3] {
        min-height: 210px;
        border-radius: 18px;
    }

    .lux-portfolio-media-grid > .owner-service-portfolio-media-card-primary[b-l2f3zzezq3] {
        grid-column: span 2;
    }

.lux-hours-list[b-l2f3zzezq3] {
    gap: 0.65rem;
}

.lux-hour-card[b-l2f3zzezq3] {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(150px, 0.65fr) auto minmax(280px, 1fr);
    align-items: center;
    gap: 0.8rem;
    padding: 0.85rem;
    border: 1px solid var(--lux-line);
    border-radius: 20px;
    background: var(--lux-surface);
    box-shadow: 0 11px 28px color-mix(in srgb, var(--lux-primary) 5%, transparent);
}

    .lux-hour-card[b-l2f3zzezq3]::before {
        content: "";
        position: absolute;
        inset: 0 auto 0 0;
        width: 4px;
        background: var(--lux-secondary);
    }

.lux-hour-card-closed[b-l2f3zzezq3] {
    grid-template-columns: minmax(150px, 1fr) auto;
    background: var(--lux-soft-primary);
}

    .lux-hour-card-closed[b-l2f3zzezq3]::before {
        background: var(--lux-divider);
    }

.lux-hour-day[b-l2f3zzezq3] {
    display: flex;
    align-items: center;
    gap: 0.7rem;
}

    .lux-hour-day > span[b-l2f3zzezq3] {
        width: 42px;
        height: 42px;
        display: grid;
        place-items: center;
        flex: 0 0 auto;
        color: var(--lux-secondary-text);
        font-size: 0.67rem;
        font-weight: 950;
        border-radius: 14px;
        background: var(--lux-secondary);
    }

.lux-hour-card-closed .lux-hour-day > span[b-l2f3zzezq3] {
    color: var(--lux-muted);
    background: var(--lux-divider);
}

.lux-hour-day > div[b-l2f3zzezq3] {
    display: grid;
    gap: 0.12rem;
}

.lux-hour-day strong[b-l2f3zzezq3] {
    color: var(--lux-text);
    font-size: 0.86rem;
    font-weight: 900;
}

.lux-hour-day small[b-l2f3zzezq3] {
    color: var(--lux-muted);
    font-size: 0.67rem;
    font-weight: 750;
}

.lux-hour-times[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
}

.lux-breaks[b-l2f3zzezq3] {
    grid-column: 1 / -1;
    display: grid;
    gap: 0.55rem;
    padding: 0.7rem;
    border: 1px solid var(--lux-line);
    border-radius: 16px;
    background: var(--lux-soft-primary);
}

.lux-breaks-header[b-l2f3zzezq3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

    .lux-breaks-header > div[b-l2f3zzezq3] {
        display: grid;
        gap: 0.1rem;
    }

    .lux-breaks-header strong[b-l2f3zzezq3] {
        color: var(--lux-text);
        font-size: 0.78rem;
        font-weight: 900;
    }

    .lux-breaks-header span[b-l2f3zzezq3] {
        color: var(--lux-muted);
        font-size: 0.66rem;
    }

.lux-break-row[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: minmax(140px, 1fr) minmax(100px, 0.7fr) minmax(100px, 0.7fr) auto;
    align-items: center;
    gap: 0.45rem;
}

.lux-date-grid[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
}

.lux-closure-card[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: start;
    gap: 0.7rem;
    padding: 0.75rem;
    border: 1px solid var(--lux-line);
    border-radius: 17px;
    background: var(--lux-surface);
}

.lux-closure-icon[b-l2f3zzezq3] {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    color: var(--lux-secondary);
    border-radius: 14px;
    background: var(--lux-soft-secondary);
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-closure-icon .mud-icon-root {
    color: inherit;
}

.lux-closure-card > div[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.15rem;
}

.lux-closure-card strong[b-l2f3zzezq3] {
    color: var(--lux-text);
    font-size: 0.84rem;
    font-weight: 900;
}

.lux-closure-card span[b-l2f3zzezq3],
.lux-closure-card small[b-l2f3zzezq3],
.lux-closure-card p[b-l2f3zzezq3] {
    margin: 0;
    color: var(--lux-muted);
    font-size: 0.72rem;
    line-height: 1.35;
}

.lux-preview-stage[b-l2f3zzezq3] {
    background: radial-gradient(circle at 92% 8%, var(--lux-soft-secondary), transparent 30%), var(--lux-surface);
}

.lux-preview-layout[b-l2f3zzezq3] {
    grid-template-columns: minmax(0, 1.08fr) minmax(320px, 0.92fr);
}

.lux-salon-preview[b-l2f3zzezq3] {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 480px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 1.5rem;
    padding: clamp(1.2rem, 2.8vw, 2rem);
    color: var(--lux-primary-text);
    border: 1px solid color-mix(in srgb, var(--lux-primary-text) 18%, transparent);
    border-radius: 32px;
    background: radial-gradient(circle at 88% 12%, color-mix(in srgb, var(--lux-secondary) 38%, transparent), transparent 31%), radial-gradient(circle at 10% 92%, color-mix(in srgb, var(--lux-secondary) 22%, transparent), transparent 30%), linear-gradient(135deg, color-mix(in srgb, var(--lux-primary) 92%, var(--lux-text)), var(--lux-primary) 56%, color-mix(in srgb, var(--lux-primary) 76%, var(--lux-secondary)));
    box-shadow: 0 28px 72px color-mix(in srgb, var(--lux-primary) 22%, transparent);
}

.lux-salon-preview-with-image[b-l2f3zzezq3] {
    background: var(--lux-primary);
}

.lux-salon-preview > img[b-l2f3zzezq3] {
    position: absolute;
    inset: 0;
    z-index: -3;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.lux-salon-preview-overlay[b-l2f3zzezq3] {
    position: absolute;
    inset: 0;
    z-index: -2;
    background: linear-gradient(180deg, color-mix(in srgb, var(--lux-primary) 16%, transparent), color-mix(in srgb, var(--lux-primary) 86%, transparent));
}

.lux-salon-preview[b-l2f3zzezq3]::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: repeating-linear-gradient(135deg, color-mix(in srgb, var(--lux-primary-text) 5%, transparent) 0 1px, transparent 1px 18px);
    pointer-events: none;
}

.lux-preview-top[b-l2f3zzezq3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.lux-preview-brand[b-l2f3zzezq3],
.lux-preview-status[b-l2f3zzezq3] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.42rem 0.62rem;
    color: var(--lux-primary-text);
    font-size: 0.68rem;
    font-weight: 900;
    border: 1px solid color-mix(in srgb, var(--lux-primary-text) 20%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--lux-primary) 42%, transparent);
    backdrop-filter: blur(12px);
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-preview-brand .mud-icon-root {
    color: inherit;
    font-size: 0.9rem;
}

.lux-preview-main[b-l2f3zzezq3] {
    display: grid;
    gap: 0.55rem;
    margin-top: auto;
}

    .lux-preview-main > small[b-l2f3zzezq3] {
        color: color-mix(in srgb, var(--lux-primary-text) 72%, transparent);
    }

    .lux-preview-main h2[b-l2f3zzezq3] {
        max-width: 720px;
        margin: 0;
        color: var(--lux-primary-text);
        font-size: clamp(2rem, 4vw, 3.8rem);
        font-weight: 950;
        line-height: 1;
        letter-spacing: -0.06em;
        text-wrap: balance;
    }

    .lux-preview-main p[b-l2f3zzezq3] {
        display: flex;
        align-items: center;
        gap: 0.35rem;
        margin: 0;
        color: color-mix(in srgb, var(--lux-primary-text) 80%, transparent);
        font-weight: 700;
    }

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-preview-main .mud-icon-root {
    color: inherit;
}

.lux-preview-stats[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.55rem;
}

    .lux-preview-stats div[b-l2f3zzezq3] {
        display: grid;
        gap: 0.18rem;
        padding: 0.75rem;
        border: 1px solid color-mix(in srgb, var(--lux-primary-text) 16%, transparent);
        border-radius: 16px;
        background: color-mix(in srgb, var(--lux-primary) 42%, transparent);
        backdrop-filter: blur(12px);
    }

    .lux-preview-stats strong[b-l2f3zzezq3] {
        color: var(--lux-primary-text);
        font-size: 1rem;
        font-weight: 950;
    }

    .lux-preview-stats span[b-l2f3zzezq3] {
        color: color-mix(in srgb, var(--lux-primary-text) 70%, transparent);
        font-size: 0.64rem;
        font-weight: 800;
        text-transform: uppercase;
    }

.lux-preview-services[b-l2f3zzezq3] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

    .lux-preview-services span[b-l2f3zzezq3] {
        display: inline-flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.6rem;
        padding: 0.45rem 0.58rem;
        color: var(--lux-primary-text);
        font-size: 0.7rem;
        font-weight: 750;
        border: 1px solid color-mix(in srgb, var(--lux-primary-text) 17%, transparent);
        border-radius: 999px;
        background: color-mix(in srgb, var(--lux-primary) 44%, transparent);
        backdrop-filter: blur(10px);
    }

    .lux-preview-services b[b-l2f3zzezq3] {
        color: var(--lux-secondary-text);
        padding: 0.18rem 0.35rem;
        border-radius: 999px;
        background: var(--lux-secondary);
    }

.lux-readiness-heading[b-l2f3zzezq3] {
    align-items: flex-start;
}

    .lux-readiness-heading strong[b-l2f3zzezq3] {
        color: var(--lux-text);
        font-size: 1.1rem;
        font-weight: 950;
        line-height: 1.2;
    }

    .lux-readiness-heading p[b-l2f3zzezq3] {
        margin: 0;
        color: var(--lux-muted);
        font-size: 0.8rem;
        line-height: 1.45;
    }

.lux-readiness-item[b-l2f3zzezq3] {
    width: 100%;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.65rem;
    padding: 0.7rem;
    color: var(--lux-text);
    font: inherit;
    text-align: left;
    border: 1px solid color-mix(in srgb, var(--lux-warning) 22%, var(--lux-divider));
    border-radius: 16px;
    background: color-mix(in srgb, var(--lux-warning) 6%, var(--lux-surface));
    cursor: pointer;
    transition: transform 150ms ease, border-color 150ms ease;
}

    .lux-readiness-item:hover[b-l2f3zzezq3] {
        transform: translateX(2px);
        border-color: color-mix(in srgb, var(--lux-secondary) 36%, var(--lux-divider));
    }

.lux-readiness-item-complete[b-l2f3zzezq3] {
    border-color: color-mix(in srgb, var(--lux-success) 20%, var(--lux-divider));
    background: color-mix(in srgb, var(--lux-success) 6%, var(--lux-surface));
}

.lux-readiness-item > span[b-l2f3zzezq3] {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    color: var(--lux-warning);
    border-radius: 13px;
    background: color-mix(in srgb, var(--lux-warning) 10%, var(--lux-surface));
}

.lux-readiness-item-complete > span[b-l2f3zzezq3] {
    color: var(--lux-success);
    background: color-mix(in srgb, var(--lux-success) 10%, var(--lux-surface));
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-readiness-item > span .mud-icon-root,
.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-readiness-item > .mud-icon-root {
    color: inherit;
}

.lux-readiness-item > div[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.12rem;
}

.lux-readiness-item strong[b-l2f3zzezq3] {
    color: var(--lux-text);
    font-size: 0.8rem;
    font-weight: 900;
}

.lux-readiness-item small[b-l2f3zzezq3] {
    overflow: hidden;
    color: var(--lux-muted);
    font-size: 0.69rem;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lux-polish-row[b-l2f3zzezq3] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.8rem;
    border: 1px solid var(--lux-line-strong);
    border-radius: 18px;
    background: var(--lux-soft-secondary);
}

    .lux-polish-row > span[b-l2f3zzezq3] {
        width: 42px;
        height: 42px;
        display: grid;
        place-items: center;
        flex: 0 0 auto;
        color: var(--lux-secondary);
        border-radius: 14px;
        background: var(--lux-surface);
    }

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-polish-row > span .mud-icon-root {
    color: inherit;
}

.lux-polish-row > div[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.12rem;
}

.lux-polish-row strong[b-l2f3zzezq3] {
    color: var(--lux-text);
    font-size: 0.82rem;
    font-weight: 900;
}

.lux-polish-row p[b-l2f3zzezq3] {
    margin: 0;
    color: var(--lux-muted);
    font-size: 0.72rem;
}

.lux-submit-card[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) minmax(260px, auto);
    align-items: center;
    gap: 1rem;
    padding: clamp(1rem, 2vw, 1.4rem);
    border: 1px solid var(--lux-line-strong);
    border-radius: 26px;
    background: radial-gradient(circle at 92% 8%, var(--lux-soft-secondary), transparent 30%), linear-gradient(135deg, var(--lux-surface), var(--lux-soft-primary));
    box-shadow: 0 18px 48px color-mix(in srgb, var(--lux-primary) 8%, transparent);
}

.lux-submit-icon[b-l2f3zzezq3] {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    color: var(--lux-secondary-text);
    border-radius: 20px;
    background: linear-gradient(135deg, var(--lux-secondary), color-mix(in srgb, var(--lux-secondary) 72%, var(--lux-primary)));
    box-shadow: 0 16px 36px color-mix(in srgb, var(--lux-secondary) 23%, transparent);
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-submit-icon .mud-icon-root {
    color: inherit;
    font-size: 1.45rem;
}

.lux-submit-copy[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.25rem;
}

    .lux-submit-copy > strong[b-l2f3zzezq3] {
        color: var(--lux-text);
        font-size: clamp(1rem, 1.6vw, 1.35rem);
        font-weight: 950;
        line-height: 1.2;
    }

    .lux-submit-copy > p[b-l2f3zzezq3] {
        max-width: 760px;
        margin: 0;
        color: var(--lux-muted);
        font-size: 0.82rem;
        line-height: 1.45;
    }

.lux-submit-note[b-l2f3zzezq3] {
    display: flex;
    align-items: flex-start;
    gap: 0.45rem;
    margin-top: 0.35rem;
    padding: 0.55rem;
    color: var(--lux-text);
    font-size: 0.72rem;
    line-height: 1.35;
    border: 1px solid var(--lux-line);
    border-radius: 13px;
    background: var(--lux-soft-primary);
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-submit-note .mud-icon-root {
    flex: 0 0 auto;
    color: var(--lux-secondary);
    font-size: 1rem;
}

.lux-submit-action[b-l2f3zzezq3] {
    display: grid;
    justify-items: stretch;
    gap: 0.45rem;
}

.salon-onboarding-luxury[b-l2f3zzezq3]  .lux-submit-button {
    width: 100%;
    min-width: 260px;
}

.lux-submit-action > small[b-l2f3zzezq3] {
    max-width: 300px;
    color: var(--lux-muted);
    font-size: 0.67rem;
    line-height: 1.35;
    text-align: center;
}

.lux-stage-footer[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
    padding: 1rem clamp(1rem, 2.5vw, 2rem);
    border-top: 1px solid var(--lux-line);
    background: color-mix(in srgb, var(--lux-surface) 94%, transparent);
    backdrop-filter: blur(16px);
}

    .lux-stage-footer > div[b-l2f3zzezq3] {
        min-width: 0;
        display: grid;
        gap: 0.12rem;
        text-align: center;
    }

    .lux-stage-footer small[b-l2f3zzezq3] {
        color: var(--lux-secondary);
        font-size: 0.64rem;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 0.08em;
    }

    .lux-stage-footer strong[b-l2f3zzezq3] {
        overflow: hidden;
        color: var(--lux-text);
        font-size: 0.78rem;
        font-weight: 800;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.salon-onboarding-luxury[b-l2f3zzezq3]  .owner-service-search-highlight {
    color: inherit;
    font-weight: 950;
    background: color-mix(in srgb, var(--lux-secondary) 24%, transparent);
    border-radius: 4px;
}

@media (max-width: 1180px) {
    .lux-stepper[b-l2f3zzezq3] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .salon-onboarding-luxury[b-l2f3zzezq3]  .lux-onboarding-hero {
        grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
    }

    .lux-upload-card[b-l2f3zzezq3] {
        grid-template-columns: minmax(230px, 0.75fr) minmax(0, 1.25fr);
    }

        .lux-upload-card .lux-dropzone[b-l2f3zzezq3] {
            grid-column: 1 / -1;
        }
}

@media (max-width: 960px) {
    .salon-onboarding-luxury[b-l2f3zzezq3]  .lux-onboarding-hero,
    .lux-team-layout[b-l2f3zzezq3],
    .lux-closure-layout[b-l2f3zzezq3],
    .lux-preview-layout[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
    }

    .lux-progress-card[b-l2f3zzezq3] {
        max-width: none;
    }

    .salon-onboarding-luxury[b-l2f3zzezq3]  .lux-stepper-shell {
        position: static;
    }

    .lux-stepper[b-l2f3zzezq3] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lux-address-confirmed[b-l2f3zzezq3] {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .lux-address-facts[b-l2f3zzezq3] {
        grid-column: 1 / -1;
    }

    .lux-upload-card[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
    }

    .lux-media-grid[b-l2f3zzezq3],
    .lux-portfolio-media-grid[b-l2f3zzezq3] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lux-hour-card[b-l2f3zzezq3],
    .lux-hour-card-closed[b-l2f3zzezq3] {
        grid-template-columns: minmax(150px, 1fr) auto;
    }

    .lux-hour-times[b-l2f3zzezq3],
    .lux-breaks[b-l2f3zzezq3] {
        grid-column: 1 / -1;
    }

    .lux-submit-card[b-l2f3zzezq3] {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .lux-submit-action[b-l2f3zzezq3] {
        grid-column: 1 / -1;
    }

        .salon-onboarding-luxury[b-l2f3zzezq3]  .lux-submit-button,
        .lux-submit-action > small[b-l2f3zzezq3] {
            max-width: none;
            min-width: 0;
            width: 100%;
        }
}

@media (max-width: 640px) {
    .salon-onboarding-luxury[b-l2f3zzezq3] {
        padding-bottom: 2rem;
    }

        .salon-onboarding-luxury[b-l2f3zzezq3]  .lux-onboarding-hero,
        .salon-onboarding-luxury[b-l2f3zzezq3]  .lux-workspace {
            border-radius: 24px;
        }

        .salon-onboarding-luxury[b-l2f3zzezq3]  .lux-onboarding-hero {
            padding: 1.15rem;
        }

        .salon-onboarding-luxury[b-l2f3zzezq3]  .lux-hero-title {
            font-size: clamp(2.15rem, 13vw, 3.35rem);
            letter-spacing: -0.055em;
        }

        .lux-hero-actions[b-l2f3zzezq3],
        .salon-onboarding-luxury[b-l2f3zzezq3]  .lux-hero-actions .mud-button-root {
            width: 100%;
        }

    .lux-progress-metrics[b-l2f3zzezq3] {
        grid-template-columns: repeat(3, minmax(76px, 1fr));
        overflow-x: auto;
    }

    .lux-stepper-mobile-header[b-l2f3zzezq3] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
        padding: 0.25rem 0.25rem 0.65rem;
    }

        .lux-stepper-mobile-header > div[b-l2f3zzezq3] {
            min-width: 0;
            display: grid;
            gap: 0.1rem;
        }

        .lux-stepper-mobile-header span[b-l2f3zzezq3] {
            color: var(--lux-secondary);
            font-size: 0.66rem;
            font-weight: 900;
            text-transform: uppercase;
        }

        .lux-stepper-mobile-header strong[b-l2f3zzezq3] {
            overflow: hidden;
            color: var(--lux-text);
            font-size: 0.9rem;
            font-weight: 900;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

    .salon-onboarding-luxury[b-l2f3zzezq3]  .lux-stepper-mobile-progress {
        display: block;
        margin-bottom: 0.65rem;
    }

    .lux-stepper[b-l2f3zzezq3] {
        display: flex;
        overflow-x: auto;
        grid-template-columns: none;
        gap: 0.45rem;
        padding-bottom: 0.2rem;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
    }

        .lux-stepper[b-l2f3zzezq3]::-webkit-scrollbar {
            display: none;
        }

    .lux-step[b-l2f3zzezq3] {
        min-width: 136px;
        flex: 0 0 auto;
        scroll-snap-align: start;
    }

    .lux-workspace-header[b-l2f3zzezq3],
    .lux-section-heading[b-l2f3zzezq3],
    .lux-team-intro[b-l2f3zzezq3],
    .lux-stage-footer[b-l2f3zzezq3] {
        align-items: stretch;
        flex-direction: column;
    }

    .lux-workspace-header[b-l2f3zzezq3],
    .lux-section-heading[b-l2f3zzezq3] {
        display: flex;
    }

    .lux-workspace-heading[b-l2f3zzezq3] {
        align-items: flex-start;
    }

    .salon-onboarding-luxury[b-l2f3zzezq3]  .lux-status-chip,
    .lux-section-heading > .mud-chip-root[b-l2f3zzezq3] {
        width: fit-content;
    }

    .lux-workspace-body[b-l2f3zzezq3] {
        padding: 0.9rem;
    }

    .lux-address-confirmed[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .lux-address-facts[b-l2f3zzezq3] {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .lux-phone-prefix[b-l2f3zzezq3] {
        top: 31px;
    }

    .lux-toolbar[b-l2f3zzezq3],
    .lux-photo-editor[b-l2f3zzezq3],
    .lux-portfolio-upload-row[b-l2f3zzezq3],
    .lux-submit-card[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
        flex-direction: column;
        align-items: stretch;
    }

    .lux-toolbar[b-l2f3zzezq3] {
        display: flex;
    }

    .lux-photo-preview[b-l2f3zzezq3] {
        width: 72px;
        height: 72px;
    }

    .lux-service-picker-list[b-l2f3zzezq3],
    .lux-date-grid[b-l2f3zzezq3],
    .lux-hour-times[b-l2f3zzezq3],
    .lux-break-row[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
    }

    .salon-onboarding-luxury[b-l2f3zzezq3]  .owner-service-card {
        grid-template-columns: auto minmax(0, 1fr);
        align-items: start;
    }

    .lux-service-actions[b-l2f3zzezq3] {
        grid-column: 1 / -1;
        justify-content: flex-start;
    }

    .lux-media-grid[b-l2f3zzezq3],
    .lux-portfolio-media-grid[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
    }

        .lux-media-grid > .owner-media-card-primary[b-l2f3zzezq3],
        .lux-portfolio-media-grid > .owner-service-portfolio-media-card-primary[b-l2f3zzezq3] {
            grid-column: auto;
            min-height: 250px;
        }

    .lux-hour-card[b-l2f3zzezq3],
    .lux-hour-card-closed[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .lux-hour-times[b-l2f3zzezq3],
    .lux-breaks[b-l2f3zzezq3] {
        grid-column: auto;
    }

    .lux-preview-stats[b-l2f3zzezq3] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .lux-salon-preview[b-l2f3zzezq3] {
        min-height: 430px;
        border-radius: 24px;
    }

    .lux-submit-icon[b-l2f3zzezq3] {
        width: 52px;
        height: 52px;
    }

    .lux-stage-footer[b-l2f3zzezq3] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

        .lux-stage-footer > div[b-l2f3zzezq3] {
            grid-column: 1 / -1;
            grid-row: 1;
            text-align: left;
        }

    .salon-onboarding-luxury[b-l2f3zzezq3]  .lux-stage-footer .mud-button-root {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .salon-onboarding-luxury *[b-l2f3zzezq3],
    .salon-onboarding-luxury *[b-l2f3zzezq3]::before,
    .salon-onboarding-luxury *[b-l2f3zzezq3]::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}

.salon-details-page[b-l2f3zzezq3] {
    --salon-details-primary: var(--mud-palette-primary);
    --salon-details-secondary: var(--mud-palette-secondary);
    --salon-details-info: var(--mud-palette-info);
    --salon-details-success: var(--mud-palette-success);
    --salon-details-warning: var(--mud-palette-warning);
    --salon-details-surface: var(--mud-palette-surface);
    --salon-details-background: var(--mud-palette-background);
    --salon-details-text-primary: var(--mud-palette-text-primary);
    --salon-details-text-secondary: var(--mud-palette-text-secondary);
    --salon-details-divider: var(--mud-palette-divider);
    padding-bottom: 4rem;
}

.salon-details-page[b-l2f3zzezq3]  .salon-details-loading-panel {
    padding: 1.25rem;
    border-radius: 24px;
    background: var(--salon-details-surface);
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 10%, var(--salon-details-divider));
    box-shadow: 0 16px 42px color-mix(in srgb, var(--salon-details-text-primary) 6%, transparent);
}

.salon-details-page[b-l2f3zzezq3]  .salon-details-error-alert {
    border-radius: 18px;
    box-shadow: 0 16px 40px color-mix(in srgb, var(--mud-palette-error) 16%, transparent);
}

.salon-details-page[b-l2f3zzezq3]  .salon-profile-hero {
    position: relative;
    overflow: hidden;
    padding: 2.45rem;
    border-radius: 36px;
    background: radial-gradient(circle at 88% 14%, color-mix(in srgb, var(--salon-details-secondary) 22%, transparent), transparent 30%), radial-gradient(circle at 12% 92%, color-mix(in srgb, var(--salon-details-primary) 16%, transparent), transparent 32%), linear-gradient(135deg, color-mix(in srgb, var(--salon-details-surface) 98%, var(--salon-details-primary)), var(--salon-details-surface) 52%, color-mix(in srgb, var(--salon-details-secondary) 8%, var(--salon-details-surface)));
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 12%, var(--salon-details-divider));
    box-shadow: 0 30px 76px color-mix(in srgb, var(--salon-details-primary) 12%, transparent);
}

    .salon-details-page[b-l2f3zzezq3]  .salon-profile-hero::before {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(112deg, color-mix(in srgb, var(--salon-details-surface) 78%, transparent), transparent 54%), radial-gradient(circle at 42% 14%, color-mix(in srgb, var(--salon-details-primary) 7%, transparent), transparent 25%);
        pointer-events: none;
    }

.salon-profile-hero-glow[b-l2f3zzezq3] {
    position: absolute;
    border-radius: 999px;
    pointer-events: none;
    filter: blur(10px);
}

.salon-profile-hero-glow-one[b-l2f3zzezq3] {
    top: 2.5rem;
    right: 8rem;
    width: 175px;
    height: 175px;
    background: color-mix(in srgb, var(--salon-details-secondary) 14%, transparent);
}

.salon-profile-hero-glow-two[b-l2f3zzezq3] {
    left: -4rem;
    bottom: -6rem;
    width: 310px;
    height: 310px;
    background: color-mix(in srgb, var(--salon-details-primary) 11%, transparent);
}

.salon-details-page[b-l2f3zzezq3]  .salon-profile-hero-grid {
    position: relative;
    z-index: 2;
    align-items: stretch;
}

.salon-details-page[b-l2f3zzezq3]  .salon-profile-hero-copy {
    position: relative;
    z-index: 3;
    height: 100%;
    justify-content: center;
}

.salon-details-page[b-l2f3zzezq3]  .salon-profile-badges {
    flex-wrap: wrap;
}

.salon-details-page[b-l2f3zzezq3]  .salon-profile-title {
    max-width: 720px;
    color: var(--salon-details-text-primary);
    font-size: clamp(2.05rem, 3.25vw, 3.15rem);
    font-weight: 950;
    line-height: 1.04;
    letter-spacing: -0.047em;
    text-wrap: balance;
    overflow-wrap: anywhere;
}

.salon-profile-location-line[b-l2f3zzezq3] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin-top: 0.78rem;
    padding: 0.62rem 0.9rem;
    color: var(--salon-details-secondary);
    font-size: 0.94rem;
    font-weight: 850;
    border-radius: 10px;
    background: color-mix(in srgb, var(--salon-details-secondary) 8%, var(--salon-details-surface));
    border: 1px solid color-mix(in srgb, var(--salon-details-secondary) 13%, var(--salon-details-divider));
}

.salon-details-page[b-l2f3zzezq3]  .salon-profile-location-line .mud-icon-root {
    color: var(--salon-details-secondary);
}

.salon-details-page[b-l2f3zzezq3]  .salon-profile-description {
    max-width: 710px;
    color: var(--salon-details-text-secondary);
    font-size: 1.02rem;
    line-height: 1.68;
    font-weight: 620;
}

.salon-profile-actions[b-l2f3zzezq3] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
}

.salon-details-page[b-l2f3zzezq3]  .salon-profile-actions .mud-button-root {
    min-height: 52px;
    border-radius: 10px !important;
    font-weight: 950;
    letter-spacing: 0.02em;
}

.salon-profile-trust-row[b-l2f3zzezq3] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

    .salon-profile-trust-row span[b-l2f3zzezq3] {
        display: inline-flex;
        align-items: center;
        gap: 0.38rem;
        padding: 0.58rem 0.78rem;
        color: var(--salon-details-text-primary);
        font-size: 0.82rem;
        font-weight: 850;
        border-radius: 10px;
        background: color-mix(in srgb, var(--salon-details-primary) 6%, var(--salon-details-surface));
        border: 1px solid color-mix(in srgb, var(--salon-details-primary) 9%, var(--salon-details-divider));
    }

.salon-details-page[b-l2f3zzezq3]  .salon-profile-trust-row .mud-icon-root {
    color: var(--salon-details-primary);
}

.salon-profile-preview-card[b-l2f3zzezq3] {
    position: relative;
    overflow: hidden;
    min-height: 100%;
    display: grid;
    gap: 1.25rem;
    align-content: space-between;
    padding: 1.45rem;
    border-radius: 32px;
    color: #ffffff;
    background: radial-gradient(circle at 86% 14%, color-mix(in srgb, var(--salon-details-secondary) 42%, transparent), transparent 34%), radial-gradient(circle at 12% 94%, color-mix(in srgb, var(--salon-details-primary) 36%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--salon-details-text-primary) 92%, var(--salon-details-primary)), var(--salon-details-primary) 56%, color-mix(in srgb, var(--salon-details-primary) 78%, var(--salon-details-secondary)));
    border: 1px solid color-mix(in srgb, var(--salon-details-surface) 16%, transparent);
    box-shadow: 0 24px 62px color-mix(in srgb, var(--salon-details-text-primary) 16%, transparent);
}

    .salon-profile-preview-card[b-l2f3zzezq3]::before {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(135deg, rgba(255,255,255,0.16), transparent 48%), repeating-linear-gradient(135deg, rgba(255,255,255,0.06) 0 1px, transparent 1px 18px);
        pointer-events: none;
    }

    .salon-profile-preview-card > *[b-l2f3zzezq3] {
        position: relative;
        z-index: 2;
    }

.salon-profile-preview-card-with-image[b-l2f3zzezq3] {
    background: linear-gradient(135deg, color-mix(in srgb, var(--salon-details-text-primary) 92%, var(--salon-details-primary)), var(--salon-details-primary));
}

.salon-profile-preview-image[b-l2f3zzezq3] {
    position: absolute !important;
    inset: 0;
    z-index: 0 !important;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.01);
    filter: saturate(1.05) contrast(1.02);
}

.salon-profile-preview-image-overlay[b-l2f3zzezq3] {
    position: absolute !important;
    inset: 0;
    z-index: 1 !important;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.20), rgba(15, 23, 42, 0.76)), radial-gradient(circle at 18% 12%, rgba(255, 255, 255, 0.16), transparent 28%), radial-gradient(circle at 84% 18%, color-mix(in srgb, var(--salon-details-secondary) 28%, transparent), transparent 30%);
    pointer-events: none;
}

.salon-profile-preview-card-with-image[b-l2f3zzezq3]::before {
    z-index: 2;
    background: linear-gradient(135deg, rgba(255,255,255,0.12), transparent 48%), repeating-linear-gradient(135deg, rgba(255,255,255,0.05) 0 1px, transparent 1px 18px);
}

.salon-profile-preview-card-with-image > *[b-l2f3zzezq3] {
    position: relative;
    z-index: 3;
}

.salon-profile-preview-card-with-image .salon-profile-preview-image[b-l2f3zzezq3],
.salon-profile-preview-card-with-image .salon-profile-preview-image-overlay[b-l2f3zzezq3] {
    position: absolute !important;
}

.salon-profile-preview-top[b-l2f3zzezq3] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.salon-profile-preview-initials[b-l2f3zzezq3] {
    width: 74px;
    height: 74px;
    display: grid;
    place-items: center;
    color: #ffffff;
    font-size: 1.35rem;
    font-weight: 950;
    letter-spacing: -0.04em;
    border-radius: 24px;
    background: rgba(255,255,255,0.18);
    border: 1px solid rgba(255,255,255,0.28);
    backdrop-filter: blur(14px);
    box-shadow: 0 18px 38px rgba(15, 23, 42, 0.26);
}

.salon-profile-preview-chips[b-l2f3zzezq3] {
    flex-wrap: wrap;
    justify-content: flex-end;
}

    .salon-profile-preview-chips span[b-l2f3zzezq3] {
        padding: 0.34rem 0.58rem;
        color: rgba(255,255,255,0.92);
        font-size: 0.68rem;
        font-weight: 950;
        text-transform: uppercase;
        letter-spacing: 0.07em;
        border-radius: 10px;
        background: rgba(255,255,255,0.15);
        border: 1px solid rgba(255,255,255,0.22);
    }

.salon-details-page[b-l2f3zzezq3]  .salon-profile-preview-label {
    color: rgba(255,255,255,0.78);
    font-weight: 950;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.salon-details-page[b-l2f3zzezq3]  .salon-profile-preview-name {
    color: #ffffff;
    font-weight: 950;
    line-height: 1.08;
    letter-spacing: -0.04em;
    text-wrap: balance;
    overflow-wrap: anywhere;
}

.salon-details-page[b-l2f3zzezq3]  .salon-profile-preview-location {
    color: rgba(255,255,255,0.82);
    font-weight: 700;
}

.salon-profile-preview-stats[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.7rem;
}

.salon-profile-preview-stat[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.22rem;
    padding: 0.78rem;
    border-radius: 18px;
    background: rgba(255,255,255,0.13);
    border: 1px solid rgba(255,255,255,0.18);
    backdrop-filter: blur(12px);
}

    .salon-profile-preview-stat strong[b-l2f3zzezq3] {
        color: #ffffff;
        font-size: 0.98rem;
        font-weight: 950;
        line-height: 1.12;
        overflow-wrap: anywhere;
    }

    .salon-profile-preview-stat span[b-l2f3zzezq3] {
        color: rgba(255,255,255,0.74);
        font-size: 0.68rem;
        font-weight: 850;
        line-height: 1.2;
    }

.salon-profile-preview-stat-price strong[b-l2f3zzezq3] {
    font-size: 0.92rem;
}

.salon-profile-preview-note[b-l2f3zzezq3] {
    padding: 0.95rem;
    color: rgba(255,255,255,0.86);
    font-size: 0.86rem;
    font-weight: 650;
    line-height: 1.45;
    border-radius: 20px;
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.18);
}

.salon-profile-content-grid[b-l2f3zzezq3] {
    align-items: flex-start;
}

.salon-details-page[b-l2f3zzezq3]  .salon-profile-panel {
    padding: 1.45rem;
    border-radius: 30px;
    background: radial-gradient(circle at 92% 12%, color-mix(in srgb, var(--salon-details-secondary) 7%, transparent), transparent 30%), var(--salon-details-surface);
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 9%, var(--salon-details-divider));
    box-shadow: 0 18px 46px color-mix(in srgb, var(--salon-details-text-primary) 7%, transparent);
}

.salon-details-page[b-l2f3zzezq3]  .media-panel {
    background: radial-gradient(circle at 90% 12%, color-mix(in srgb, var(--salon-details-secondary) 10%, transparent), transparent 30%), linear-gradient(135deg, color-mix(in srgb, var(--salon-details-surface) 96%, var(--salon-details-primary)), var(--salon-details-surface));
}

.salon-media-grid[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
}

.salon-media-card[b-l2f3zzezq3] {
    position: relative;
    overflow: hidden;
    min-height: 170px;
    margin: 0;
    border-radius: 24px;
    background: color-mix(in srgb, var(--salon-details-primary) 8%, var(--salon-details-surface));
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 10%, var(--salon-details-divider));
    box-shadow: 0 14px 34px color-mix(in srgb, var(--salon-details-text-primary) 7%, transparent);
}

.salon-media-card-primary[b-l2f3zzezq3] {
    grid-column: span 2;
    min-height: 260px;
}

.salon-media-card img[b-l2f3zzezq3] {
    width: 100%;
    min-height: 170px;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 180ms ease, filter 180ms ease;
}

.salon-media-card-primary img[b-l2f3zzezq3] {
    min-height: 260px;
}

.salon-media-card:hover img[b-l2f3zzezq3] {
    transform: scale(1.035);
    filter: saturate(1.07);
}

.salon-media-card[b-l2f3zzezq3]::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 50%, rgba(15, 23, 42, 0.52));
    pointer-events: none;
}

.salon-media-card figcaption[b-l2f3zzezq3] {
    position: absolute;
    left: 0.8rem;
    bottom: 0.75rem;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 0.28rem;
    padding: 0.38rem 0.58rem;
    color: #ffffff;
    font-size: 0.72rem;
    font-weight: 950;
    line-height: 1;
    border-radius: 10px;
    background: rgba(15, 23, 42, 0.52);
    border: 1px solid rgba(255,255,255,0.18);
    backdrop-filter: blur(12px);
}

.salon-details-page[b-l2f3zzezq3]  .salon-media-card figcaption .mud-icon-root {
    color: var(--salon-details-secondary);
    font-size: 0.9rem;
}

.salon-details-page[b-l2f3zzezq3]  .services-panel {
    background: radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--salon-details-primary) 9%, transparent), transparent 30%), radial-gradient(circle at 10% 94%, color-mix(in srgb, var(--salon-details-secondary) 8%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--salon-details-surface) 94%, var(--salon-details-primary)), color-mix(in srgb, var(--salon-details-surface) 91%, var(--salon-details-secondary)));
}

.salon-details-page[b-l2f3zzezq3]  .salon-section-header {
    gap: 1rem;
}

.salon-details-page[b-l2f3zzezq3]  .salon-section-title {
    color: var(--salon-details-text-primary);
    font-weight: 950;
    letter-spacing: -0.03em;
}

.salon-details-page[b-l2f3zzezq3]  .salon-section-subtitle {
    color: var(--salon-details-text-secondary);
    font-weight: 600;
}

.salon-service-list[b-l2f3zzezq3] {
    display: grid;
    gap: 1.15rem;
}

.salon-details-page[b-l2f3zzezq3]  .salon-service-card {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 1.35rem;
    align-items: center;
    padding: 1.55rem 1.75rem;
    cursor: pointer;
    outline: none;
    border-radius: 32px;
    background: radial-gradient(circle at 7% 12%, color-mix(in srgb, var(--salon-details-primary) 13%, transparent), transparent 28%), radial-gradient(circle at 94% 10%, color-mix(in srgb, var(--salon-details-secondary) 16%, transparent), transparent 34%), radial-gradient(circle at 86% 94%, color-mix(in srgb, var(--salon-details-primary) 9%, transparent), transparent 36%), linear-gradient(135deg, color-mix(in srgb, var(--salon-details-surface) 96%, white) 0%, color-mix(in srgb, var(--salon-details-primary) 5%, var(--salon-details-surface)) 48%, color-mix(in srgb, var(--salon-details-secondary) 6%, var(--salon-details-surface)) 100%);
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 18%, var(--salon-details-divider));
    box-shadow: 0 20px 48px color-mix(in srgb, var(--salon-details-text-primary) 8%, transparent), 0 8px 24px color-mix(in srgb, var(--salon-details-primary) 6%, transparent), inset 0 1px 0 rgba(255,255,255,0.82);
    transition: transform 170ms ease, box-shadow 170ms ease, border-color 170ms ease, background 170ms ease;
}

    .salon-details-page[b-l2f3zzezq3]  .salon-service-card::before {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(105deg, rgba(255,255,255,0.6) 0%, rgba(255,255,255,0.26) 36%, transparent 72%), linear-gradient(90deg, color-mix(in srgb, var(--salon-details-primary) 5%, transparent), transparent 30%, color-mix(in srgb, var(--salon-details-secondary) 6%, transparent));
        opacity: 1;
        pointer-events: none;
    }

    .salon-details-page[b-l2f3zzezq3]  .salon-service-card::after {
        content: "";
        position: absolute;
        right: -58px;
        bottom: -78px;
        width: 190px;
        height: 190px;
        border-radius: 999px;
        background: color-mix(in srgb, var(--salon-details-secondary) 9%, transparent);
        pointer-events: none;
        transition: transform 170ms ease, background 170ms ease;
    }

    .salon-details-page[b-l2f3zzezq3]  .salon-service-card:hover,
    .salon-details-page[b-l2f3zzezq3]  .salon-service-card:focus-visible {
        transform: translateY(-5px);
        border-color: color-mix(in srgb, var(--salon-details-primary) 38%, var(--salon-details-divider));
        box-shadow: 0 32px 76px color-mix(in srgb, var(--salon-details-primary) 16%, transparent), 0 12px 30px color-mix(in srgb, var(--salon-details-secondary) 9%, transparent), inset 0 1px 0 rgba(255,255,255,0.86);
    }

        .salon-details-page[b-l2f3zzezq3]  .salon-service-card:hover::after,
        .salon-details-page[b-l2f3zzezq3]  .salon-service-card:focus-visible::after {
            transform: scale(1.12);
            background: color-mix(in srgb, var(--salon-details-secondary) 12%, transparent);
        }

    .salon-details-page[b-l2f3zzezq3]  .salon-service-card:focus-visible {
        box-shadow: 0 0 0 4px color-mix(in srgb, var(--salon-details-primary) 16%, transparent), 0 32px 76px color-mix(in srgb, var(--salon-details-primary) 16%, transparent);
    }

.salon-details-page[b-l2f3zzezq3]  .salon-service-card-selected {
    border-color: color-mix(in srgb, var(--salon-details-success) 52%, var(--salon-details-divider));
    background: radial-gradient(circle at 7% 12%, color-mix(in srgb, var(--salon-details-success) 15%, transparent), transparent 28%), radial-gradient(circle at 94% 10%, color-mix(in srgb, var(--salon-details-secondary) 16%, transparent), transparent 34%), radial-gradient(circle at 86% 94%, color-mix(in srgb, var(--salon-details-primary) 9%, transparent), transparent 36%), linear-gradient(135deg, color-mix(in srgb, var(--salon-details-success) 9%, var(--salon-details-surface)) 0%, color-mix(in srgb, var(--salon-details-surface) 98%, white) 52%, color-mix(in srgb, var(--salon-details-secondary) 6%, var(--salon-details-surface)) 100%);
    box-shadow: 0 28px 68px color-mix(in srgb, var(--salon-details-success) 14%, transparent), 0 8px 24px color-mix(in srgb, var(--salon-details-primary) 8%, transparent), inset 0 1px 0 rgba(255,255,255,0.82);
}

    .salon-details-page[b-l2f3zzezq3]  .salon-service-card-selected::before {
        background: linear-gradient(105deg, rgba(255,255,255,0.62) 0%, rgba(255,255,255,0.28) 36%, transparent 72%), linear-gradient(90deg, color-mix(in srgb, var(--salon-details-success) 9%, transparent), transparent 30%, color-mix(in srgb, var(--salon-details-secondary) 6%, transparent));
    }

.salon-service-logo-mark[b-l2f3zzezq3] {
    position: relative;
    z-index: 2;
    width: 64px;
    height: 64px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 21px;
    background: transparent;
    box-shadow: 0 18px 38px color-mix(in srgb, var(--salon-details-primary) 14%, transparent), 0 6px 18px color-mix(in srgb, var(--salon-details-secondary) 9%, transparent);
    transition: transform 170ms ease, box-shadow 170ms ease;
}

    .salon-service-logo-mark img[b-l2f3zzezq3] {
        width: 64px;
        max-width: 64px;
        height: 64px;
        display: block;
        object-fit: contain;
        border-radius: 21px;
    }

.salon-details-page[b-l2f3zzezq3]  .salon-service-card:hover .salon-service-logo-mark,
.salon-details-page[b-l2f3zzezq3]  .salon-service-card:focus-visible .salon-service-logo-mark {
    transform: translateY(-2px) scale(1.04);
    box-shadow: 0 22px 48px color-mix(in srgb, var(--salon-details-primary) 18%, transparent), 0 8px 22px color-mix(in srgb, var(--salon-details-secondary) 11%, transparent);
}

.salon-service-card-copy[b-l2f3zzezq3] {
    position: relative;
    z-index: 2;
    min-width: 0;
    display: grid;
    gap: 0.55rem;
    padding-left: 0.15rem;
}

.salon-service-title-row[b-l2f3zzezq3] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.55rem;
    min-width: 0;
}

.salon-details-page[b-l2f3zzezq3]  .salon-service-name {
    color: var(--salon-details-text-primary);
    font-size: 1.1rem;
    font-weight: 950;
    line-height: 1.16;
    letter-spacing: -0.02em;
    overflow-wrap: anywhere;
}

.salon-service-selected-pill[b-l2f3zzezq3] {
    display: inline-flex;
    align-items: center;
    gap: 0.28rem;
    padding: 0.3rem 0.56rem;
    color: #ffffff;
    font-size: 0.72rem;
    font-weight: 950;
    line-height: 1;
    border-radius: 10px;
    background: var(--salon-details-success);
    box-shadow: 0 10px 22px color-mix(in srgb, var(--salon-details-success) 20%, transparent);
}

.salon-details-page[b-l2f3zzezq3]  .salon-service-selected-pill .mud-icon-root {
    color: #ffffff;
    font-size: 0.92rem;
}

.salon-details-page[b-l2f3zzezq3]  .salon-service-description {
    max-width: 560px;
    color: var(--salon-details-text-secondary);
    font-size: 0.9rem;
    line-height: 1.52;
    font-weight: 650;
}

.salon-service-meta[b-l2f3zzezq3] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.52rem;
    padding-top: 0.08rem;
}

    .salon-service-meta span[b-l2f3zzezq3] {
        display: inline-flex;
        align-items: center;
        gap: 0.32rem;
        padding: 0.46rem 0.68rem;
        color: var(--salon-details-text-primary);
        font-size: 0.75rem;
        font-weight: 850;
        border-radius: 10px;
        background: linear-gradient(180deg, rgba(255,255,255,0.62), rgba(255,255,255,0.34)), color-mix(in srgb, var(--salon-details-primary) 7%, var(--salon-details-surface));
        border: 1px solid color-mix(in srgb, var(--salon-details-primary) 13%, var(--salon-details-divider));
        box-shadow: 0 8px 18px color-mix(in srgb, var(--salon-details-primary) 4%, transparent);
    }

.salon-details-page[b-l2f3zzezq3]  .salon-service-meta .mud-icon-root {
    color: var(--salon-details-primary);
}

.salon-service-card-side[b-l2f3zzezq3] {
    position: relative;
    z-index: 2;
    min-width: 142px;
    display: grid;
    justify-items: end;
    gap: 0.42rem;
    padding-left: 1.25rem;
}

    .salon-service-card-side strong[b-l2f3zzezq3] {
        color: var(--salon-details-text-primary);
        font-size: 1.1rem;
        font-weight: 950;
        line-height: 1.1;
        letter-spacing: -0.02em;
        overflow-wrap: anywhere;
        text-align: right;
    }

.salon-service-select-hint[b-l2f3zzezq3] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    padding: 0.36rem 0.66rem;
    color: var(--salon-details-primary);
    font-size: 0.7rem;
    font-weight: 950;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    border-radius: 10px;
    background: linear-gradient(180deg, rgba(255,255,255,0.66), rgba(255,255,255,0.36)), color-mix(in srgb, var(--salon-details-primary) 8%, var(--salon-details-surface));
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 10%, var(--salon-details-divider));
    box-shadow: 0 8px 18px color-mix(in srgb, var(--salon-details-primary) 5%, transparent);
}

.salon-service-card-selected .salon-service-select-hint[b-l2f3zzezq3] {
    color: var(--salon-details-success);
    background: linear-gradient(180deg, rgba(255,255,255,0.66), rgba(255,255,255,0.36)), color-mix(in srgb, var(--salon-details-success) 9%, var(--salon-details-surface));
    border-color: color-mix(in srgb, var(--salon-details-success) 14%, var(--salon-details-divider));
}

.salon-profile-empty-block[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.9rem;
    align-items: center;
    padding: 1rem;
    border-radius: 24px;
    background: color-mix(in srgb, var(--salon-details-primary) 6%, var(--salon-details-surface));
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 9%, var(--salon-details-divider));
}

.salon-profile-empty-icon[b-l2f3zzezq3] {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border-radius: 20px;
    background: linear-gradient(135deg, var(--salon-details-primary), var(--salon-details-secondary));
    box-shadow: 0 14px 30px color-mix(in srgb, var(--salon-details-primary) 18%, transparent);
}

.salon-details-page[b-l2f3zzezq3]  .salon-profile-empty-icon .mud-icon-root {
    color: #ffffff;
    font-size: 1.45rem;
}

.salon-details-page[b-l2f3zzezq3]  .salon-profile-empty-title {
    color: var(--salon-details-text-primary);
    font-weight: 950;
}

.salon-details-page[b-l2f3zzezq3]  .salon-profile-empty-text {
    color: var(--salon-details-text-secondary);
    line-height: 1.55;
    font-weight: 560;
}

.salon-professional-grid[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
}

.salon-professional-card[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.85rem;
    padding: 1rem;
    border-radius: 24px;
    background: radial-gradient(circle at 92% 12%, color-mix(in srgb, var(--salon-details-secondary) 8%, transparent), transparent 32%), color-mix(in srgb, var(--salon-details-surface) 96%, transparent);
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 9%, var(--salon-details-divider));
    box-shadow: 0 12px 30px color-mix(in srgb, var(--salon-details-text-primary) 5%, transparent);
}

.salon-professional-avatar[b-l2f3zzezq3] {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    color: #ffffff;
    font-size: 0.96rem;
    font-weight: 950;
    letter-spacing: -0.04em;
    border-radius: 20px;
    background: linear-gradient(135deg, var(--salon-details-secondary), var(--salon-details-primary));
    box-shadow: 0 14px 30px color-mix(in srgb, var(--salon-details-secondary) 18%, transparent);
}

.salon-professional-copy[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.18rem;
}

    .salon-professional-copy strong[b-l2f3zzezq3] {
        color: var(--salon-details-text-primary);
        font-size: 1rem;
        font-weight: 950;
        line-height: 1.16;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .salon-professional-copy small[b-l2f3zzezq3] {
        color: var(--salon-details-secondary);
        font-size: 0.78rem;
        font-weight: 850;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .salon-professional-copy p[b-l2f3zzezq3] {
        margin: 0.35rem 0 0;
        color: var(--salon-details-text-secondary);
        font-size: 0.84rem;
        line-height: 1.45;
        font-weight: 560;
    }

.salon-details-page[b-l2f3zzezq3]  .booking-side-column {
    position: sticky;
    top: 96px;
}

.salon-location-icon[b-l2f3zzezq3] {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border-radius: 18px;
    background: color-mix(in srgb, var(--salon-details-primary) 9%, var(--salon-details-surface));
    box-shadow: 0 12px 24px color-mix(in srgb, var(--salon-details-primary) 10%, transparent);
}

.salon-details-page[b-l2f3zzezq3]  .salon-location-icon .mud-icon-root {
    color: var(--salon-details-primary);
    font-size: 1.32rem;
}

.salon-location-card[b-l2f3zzezq3] {
    display: grid;
    gap: 0.28rem;
    padding: 0.95rem;
    border-radius: 22px;
    background: color-mix(in srgb, var(--salon-details-primary) 6%, var(--salon-details-surface));
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 9%, var(--salon-details-divider));
}

    .salon-location-card strong[b-l2f3zzezq3] {
        color: var(--salon-details-text-primary);
        font-size: 0.96rem;
        font-weight: 950;
        line-height: 1.35;
    }

    .salon-location-card span[b-l2f3zzezq3] {
        color: var(--salon-details-text-secondary);
        font-size: 0.86rem;
        font-weight: 700;
    }

html[b-l2f3zzezq3] {
    scroll-behavior: smooth;
}

@media (max-width: 1100px) {
    .salon-details-page[b-l2f3zzezq3]  .booking-side-column {
        position: static;
    }
}

@media (max-width: 960px) {
    .salon-details-page[b-l2f3zzezq3]  .salon-profile-hero {
        padding: 2rem;
        border-radius: 30px;
    }

    .salon-profile-preview-card[b-l2f3zzezq3] {
        min-height: 420px;
    }

    .salon-details-page[b-l2f3zzezq3]  .salon-section-header {
        flex-direction: column;
        align-items: flex-start !important;
    }

    .salon-details-page[b-l2f3zzezq3]  .salon-profile-title {
        font-size: clamp(2rem, 7vw, 2.7rem);
    }
}

@media (max-width: 760px) {
    .salon-media-grid[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
    }

    .salon-media-card-primary[b-l2f3zzezq3] {
        grid-column: auto;
        min-height: 220px;
    }

        .salon-media-card-primary img[b-l2f3zzezq3] {
            min-height: 220px;
        }

    .salon-details-page[b-l2f3zzezq3]  .salon-service-card {
        grid-template-columns: auto minmax(0, 1fr);
        padding: 1.2rem;
    }

    .salon-service-card-side[b-l2f3zzezq3] {
        grid-column: 1 / -1;
        min-width: 0;
        justify-items: start;
        padding-left: 0;
        padding-top: 0.85rem;
    }

        .salon-service-card-side strong[b-l2f3zzezq3] {
            text-align: left;
        }

    .salon-professional-grid[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
    }

    .salon-profile-preview-stats[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .salon-details-page[b-l2f3zzezq3] {
        padding-bottom: 2.5rem;
    }

        .salon-details-page[b-l2f3zzezq3]  .salon-profile-hero,
        .salon-details-page[b-l2f3zzezq3]  .salon-profile-panel,
        .salon-details-page[b-l2f3zzezq3]  .salon-details-loading-panel {
            padding: 1rem;
            border-radius: 24px;
        }

        .salon-details-page[b-l2f3zzezq3]  .salon-profile-title {
            font-size: 2.02rem;
            line-height: 1.08;
            letter-spacing: -0.04em;
        }

        .salon-details-page[b-l2f3zzezq3]  .salon-profile-description {
            font-size: 0.98rem;
        }

    .salon-profile-actions[b-l2f3zzezq3] {
        display: grid;
    }

    .salon-details-page[b-l2f3zzezq3]  .salon-profile-actions .mud-button-root {
        width: 100%;
    }

    .salon-profile-trust-row[b-l2f3zzezq3] {
        display: grid;
    }

    .salon-profile-preview-card[b-l2f3zzezq3] {
        min-height: 0;
        padding: 1rem;
        border-radius: 24px;
    }

    .salon-profile-preview-card-with-image[b-l2f3zzezq3] {
        min-height: 360px;
    }

    .salon-media-card[b-l2f3zzezq3],
    .salon-media-card img[b-l2f3zzezq3],
    .salon-media-card-primary[b-l2f3zzezq3],
    .salon-media-card-primary img[b-l2f3zzezq3] {
        min-height: 190px;
    }

    .salon-details-page[b-l2f3zzezq3]  .salon-service-card {
        grid-template-columns: 1fr;
        padding: 1rem;
        border-radius: 24px;
    }

    .salon-service-card-side[b-l2f3zzezq3] {
        grid-column: auto;
    }

    .salon-service-logo-mark[b-l2f3zzezq3],
    .salon-profile-empty-icon[b-l2f3zzezq3],
    .salon-professional-avatar[b-l2f3zzezq3] {
        width: 52px;
        height: 52px;
        border-radius: 17px;
    }

        .salon-service-logo-mark img[b-l2f3zzezq3] {
            width: 52px;
            max-width: 52px;
            height: 52px;
            border-radius: 17px;
        }

    .salon-service-card-copy[b-l2f3zzezq3] {
        padding-left: 0;
    }

    .salon-profile-empty-block[b-l2f3zzezq3],
    .salon-professional-card[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
    }
}


/* BB-MEDIA-03 public service portfolio image presentation */
.salon-details-page[b-l2f3zzezq3]  .salon-service-media {
    position: relative;
    z-index: 2;
    width: 124px;
    height: 108px;
    overflow: hidden;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 24px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--salon-details-primary) 9%, var(--salon-details-surface)), color-mix(in srgb, var(--salon-details-secondary) 8%, var(--salon-details-surface)));
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 12%, var(--salon-details-divider));
    box-shadow: 0 18px 38px color-mix(in srgb, var(--salon-details-primary) 14%, transparent), 0 6px 18px color-mix(in srgb, var(--salon-details-secondary) 9%, transparent);
    transition: transform 170ms ease, box-shadow 170ms ease;
}

    .salon-details-page[b-l2f3zzezq3]  .salon-service-media img {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
    }

.salon-details-page[b-l2f3zzezq3]  .salon-service-media-empty {
    width: 64px;
    height: 64px;
    background: transparent;
    border: 0;
}

    .salon-details-page[b-l2f3zzezq3]  .salon-service-media-empty img {
        width: 64px;
        max-width: 64px;
        height: 64px;
        object-fit: contain;
        border-radius: 21px;
    }

.salon-details-page[b-l2f3zzezq3]  .salon-service-media-with-image img {
    transform: scale(1.01);
    filter: saturate(1.04) contrast(1.02);
    transition: transform 180ms ease, filter 180ms ease;
}

.salon-details-page[b-l2f3zzezq3]  .salon-service-card:hover .salon-service-media,
.salon-details-page[b-l2f3zzezq3]  .salon-service-card:focus-visible .salon-service-media {
    transform: translateY(-2px) scale(1.025);
    box-shadow: 0 24px 52px color-mix(in srgb, var(--salon-details-primary) 18%, transparent), 0 8px 24px color-mix(in srgb, var(--salon-details-secondary) 12%, transparent);
}

.salon-details-page[b-l2f3zzezq3]  .salon-service-card:hover .salon-service-media-with-image img,
.salon-details-page[b-l2f3zzezq3]  .salon-service-card:focus-visible .salon-service-media-with-image img {
    transform: scale(1.06);
    filter: brightness(1.05) saturate(1.08);
}

.salon-service-media-shade[b-l2f3zzezq3] {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.04), rgba(15, 23, 42, 0.56));
    pointer-events: none;
}

.salon-service-media-count[b-l2f3zzezq3] {
    position: absolute;
    left: 0.62rem;
    right: 0.62rem;
    bottom: 0.58rem;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.28rem;
    padding: 0.36rem 0.48rem;
    color: #ffffff;
    font-size: 0.7rem;
    font-weight: 950;
    line-height: 1;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.56);
    border: 1px solid rgba(255,255,255,0.18);
    backdrop-filter: blur(12px);
}

.salon-details-page[b-l2f3zzezq3]  .salon-service-media-count .mud-icon-root {
    color: var(--salon-details-secondary);
    font-size: 0.9rem;
}

.salon-service-mini-gallery[b-l2f3zzezq3] {
    display: flex;
    align-items: center;
    gap: 0.38rem;
    padding-top: 0.1rem;
}

    .salon-service-mini-gallery img[b-l2f3zzezq3] {
        width: 44px;
        height: 34px;
        display: block;
        object-fit: cover;
        border-radius: 10px;
        border: 1px solid color-mix(in srgb, var(--salon-details-primary) 12%, var(--salon-details-divider));
        box-shadow: 0 8px 16px color-mix(in srgb, var(--salon-details-text-primary) 5%, transparent);
    }

@media (max-width: 760px) {
    .salon-details-page[b-l2f3zzezq3]  .salon-service-media {
        width: 96px;
        height: 86px;
    }

    .salon-details-page[b-l2f3zzezq3]  .salon-service-media-empty {
        width: 52px;
        height: 52px;
    }

        .salon-details-page[b-l2f3zzezq3]  .salon-service-media-empty img {
            width: 52px;
            max-width: 52px;
            height: 52px;
            border-radius: 17px;
        }

    .salon-service-media-count[b-l2f3zzezq3] {
        left: 0.46rem;
        right: 0.46rem;
        bottom: 0.44rem;
        font-size: 0.64rem;
        padding: 0.3rem 0.38rem;
    }
}

@media (max-width: 600px) {
    .salon-details-page[b-l2f3zzezq3]  .salon-service-media {
        width: 100%;
        height: 170px;
        border-radius: 22px;
    }

    .salon-details-page[b-l2f3zzezq3]  .salon-service-media-empty {
        width: 52px;
        height: 52px;
    }

    .salon-service-mini-gallery img[b-l2f3zzezq3] {
        width: 40px;
        height: 32px;
    }
}


/* BB-BOOKING-UX-01 service pagination polish */
.salon-service-pagination[b-l2f3zzezq3] {
    display: grid;
    gap: 0.95rem;
    padding: 1rem;
    border-radius: 26px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--salon-details-primary) 5%, var(--salon-details-surface)), color-mix(in srgb, var(--salon-details-secondary) 5%, var(--salon-details-surface)));
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 12%, var(--salon-details-divider));
    box-shadow: 0 14px 34px color-mix(in srgb, var(--salon-details-text-primary) 5%, transparent);
}

.salon-service-pagination-summary[b-l2f3zzezq3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    min-width: 0;
}

    .salon-service-pagination-summary span[b-l2f3zzezq3] {
        color: var(--salon-details-text-secondary);
        font-size: 0.82rem;
        font-weight: 760;
        line-height: 1.35;
    }

    .salon-service-pagination-summary strong[b-l2f3zzezq3] {
        color: var(--salon-details-text-primary);
        font-size: 0.82rem;
        font-weight: 950;
        line-height: 1.2;
        white-space: nowrap;
    }

.salon-service-pagination-actions[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.72rem;
    align-items: center;
}

.salon-service-pagination-pages[b-l2f3zzezq3] {
    min-width: 0;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.46rem;
}

.salon-service-pagination-button[b-l2f3zzezq3],
.salon-service-page-button[b-l2f3zzezq3] {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.34rem;
    color: var(--salon-details-primary);
    font-family: inherit;
    font-size: 0.78rem;
    font-weight: 950;
    line-height: 1;
    border-radius: 999px;
    background: color-mix(in srgb, var(--salon-details-surface) 94%, transparent);
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 14%, var(--salon-details-divider));
    box-shadow: 0 8px 18px color-mix(in srgb, var(--salon-details-text-primary) 4%, transparent);
    cursor: pointer;
    transition: transform 160ms ease, border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.salon-service-pagination-button[b-l2f3zzezq3] {
    padding: 0 0.88rem;
}

.salon-service-page-button[b-l2f3zzezq3] {
    width: 40px;
    padding: 0;
}

    .salon-service-pagination-button:hover:not(:disabled)[b-l2f3zzezq3],
    .salon-service-pagination-button:focus-visible:not(:disabled)[b-l2f3zzezq3],
    .salon-service-page-button:hover[b-l2f3zzezq3],
    .salon-service-page-button:focus-visible[b-l2f3zzezq3] {
        transform: translateY(-1px);
        border-color: color-mix(in srgb, var(--salon-details-primary) 30%, var(--salon-details-divider));
        background: color-mix(in srgb, var(--salon-details-primary) 8%, var(--salon-details-surface));
        box-shadow: 0 14px 28px color-mix(in srgb, var(--salon-details-primary) 8%, transparent);
        outline: none;
    }

.salon-service-page-button-active[b-l2f3zzezq3] {
    color: #ffffff;
    background: linear-gradient(135deg, var(--salon-details-primary), color-mix(in srgb, var(--salon-details-primary) 82%, var(--salon-details-secondary)));
    border-color: color-mix(in srgb, var(--salon-details-primary) 58%, var(--salon-details-secondary));
    box-shadow: 0 16px 34px color-mix(in srgb, var(--salon-details-primary) 16%, transparent);
}

.salon-service-pagination-button:disabled[b-l2f3zzezq3] {
    cursor: not-allowed;
    opacity: 0.48;
    transform: none;
    box-shadow: none;
}

.salon-details-page[b-l2f3zzezq3]  .salon-service-pagination-button .mud-icon-root {
    color: inherit;
    font-size: 1.05rem;
}

@media (max-width: 760px) {
    .salon-service-pagination-actions[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
    }

    .salon-service-pagination-button[b-l2f3zzezq3] {
        width: 100%;
    }

    .salon-service-pagination-summary[b-l2f3zzezq3] {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* BB-PUBLIC-PROFILE-UX-01 fullscreen image affordance */
.salon-image-expand-button[b-l2f3zzezq3] {
    position: absolute;
    right: 0.72rem;
    bottom: 0.72rem;
    z-index: 4;
    width: 38px;
    height: 38px;
    display: inline-grid;
    place-items: center;
    color: #ffffff;
    background: rgba(15, 23, 42, 0.66);
    border: 1px solid rgba(255,255,255,0.22);
    border-radius: 12px;
    box-shadow: 0 12px 26px rgba(15, 23, 42, 0.24);
    backdrop-filter: blur(14px);
    cursor: pointer;
    transition: transform 150ms ease, background 150ms ease, border-color 150ms ease, box-shadow 150ms ease;
}

    .salon-image-expand-button:hover[b-l2f3zzezq3],
    .salon-image-expand-button:focus-visible[b-l2f3zzezq3] {
        transform: translateY(-1px) scale(1.04);
        background: color-mix(in srgb, var(--salon-details-primary) 82%, rgba(15, 23, 42, 0.74));
        border-color: rgba(255,255,255,0.34);
        box-shadow: 0 16px 34px color-mix(in srgb, var(--salon-details-primary) 22%, transparent);
        outline: none;
    }

.salon-details-page[b-l2f3zzezq3]  .salon-image-expand-button .mud-icon-root {
    color: #ffffff !important;
    font-size: 1rem;
}

.salon-profile-preview-expand-button[b-l2f3zzezq3] {
    right: 1rem;
    bottom: 1rem;
}

.salon-service-media-expand-button[b-l2f3zzezq3] {
    right: 0.5rem;
    bottom: 0.5rem;
    width: 32px;
    height: 32px;
    border-radius: 10px;
}

.salon-service-media-count + .salon-service-media-expand-button[b-l2f3zzezq3] {
    top: 0.5rem;
    bottom: auto;
}

.salon-service-mini-gallery-image-button[b-l2f3zzezq3] {
    position: relative;
    overflow: hidden;
    width: 44px;
    height: 34px;
    padding: 0;
    border: 0;
    border-radius: 10px;
    background: transparent;
    cursor: pointer;
    box-shadow: 0 8px 16px color-mix(in srgb, var(--salon-details-text-primary) 5%, transparent);
}

    .salon-service-mini-gallery-image-button img[b-l2f3zzezq3] {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
        border-radius: inherit;
        border: 1px solid color-mix(in srgb, var(--salon-details-primary) 12%, var(--salon-details-divider));
        transition: transform 150ms ease, filter 150ms ease;
    }

    .salon-service-mini-gallery-image-button span[b-l2f3zzezq3] {
        position: absolute;
        right: 0.22rem;
        bottom: 0.22rem;
        z-index: 2;
        width: 16px;
        height: 16px;
        display: grid;
        place-items: center;
        color: #ffffff;
        background: rgba(15, 23, 42, 0.68);
        border: 1px solid rgba(255,255,255,0.2);
        border-radius: 6px;
        backdrop-filter: blur(8px);
    }

    .salon-service-mini-gallery-image-button:hover img[b-l2f3zzezq3],
    .salon-service-mini-gallery-image-button:focus-visible img[b-l2f3zzezq3] {
        transform: scale(1.05);
        filter: saturate(1.08);
    }

    .salon-service-mini-gallery-image-button:focus-visible[b-l2f3zzezq3] {
        outline: 2px solid color-mix(in srgb, var(--salon-details-secondary) 70%, #ffffff);
        outline-offset: 2px;
    }

.salon-details-page[b-l2f3zzezq3]  .salon-service-mini-gallery-image-button .mud-icon-root {
    color: #ffffff !important;
    font-size: 0.68rem;
}

.salon-service-mini-gallery img[b-l2f3zzezq3] {
    box-shadow: none;
}

@media (max-width: 600px) {
    .salon-image-expand-button[b-l2f3zzezq3] {
        width: 36px;
        height: 36px;
        right: 0.6rem;
        bottom: 0.6rem;
    }

    .salon-service-mini-gallery-image-button[b-l2f3zzezq3] {
        width: 40px;
        height: 32px;
    }
}


/* BB-PUBLIC-PROFILE-UX-01 v02 make fullscreen affordance visible */
.salon-image-expand-button[b-l2f3zzezq3] {
    width: auto !important;
    min-width: 38px !important;
    height: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.34rem !important;
    padding: 0 0.62rem !important;
}

    .salon-image-expand-button span[b-l2f3zzezq3] {
        color: #ffffff;
        font-size: 0.68rem;
        font-weight: 950;
        line-height: 1;
        letter-spacing: 0.035em;
        text-transform: uppercase;
    }

.salon-service-media-expand-button[b-l2f3zzezq3] {
    width: auto !important;
    min-width: 32px !important;
    height: 32px !important;
    padding: 0 0.48rem !important;
    border-radius: 10px !important;
}

    .salon-service-media-expand-button span[b-l2f3zzezq3] {
        font-size: 0.6rem;
    }

.salon-details-lightbox-hint[b-l2f3zzezq3] {
    width: fit-content;
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    gap: 0.42rem;
    margin-top: 0.25rem;
    padding: 0.44rem 0.64rem;
    color: var(--salon-details-text-primary);
    font-size: 0.76rem;
    font-weight: 850;
    line-height: 1.25;
    border-radius: 999px;
    background: color-mix(in srgb, var(--salon-details-primary) 7%, var(--salon-details-surface));
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 12%, var(--salon-details-divider));
}

    .salon-details-lightbox-hint .mud-icon-root[b-l2f3zzezq3] {
        color: var(--salon-details-secondary);
    }

@media (max-width: 600px) {
    .salon-image-expand-button span[b-l2f3zzezq3] {
        display: none;
    }

    .salon-image-expand-button[b-l2f3zzezq3] {
        width: 36px !important;
        min-width: 36px !important;
        padding: 0 !important;
    }
}


/* BB-SALON-ADDRESS-VERIFY-01 public map action polish */
.salon-details-page[b-l2f3zzezq3]  .location-panel .mud-button-filled-primary {
    min-height: 46px;
    border-radius: 12px;
    font-weight: 950;
}

/* BB-PUBLIC-SALON-LOCATION-01 verified public location card */
.salon-location-card[b-l2f3zzezq3] {
    position: relative;
    overflow: hidden;
    display: grid;
    gap: 0.85rem;
    padding: 1rem;
    border-radius: 24px;
    background: radial-gradient(circle at 92% 12%, color-mix(in srgb, var(--salon-details-secondary) 8%, transparent), transparent 32%), color-mix(in srgb, var(--salon-details-primary) 6%, var(--salon-details-surface));
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 9%, var(--salon-details-divider));
    box-shadow: 0 12px 30px color-mix(in srgb, var(--salon-details-text-primary) 5%, transparent);
}

    .salon-location-card[b-l2f3zzezq3]::before {
        content: "";
        position: absolute;
        inset: 0 auto 0 0;
        width: 4px;
        background: linear-gradient(180deg, var(--salon-details-primary), var(--salon-details-secondary));
        pointer-events: none;
    }

.salon-location-card-verified[b-l2f3zzezq3] {
    background: radial-gradient(circle at 92% 12%, color-mix(in srgb, var(--salon-details-success) 10%, transparent), transparent 32%), radial-gradient(circle at 8% 92%, color-mix(in srgb, var(--salon-details-secondary) 8%, transparent), transparent 30%), color-mix(in srgb, var(--salon-details-surface) 96%, transparent);
    border-color: color-mix(in srgb, var(--salon-details-success) 18%, var(--salon-details-divider));
}

    .salon-location-card-verified[b-l2f3zzezq3]::before {
        background: linear-gradient(180deg, var(--salon-details-success), var(--salon-details-secondary));
    }

.salon-location-card-header[b-l2f3zzezq3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
    min-width: 0;
}

.salon-location-status-pill[b-l2f3zzezq3] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 0.36rem;
    padding: 0.4rem 0.66rem;
    color: var(--salon-details-primary);
    font-size: 0.68rem;
    font-weight: 950;
    line-height: 1;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    border-radius: 999px;
    background: color-mix(in srgb, var(--salon-details-primary) 8%, var(--salon-details-surface));
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 10%, var(--salon-details-divider));
}

.salon-location-status-pill-verified[b-l2f3zzezq3] {
    color: var(--salon-details-success);
    background: color-mix(in srgb, var(--salon-details-success) 10%, var(--salon-details-surface));
    border-color: color-mix(in srgb, var(--salon-details-success) 15%, var(--salon-details-divider));
}

.salon-details-page[b-l2f3zzezq3]  .salon-location-status-pill .mud-icon-root {
    color: currentColor;
    font-size: 0.94rem;
}

.salon-location-address-block[b-l2f3zzezq3] {
    display: grid;
    gap: 0.22rem;
    min-width: 0;
}

    .salon-location-address-block strong[b-l2f3zzezq3] {
        color: var(--salon-details-text-primary);
        font-size: 1.02rem;
        font-weight: 950;
        line-height: 1.28;
        overflow-wrap: anywhere;
    }

    .salon-location-address-block span[b-l2f3zzezq3],
    .salon-location-address-block small[b-l2f3zzezq3] {
        color: var(--salon-details-text-secondary);
        font-size: 0.88rem;
        font-weight: 720;
        line-height: 1.36;
        overflow-wrap: anywhere;
    }

    .salon-location-address-block small[b-l2f3zzezq3] {
        color: color-mix(in srgb, var(--salon-details-secondary) 78%, var(--salon-details-text-secondary));
        font-size: 0.78rem;
        font-weight: 850;
    }

.salon-location-map-note[b-l2f3zzezq3] {
    display: flex;
    align-items: flex-start;
    gap: 0.45rem;
    padding: 0.65rem 0.72rem;
    color: var(--salon-details-text-primary);
    font-size: 0.78rem;
    font-weight: 760;
    line-height: 1.35;
    border-radius: 16px;
    background: color-mix(in srgb, var(--salon-details-surface) 72%, transparent);
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 8%, var(--salon-details-divider));
}

.salon-details-page[b-l2f3zzezq3]  .salon-location-map-note .mud-icon-root {
    flex: 0 0 auto;
    color: var(--salon-details-secondary);
    margin-top: 0.05rem;
}

@media (max-width: 600px) {
    .salon-location-card[b-l2f3zzezq3] {
        padding: 0.9rem;
        border-radius: 20px;
    }

    .salon-location-status-pill[b-l2f3zzezq3] {
        max-width: 100%;
        white-space: normal;
        line-height: 1.2;
    }
}

/* BB-PUBLIC-SALON-MAP-DISTANCE-01 salon map preview + distance guard */
.salon-location-map-shell[b-l2f3zzezq3] {
    position: relative;
    overflow: hidden;
    min-height: 245px;
    border-radius: 22px;
    background: radial-gradient(circle at 88% 14%, color-mix(in srgb, var(--salon-details-secondary) 12%, transparent), transparent 32%), color-mix(in srgb, var(--salon-details-primary) 5%, var(--salon-details-surface));
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 10%, var(--salon-details-divider));
    box-shadow: inset 0 1px 0 color-mix(in srgb, white 38%, transparent), 0 12px 28px color-mix(in srgb, var(--salon-details-primary) 7%, transparent);
}

.salon-location-map-preview[b-l2f3zzezq3] {
    position: relative;
    width: 100%;
    min-height: 245px;
    height: 245px;
    overflow: hidden;
    border-radius: inherit;
    isolation: isolate;
}

.salon-location-map-placeholder[b-l2f3zzezq3],
.salon-location-map-unavailable[b-l2f3zzezq3] {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    gap: 0.5rem;
    padding: 1rem;
    color: var(--salon-details-text-secondary);
    font-size: 0.82rem;
    font-weight: 800;
    text-align: center;
    background: radial-gradient(circle at 50% 30%, color-mix(in srgb, var(--salon-details-secondary) 10%, transparent), transparent 34%), color-mix(in srgb, var(--salon-details-surface) 92%, transparent);
}

.salon-location-map-unavailable[b-l2f3zzezq3] {
    color: var(--salon-details-text-primary);
}

.salon-location-distance-note[b-l2f3zzezq3] {
    display: flex;
    align-items: flex-start;
    gap: 0.45rem;
    padding: 0.65rem 0.72rem;
    color: var(--salon-details-text-primary);
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1.35;
    border-radius: 16px;
    background: color-mix(in srgb, var(--salon-details-success) 8%, var(--salon-details-surface));
    border: 1px solid color-mix(in srgb, var(--salon-details-success) 16%, var(--salon-details-divider));
}

.salon-location-distance-note-warning[b-l2f3zzezq3] {
    background: color-mix(in srgb, var(--salon-details-warning) 9%, var(--salon-details-surface));
    border-color: color-mix(in srgb, var(--salon-details-warning) 18%, var(--salon-details-divider));
}

.salon-details-page[b-l2f3zzezq3]  .salon-location-distance-note .mud-icon-root {
    flex: 0 0 auto;
    color: var(--salon-details-success);
    margin-top: 0.05rem;
}

.salon-details-page[b-l2f3zzezq3]  .salon-location-distance-note-warning .mud-icon-root {
    color: var(--salon-details-warning);
}

.salon-details-page[b-l2f3zzezq3]  .salon-location-map-alert {
    border-radius: 16px;
}

.salon-details-page[b-l2f3zzezq3]  .location-panel .mud-button-outlined-secondary {
    min-height: 44px;
    border-radius: 12px;
    font-weight: 950;
}

.salon-details-page[b-l2f3zzezq3]  .salon-location-map-preview .leaflet-container,
.salon-location-map-preview.leaflet-container[b-l2f3zzezq3] {
    width: 100%;
    height: 100%;
    font-family: inherit;
    background: color-mix(in srgb, var(--salon-details-primary) 5%, var(--salon-details-surface));
}

.salon-details-page[b-l2f3zzezq3]  .salon-location-map-preview .leaflet-control-zoom a {
    color: var(--salon-details-primary);
    font-weight: 950;
}

@media (max-width: 600px) {
    .salon-location-map-shell[b-l2f3zzezq3],
    .salon-location-map-preview[b-l2f3zzezq3] {
        min-height: 190px;
        height: 190px;
        border-radius: 18px;
    }
}


/* BB-PUBLIC-SALON-MAP-DISTANCE-01A v2 map readability polish */
.salon-details-page[b-l2f3zzezq3]  .location-panel .mud-button-root {
    min-height: 44px;
    border-radius: 12px !important;
    font-family: inherit;
    font-weight: 950;
    letter-spacing: 0.025em;
}

.salon-details-page[b-l2f3zzezq3]  .location-panel .mud-button-filled-primary .mud-button-label,
.salon-details-page[b-l2f3zzezq3]  .location-panel .mud-button-filled-primary .mud-icon-root {
    color: #ffffff !important;
}

.salon-details-page[b-l2f3zzezq3]  .salon-location-map-preview .leaflet-popup-content-wrapper,
.salon-details-page[b-l2f3zzezq3]  .salon-location-map-preview .leaflet-popup-content,
.salon-details-page[b-l2f3zzezq3]  .salon-location-map-preview .leaflet-popup-content * {
    font-family: inherit !important;
}

@media (max-width: 600px) {
    .salon-location-map-shell[b-l2f3zzezq3],
    .salon-location-map-preview[b-l2f3zzezq3] {
        min-height: 220px;
        height: 220px;
    }
}

/* BB-PUBLIC-SALON-MAP-DISTANCE-01A final embedded map expand button */
.salon-location-map-expand-button[b-l2f3zzezq3] {
    position: absolute;
    right: 0.72rem;
    bottom: 0.72rem;
    z-index: 500;
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    padding: 0 0.72rem;
    color: #ffffff;
    font-family: inherit;
    font-size: 0.68rem;
    font-weight: 950;
    line-height: 1;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border: 1px solid color-mix(in srgb, var(--salon-details-primary) 22%, transparent);
    border-radius: 999px;
    background: linear-gradient(135deg, var(--salon-details-primary), color-mix(in srgb, var(--salon-details-primary) 72%, var(--salon-details-secondary)));
    box-shadow: 0 14px 28px color-mix(in srgb, var(--salon-details-primary) 22%, transparent);
    cursor: pointer;
    transition: transform 150ms ease, box-shadow 150ms ease, filter 150ms ease;
}

    .salon-location-map-expand-button:hover[b-l2f3zzezq3],
    .salon-location-map-expand-button:focus-visible[b-l2f3zzezq3] {
        transform: translateY(-1px);
        box-shadow: 0 18px 34px color-mix(in srgb, var(--salon-details-primary) 28%, transparent);
        filter: saturate(1.05);
        outline: none;
    }

.salon-details-page[b-l2f3zzezq3]  .salon-location-map-expand-button .mud-icon-root {
    color: #ffffff !important;
    font-size: 1rem;
}

@media (max-width: 600px) {
    .salon-location-map-expand-button[b-l2f3zzezq3] {
        right: 0.56rem;
        bottom: 0.56rem;
        min-height: 34px;
        padding-inline: 0.62rem;
    }
}


/* BB-FOUNDING-50-01 */
.salon-details-page[b-l2f3zzezq3]  .salon-profile-founding-chip {
    color: #fffaf0 !important;
    font-weight: 950;
    background: linear-gradient(135deg, #7a5d27, #c7a15a 58%, #8b6b2f) !important;
    border: 1px solid rgba(255,255,255,0.28) !important;
    box-shadow: 0 12px 26px rgba(82, 62, 24, 0.28);
}

.salon-profile-preview-founding[b-l2f3zzezq3] {
    color: #fffaf0 !important;
    background: linear-gradient(135deg, rgba(122,93,39,.96), rgba(199,161,90,.96)) !important;
}

/* BB-OWNER-READY-EMPLOYEE-01 professional profile photos */
.salon-professional-avatar-with-image[b-l2f3zzezq3] {
    overflow: hidden;
    padding: 0;
    border: 2px solid color-mix(in srgb, var(--salon-details-surface) 86%, transparent);
    background: color-mix(in srgb, var(--salon-details-primary) 8%, var(--salon-details-surface));
}

    .salon-professional-avatar-with-image img[b-l2f3zzezq3] {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
    }

/* ========================================================================== */
/* BOOKBEAUT SALON ATELIER V3 — COMPLETE ONBOARDING REDESIGN                  */
/* ========================================================================== */

.bb-onboarding-studio[b-l2f3zzezq3] {
    --bb-primary: var(--mud-palette-primary);
    --bb-secondary: var(--mud-palette-secondary);
    --bb-surface: var(--mud-palette-surface);
    --bb-background: var(--mud-palette-background);
    --bb-text: var(--mud-palette-text-primary);
    --bb-muted: var(--mud-palette-text-secondary);
    --bb-divider: var(--mud-palette-divider);
    --bb-success: var(--mud-palette-success);
    --bb-warning: var(--mud-palette-warning);
    --bb-error: var(--mud-palette-error);
    --bb-info: var(--mud-palette-info);
    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
    padding: clamp(0.6rem, 1.5vw, 1.25rem) clamp(0.65rem, 2vw, 1.5rem) 5rem;
    color: var(--bb-text);
    font-family: inherit;
}

    .bb-onboarding-studio[b-l2f3zzezq3],
    .bb-onboarding-studio *[b-l2f3zzezq3],
    .bb-onboarding-studio *[b-l2f3zzezq3]::before,
    .bb-onboarding-studio *[b-l2f3zzezq3]::after {
        box-sizing: border-box;
    }

        .bb-onboarding-studio[b-l2f3zzezq3]  .mud-typography,
        .bb-onboarding-studio[b-l2f3zzezq3]  .mud-button-root,
        .bb-onboarding-studio[b-l2f3zzezq3]  .mud-input,
        .bb-onboarding-studio[b-l2f3zzezq3]  .mud-input-label,
        .bb-onboarding-studio[b-l2f3zzezq3]  .mud-select,
        .bb-onboarding-studio[b-l2f3zzezq3]  .mud-chip,
        .bb-onboarding-studio[b-l2f3zzezq3]  input,
        .bb-onboarding-studio[b-l2f3zzezq3]  textarea,
        .bb-onboarding-studio[b-l2f3zzezq3]  button {
            font-family: inherit !important;
        }

.bb-onboarding-layout[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: minmax(270px, 318px) minmax(0, 1fr);
    gap: clamp(1rem, 2vw, 1.7rem);
    align-items: start;
}

.bb-onboarding-rail[b-l2f3zzezq3] {
    position: sticky;
    top: 84px;
    min-height: calc(100vh - 108px);
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1.2rem;
    overflow: hidden;
    border-radius: 32px;
    background: radial-gradient(circle at 10% 0%, color-mix(in srgb, var(--bb-secondary) 26%, transparent), transparent 30%), radial-gradient(circle at 100% 90%, color-mix(in srgb, var(--bb-primary) 34%, transparent), transparent 38%), linear-gradient(160deg, color-mix(in srgb, var(--bb-primary) 93%, var(--bb-text)), var(--bb-primary) 58%, color-mix(in srgb, var(--bb-primary) 76%, var(--bb-secondary)));
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary-text) 16%, transparent);
    box-shadow: 0 30px 72px color-mix(in srgb, var(--bb-primary) 23%, transparent);
}

    .bb-onboarding-rail[b-l2f3zzezq3]::before {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        background: linear-gradient(125deg, color-mix(in srgb, var(--mud-palette-primary-text) 12%, transparent), transparent 42%), repeating-linear-gradient(135deg, color-mix(in srgb, var(--mud-palette-primary-text) 3%, transparent) 0 1px, transparent 1px 20px);
    }

    .bb-onboarding-rail > *[b-l2f3zzezq3] {
        position: relative;
        z-index: 1;
    }

.bb-onboarding-brand[b-l2f3zzezq3] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding-bottom: 0.95rem;
    border-bottom: 1px solid color-mix(in srgb, var(--mud-palette-primary-text) 16%, transparent);
}

.bb-onboarding-brand-mark[b-l2f3zzezq3] {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border-radius: 17px;
    background: color-mix(in srgb, var(--bb-surface) 94%, transparent);
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary-text) 28%, transparent);
    box-shadow: 0 16px 32px color-mix(in srgb, var(--bb-text) 22%, transparent);
}

    .bb-onboarding-brand-mark img[b-l2f3zzezq3],
    .bb-onboarding-mobile-brand img[b-l2f3zzezq3] {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: contain;
    }

.bb-onboarding-brand > div:last-child[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.08rem;
}

.bb-onboarding-brand small[b-l2f3zzezq3] {
    color: color-mix(in srgb, var(--mud-palette-primary-text) 70%, transparent);
    font-size: 0.63rem;
    font-weight: 900;
    letter-spacing: 0.15em;
}

.bb-onboarding-brand strong[b-l2f3zzezq3] {
    color: var(--mud-palette-primary-text);
    font-size: 1rem;
    font-weight: 950;
    letter-spacing: -0.02em;
}

.bb-onboarding-rail-intro[b-l2f3zzezq3] {
    display: grid;
    gap: 0.72rem;
    padding: 0.35rem 0.1rem 0;
}

.bb-onboarding-eyebrow[b-l2f3zzezq3] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: color-mix(in srgb, var(--mud-palette-primary-text) 72%, transparent);
    font-size: 0.64rem;
    font-weight: 900;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-onboarding-eyebrow .mud-icon-root {
    color: var(--bb-secondary);
    font-size: 1rem;
}

.bb-onboarding-rail-intro h1[b-l2f3zzezq3] {
    margin: 0;
    color: var(--mud-palette-primary-text);
    font-size: clamp(1.65rem, 2.3vw, 2.25rem);
    font-weight: 950;
    line-height: 1.02;
    letter-spacing: -0.052em;
    text-wrap: balance;
}

.bb-onboarding-rail-intro p[b-l2f3zzezq3] {
    margin: 0;
    color: color-mix(in srgb, var(--mud-palette-primary-text) 76%, transparent);
    font-size: 0.84rem;
    font-weight: 600;
    line-height: 1.52;
}

.bb-onboarding-progress-card[b-l2f3zzezq3] {
    display: grid;
    gap: 0.75rem;
    padding: 0.95rem;
    border-radius: 22px;
    background: color-mix(in srgb, var(--bb-surface) 14%, transparent);
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary-text) 18%, transparent);
    backdrop-filter: blur(18px);
}

.bb-onboarding-progress-copy[b-l2f3zzezq3] {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
}

    .bb-onboarding-progress-copy span[b-l2f3zzezq3] {
        color: color-mix(in srgb, var(--mud-palette-primary-text) 70%, transparent);
        font-size: 0.7rem;
        font-weight: 800;
    }

    .bb-onboarding-progress-copy strong[b-l2f3zzezq3] {
        color: var(--mud-palette-primary-text);
        font-size: 1.45rem;
        font-weight: 950;
        line-height: 1;
        letter-spacing: -0.04em;
    }

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-onboarding-progress-line {
    height: 7px !important;
    overflow: hidden;
    border-radius: 999px;
    background: color-mix(in srgb, var(--mud-palette-primary-text) 16%, transparent);
}

.bb-onboarding-next-focus[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.62rem;
    align-items: center;
    padding: 0.72rem;
    border-radius: 17px;
    background: color-mix(in srgb, var(--bb-surface) 12%, transparent);
}

    .bb-onboarding-next-focus > span[b-l2f3zzezq3] {
        width: 39px;
        height: 39px;
        display: grid;
        place-items: center;
        border-radius: 14px;
        background: linear-gradient(135deg, var(--bb-secondary), color-mix(in srgb, var(--bb-secondary) 72%, var(--bb-primary)));
        box-shadow: 0 12px 24px color-mix(in srgb, var(--bb-secondary) 24%, transparent);
    }

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-onboarding-next-focus > span .mud-icon-root {
    color: var(--mud-palette-secondary-text);
    font-size: 1.1rem;
}

.bb-onboarding-next-focus div[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.12rem;
}

.bb-onboarding-next-focus small[b-l2f3zzezq3] {
    color: color-mix(in srgb, var(--mud-palette-primary-text) 64%, transparent);
    font-size: 0.62rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.bb-onboarding-next-focus strong[b-l2f3zzezq3] {
    overflow: hidden;
    color: var(--mud-palette-primary-text);
    font-size: 0.84rem;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bb-onboarding-stage-nav[b-l2f3zzezq3] {
    min-height: 0;
    display: grid;
    gap: 0.42rem;
}

.bb-onboarding-stage-button[b-l2f3zzezq3] {
    position: relative;
    width: 100%;
    min-height: 57px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.68rem;
    align-items: center;
    padding: 0.56rem 0.62rem;
    color: color-mix(in srgb, var(--mud-palette-primary-text) 72%, transparent);
    text-align: left;
    cursor: pointer;
    appearance: none;
    border: 1px solid transparent;
    border-radius: 17px;
    background: transparent;
    transition: transform 150ms ease, background 150ms ease, border-color 150ms ease, box-shadow 150ms ease;
}

    .bb-onboarding-stage-button:hover:not(:disabled)[b-l2f3zzezq3],
    .bb-onboarding-stage-button:focus-visible:not(:disabled)[b-l2f3zzezq3] {
        transform: translateX(3px);
        color: var(--mud-palette-primary-text);
        background: color-mix(in srgb, var(--bb-surface) 12%, transparent);
        border-color: color-mix(in srgb, var(--mud-palette-primary-text) 14%, transparent);
        outline: none;
    }

    .bb-onboarding-stage-button.is-active[b-l2f3zzezq3] {
        color: var(--bb-text);
        background: color-mix(in srgb, var(--bb-surface) 96%, transparent);
        border-color: color-mix(in srgb, var(--bb-secondary) 34%, var(--bb-divider));
        box-shadow: 0 16px 34px color-mix(in srgb, var(--bb-text) 18%, transparent);
    }

    .bb-onboarding-stage-button.is-disabled[b-l2f3zzezq3] {
        opacity: 0.42;
        cursor: not-allowed;
    }

.bb-onboarding-stage-number[b-l2f3zzezq3] {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    color: var(--mud-palette-primary-text);
    font-size: 0.72rem;
    font-weight: 950;
    border-radius: 12px;
    background: color-mix(in srgb, var(--mud-palette-primary-text) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary-text) 15%, transparent);
}

.bb-onboarding-stage-button.is-active .bb-onboarding-stage-number[b-l2f3zzezq3] {
    color: var(--mud-palette-secondary-text);
    background: linear-gradient(135deg, var(--bb-secondary), color-mix(in srgb, var(--bb-secondary) 72%, var(--bb-primary)));
    border-color: transparent;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--bb-secondary) 24%, transparent);
}

.bb-onboarding-stage-button.is-complete:not(.is-active) .bb-onboarding-stage-number[b-l2f3zzezq3] {
    color: var(--mud-palette-success-text);
    background: var(--bb-success);
    border-color: transparent;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-onboarding-stage-number .mud-icon-root {
    color: inherit;
    font-size: 1rem;
}

.bb-onboarding-stage-copy[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.08rem;
}

    .bb-onboarding-stage-copy strong[b-l2f3zzezq3] {
        overflow: hidden;
        color: inherit;
        font-size: 0.81rem;
        font-weight: 900;
        line-height: 1.12;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .bb-onboarding-stage-copy small[b-l2f3zzezq3] {
        overflow: hidden;
        color: inherit;
        opacity: 0.72;
        font-size: 0.62rem;
        font-weight: 700;
        line-height: 1.1;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-onboarding-stage-arrow {
    color: inherit;
    opacity: 0.46;
    font-size: 1.05rem;
}

.bb-onboarding-stage-button.is-active[b-l2f3zzezq3]  .bb-onboarding-stage-arrow {
    color: var(--bb-primary);
    opacity: 1;
}

.bb-onboarding-rail-summary[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.42rem;
    margin-top: auto;
}

    .bb-onboarding-rail-summary div[b-l2f3zzezq3] {
        min-width: 0;
        display: grid;
        gap: 0.1rem;
        padding: 0.62rem 0.35rem;
        text-align: center;
        border-radius: 15px;
        background: color-mix(in srgb, var(--bb-surface) 11%, transparent);
        border: 1px solid color-mix(in srgb, var(--mud-palette-primary-text) 12%, transparent);
    }

    .bb-onboarding-rail-summary strong[b-l2f3zzezq3] {
        color: var(--mud-palette-primary-text);
        font-size: 0.94rem;
        font-weight: 950;
    }

    .bb-onboarding-rail-summary span[b-l2f3zzezq3] {
        color: color-mix(in srgb, var(--mud-palette-primary-text) 64%, transparent);
        font-size: 0.58rem;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.04em;
    }

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-onboarding-live-button {
    min-height: 44px;
    color: var(--mud-palette-primary-text);
    font-weight: 900;
    border-color: color-mix(in srgb, var(--mud-palette-primary-text) 26%, transparent);
    border-radius: 15px;
    background: color-mix(in srgb, var(--bb-surface) 9%, transparent);
}

.bb-onboarding-main[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.9rem;
}

.bb-onboarding-mobile-header[b-l2f3zzezq3],
.bb-onboarding-mobile-progress[b-l2f3zzezq3],
.bb-onboarding-mobile-nav[b-l2f3zzezq3] {
    display: none;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-onboarding-status-alert {
    overflow: hidden;
    border-radius: 22px;
    border: 1px solid color-mix(in srgb, var(--bb-primary) 10%, var(--bb-divider));
    background: color-mix(in srgb, var(--bb-surface) 96%, var(--bb-background));
    box-shadow: 0 12px 32px color-mix(in srgb, var(--bb-text) 5%, transparent);
}

.bb-onboarding-status-copy[b-l2f3zzezq3] {
    display: grid;
    gap: 0.12rem;
}

    .bb-onboarding-status-copy strong[b-l2f3zzezq3] {
        color: var(--bb-text);
        font-size: 0.72rem;
        font-weight: 950;
        letter-spacing: 0.06em;
        text-transform: uppercase;
    }

    .bb-onboarding-status-copy span[b-l2f3zzezq3],
    .bb-onboarding-status-copy small[b-l2f3zzezq3] {
        color: var(--bb-muted);
        font-size: 0.84rem;
        font-weight: 620;
        line-height: 1.42;
    }

    .bb-onboarding-status-copy small[b-l2f3zzezq3] {
        margin-top: 0.3rem;
        padding-top: 0.5rem;
        border-top: 1px solid color-mix(in srgb, var(--bb-primary) 9%, var(--bb-divider));
    }

.bb-onboarding-stage-frame[b-l2f3zzezq3] {
    min-width: 0;
    overflow: hidden;
    border-radius: 34px;
    background: radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--bb-secondary) 8%, transparent), transparent 26%), color-mix(in srgb, var(--bb-surface) 98%, var(--bb-background));
    border: 1px solid color-mix(in srgb, var(--bb-primary) 10%, var(--bb-divider));
    box-shadow: 0 28px 72px color-mix(in srgb, var(--bb-text) 8%, transparent);
}

.bb-onboarding-stage-header[b-l2f3zzezq3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.2rem;
    padding: clamp(1rem, 2vw, 1.6rem) clamp(1rem, 2.4vw, 2rem);
    border-bottom: 1px solid color-mix(in srgb, var(--bb-primary) 8%, var(--bb-divider));
    background: color-mix(in srgb, var(--bb-surface) 92%, transparent);
    backdrop-filter: blur(18px);
}

.bb-onboarding-stage-heading[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.9rem;
    align-items: center;
}

.bb-onboarding-stage-icon[b-l2f3zzezq3] {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border-radius: 18px;
    background: linear-gradient(135deg, var(--bb-primary), color-mix(in srgb, var(--bb-primary) 72%, var(--bb-secondary)));
    box-shadow: 0 16px 34px color-mix(in srgb, var(--bb-primary) 22%, transparent);
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-onboarding-stage-icon .mud-icon-root {
    color: var(--mud-palette-primary-text);
    font-size: 1.42rem;
}

.bb-onboarding-stage-heading > div[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.12rem;
}

.bb-onboarding-stage-heading small[b-l2f3zzezq3] {
    color: var(--bb-secondary);
    font-size: 0.66rem;
    font-weight: 950;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.bb-onboarding-stage-heading h2[b-l2f3zzezq3] {
    margin: 0;
    color: var(--bb-text);
    font-size: clamp(1.4rem, 2.2vw, 2.05rem);
    font-weight: 950;
    line-height: 1.08;
    letter-spacing: -0.04em;
}

.bb-onboarding-stage-heading p[b-l2f3zzezq3] {
    max-width: 760px;
    margin: 0.2rem 0 0;
    color: var(--bb-muted);
    font-size: 0.88rem;
    font-weight: 590;
    line-height: 1.48;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-onboarding-stage-chip {
    flex: 0 0 auto;
    min-height: 32px;
    border-radius: 999px;
    font-weight: 900;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-workspace-body {
    padding: clamp(0.85rem, 2.2vw, 1.7rem);
}

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-stage-card {
    display: grid;
    gap: 1.15rem;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.bb-onboarding-studio .lux-section-heading[b-l2f3zzezq3] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.2rem 0.15rem 0.95rem;
    border-bottom: 1px solid color-mix(in srgb, var(--bb-primary) 8%, var(--bb-divider));
}

    .bb-onboarding-studio .lux-section-heading > div:first-child[b-l2f3zzezq3] {
        min-width: 0;
        display: grid;
        gap: 0.18rem;
    }

        .bb-onboarding-studio .lux-section-heading > div:first-child > span[b-l2f3zzezq3] {
            color: var(--bb-secondary);
            font-size: 0.65rem;
            font-weight: 950;
            letter-spacing: 0.1em;
            text-transform: uppercase;
        }

    .bb-onboarding-studio .lux-section-heading h3[b-l2f3zzezq3] {
        margin: 0;
        color: var(--bb-text);
        font-size: clamp(1.25rem, 2vw, 1.75rem);
        font-weight: 950;
        line-height: 1.1;
        letter-spacing: -0.035em;
    }

    .bb-onboarding-studio .lux-section-heading p[b-l2f3zzezq3] {
        max-width: 760px;
        margin: 0;
        color: var(--bb-muted);
        font-size: 0.86rem;
        font-weight: 580;
        line-height: 1.48;
    }

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-alert {
    border-radius: 17px;
    box-shadow: none;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-form-grid {
    row-gap: 0.25rem;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-field .mud-input-control {
    margin-top: 0.2rem;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-field .mud-input-outlined {
    min-height: 52px;
    border-radius: 15px;
    background: color-mix(in srgb, var(--bb-surface) 98%, var(--bb-background));
}

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-field .mud-input-outlined-border {
    border-color: color-mix(in srgb, var(--bb-primary) 11%, var(--bb-divider));
    border-radius: 15px;
    transition: border-color 140ms ease, box-shadow 140ms ease, background 140ms ease;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-field:hover .mud-input-outlined-border {
    border-color: color-mix(in srgb, var(--bb-primary) 28%, var(--bb-divider));
}

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-field.mud-input-control-input-container-with-label .mud-input-label,
.bb-onboarding-studio[b-l2f3zzezq3]  .lux-field .mud-input-label {
    color: var(--bb-muted);
    font-weight: 760;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-field .mud-input-adornment .mud-icon-root {
    color: var(--bb-primary);
}

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    padding-top: 0.35rem;
}

    .bb-onboarding-studio[b-l2f3zzezq3]  .lux-form-actions .mud-button-root,
    .bb-onboarding-studio[b-l2f3zzezq3]  .lux-service-studio-actions .mud-button-root,
    .bb-onboarding-studio[b-l2f3zzezq3]  .lux-team-intro .mud-button-root {
        min-height: 46px;
        border-radius: 14px;
        font-weight: 900;
    }

.bb-onboarding-studio .lux-address-results[b-l2f3zzezq3] {
    z-index: 30;
    overflow: hidden;
    border-radius: 20px;
    background: var(--bb-surface);
    border: 1px solid color-mix(in srgb, var(--bb-primary) 12%, var(--bb-divider));
    box-shadow: 0 24px 58px color-mix(in srgb, var(--bb-text) 12%, transparent);
}

.bb-onboarding-studio .lux-address-option[b-l2f3zzezq3] {
    min-height: 64px;
    border-radius: 0;
}

.bb-onboarding-studio .lux-address-confirmed[b-l2f3zzezq3],
.bb-onboarding-studio .lux-locked-value[b-l2f3zzezq3],
.bb-onboarding-studio .lux-empty-state[b-l2f3zzezq3],
.bb-onboarding-studio .lux-team-intro[b-l2f3zzezq3] {
    border-radius: 22px;
    background: radial-gradient(circle at 95% 5%, color-mix(in srgb, var(--bb-secondary) 8%, transparent), transparent 34%), color-mix(in srgb, var(--bb-primary) 4%, var(--bb-surface));
    border: 1px solid color-mix(in srgb, var(--bb-primary) 9%, var(--bb-divider));
    box-shadow: 0 12px 30px color-mix(in srgb, var(--bb-text) 4%, transparent);
}

.bb-onboarding-studio .lux-address-facts span[b-l2f3zzezq3] {
    border-radius: 14px;
    background: var(--bb-surface);
}

/* Service atelier */
.bb-onboarding-studio .lux-service-studio[b-l2f3zzezq3],
.bb-onboarding-studio .lux-editor-card[b-l2f3zzezq3],
.bb-onboarding-studio .lux-team-list-card[b-l2f3zzezq3],
.bb-onboarding-studio .lux-upload-card[b-l2f3zzezq3],
.bb-onboarding-studio .lux-portfolio-section[b-l2f3zzezq3],
.bb-onboarding-studio .lux-readiness-panel[b-l2f3zzezq3],
.bb-onboarding-studio .lux-final-submit-panel[b-l2f3zzezq3] {
    overflow: hidden;
    border-radius: 26px;
    background: radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--bb-secondary) 7%, transparent), transparent 28%), var(--bb-surface);
    border: 1px solid color-mix(in srgb, var(--bb-primary) 9%, var(--bb-divider));
    box-shadow: 0 16px 38px color-mix(in srgb, var(--bb-text) 5%, transparent);
}

.bb-onboarding-studio .lux-service-studio[b-l2f3zzezq3] {
    padding: clamp(0.9rem, 2vw, 1.35rem);
}

.bb-onboarding-studio .lux-service-studio-header[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.85rem;
    align-items: center;
    padding: 0 0 1rem;
    border-bottom: 1px solid color-mix(in srgb, var(--bb-primary) 8%, var(--bb-divider));
}

.bb-onboarding-studio .lux-service-studio-mark[b-l2f3zzezq3],
.bb-onboarding-studio .lux-editor-card-header > span[b-l2f3zzezq3],
.bb-onboarding-studio .lux-team-intro > span[b-l2f3zzezq3],
.bb-onboarding-studio .lux-upload-icon[b-l2f3zzezq3],
.bb-onboarding-studio .lux-readiness-heading > span[b-l2f3zzezq3],
.bb-onboarding-studio .lux-final-submit-top > span[b-l2f3zzezq3] {
    width: 50px;
    height: 50px;
    display: grid;
    place-items: center;
    border-radius: 18px;
    background: linear-gradient(135deg, var(--bb-primary), color-mix(in srgb, var(--bb-primary) 70%, var(--bb-secondary)));
    box-shadow: 0 14px 30px color-mix(in srgb, var(--bb-primary) 18%, transparent);
}

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-service-studio-mark .mud-icon-root,
.bb-onboarding-studio[b-l2f3zzezq3]  .lux-editor-card-header > span .mud-icon-root,
.bb-onboarding-studio[b-l2f3zzezq3]  .lux-team-intro > span .mud-icon-root,
.bb-onboarding-studio[b-l2f3zzezq3]  .lux-upload-icon .mud-icon-root,
.bb-onboarding-studio[b-l2f3zzezq3]  .lux-readiness-heading > span .mud-icon-root,
.bb-onboarding-studio[b-l2f3zzezq3]  .lux-final-submit-top > span .mud-icon-root {
    color: var(--mud-palette-primary-text);
    font-size: 1.35rem;
}

.bb-onboarding-studio .lux-service-studio-grid[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.92fr);
    gap: 1rem;
    padding-top: 1rem;
}

.bb-onboarding-studio .lux-service-identity-panel[b-l2f3zzezq3],
.bb-onboarding-studio .lux-service-booking-panel[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    align-content: start;
    gap: 0.85rem;
    padding: 1rem;
    border-radius: 22px;
    background: color-mix(in srgb, var(--bb-primary) 3%, var(--bb-surface));
    border: 1px solid color-mix(in srgb, var(--bb-primary) 8%, var(--bb-divider));
}

.bb-onboarding-studio .lux-service-panel-heading[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.65rem;
    align-items: center;
}

    .bb-onboarding-studio .lux-service-panel-heading > span[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-service-control-icon[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-service-live-icon[b-l2f3zzezq3] {
        width: 42px;
        height: 42px;
        display: grid;
        place-items: center;
        border-radius: 15px;
        background: color-mix(in srgb, var(--bb-primary) 9%, var(--bb-surface));
    }

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-service-panel-heading .mud-icon-root,
.bb-onboarding-studio[b-l2f3zzezq3]  .lux-service-control-icon .mud-icon-root,
.bb-onboarding-studio[b-l2f3zzezq3]  .lux-service-live-icon .mud-icon-root {
    color: var(--bb-primary);
}

.bb-onboarding-studio .lux-service-live-card[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.75rem;
    align-items: center;
    padding: 0.85rem;
    border-radius: 20px;
    background: radial-gradient(circle at 90% 10%, color-mix(in srgb, var(--bb-secondary) 10%, transparent), transparent 35%), linear-gradient(135deg, color-mix(in srgb, var(--bb-primary) 6%, var(--bb-surface)), var(--bb-surface));
    border: 1px solid color-mix(in srgb, var(--bb-primary) 10%, var(--bb-divider));
}

.bb-onboarding-studio .lux-service-booking-grid[b-l2f3zzezq3] {
    display: grid;
    gap: 0.72rem;
}

.bb-onboarding-studio .lux-service-control-card[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) minmax(150px, 0.8fr);
    gap: 0.7rem;
    align-items: center;
    padding: 0.72rem;
    border-radius: 18px;
    background: var(--bb-surface);
    border: 1px solid color-mix(in srgb, var(--bb-primary) 7%, var(--bb-divider));
}

.bb-onboarding-studio .lux-service-control-card-price[b-l2f3zzezq3] {
    grid-template-columns: auto minmax(0, 1fr);
}

.bb-onboarding-studio .lux-service-price-fields[b-l2f3zzezq3] {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 1fr minmax(150px, 0.55fr);
    gap: 0.65rem;
}

.bb-onboarding-studio .lux-service-list[b-l2f3zzezq3] {
    display: grid;
    gap: 0.72rem;
}

.bb-onboarding-studio .lux-service-menu-card[b-l2f3zzezq3] {
    overflow: hidden;
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
    min-height: 112px;
    padding: 0.75rem 0.9rem 0.75rem 0.75rem;
    border-radius: 23px;
    background: radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--bb-secondary) 7%, transparent), transparent 34%), var(--bb-surface);
    border: 1px solid color-mix(in srgb, var(--bb-primary) 9%, var(--bb-divider));
    box-shadow: 0 12px 28px color-mix(in srgb, var(--bb-text) 4%, transparent);
    transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

    .bb-onboarding-studio .lux-service-menu-card:hover[b-l2f3zzezq3] {
        transform: translateY(-3px);
        border-color: color-mix(in srgb, var(--bb-primary) 24%, var(--bb-divider));
        box-shadow: 0 20px 42px color-mix(in srgb, var(--bb-primary) 10%, transparent);
    }

.bb-onboarding-studio .lux-service-menu-media[b-l2f3zzezq3] {
    position: relative;
    overflow: hidden;
    width: 92px;
    height: 86px;
    display: grid;
    place-items: center;
    border-radius: 19px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--bb-primary) 10%, var(--bb-surface)), color-mix(in srgb, var(--bb-secondary) 8%, var(--bb-surface)));
}

    .bb-onboarding-studio .lux-service-menu-media img[b-l2f3zzezq3] {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
    }

/* Team & portrait */
.bb-onboarding-studio .lux-team-layout[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr);
    gap: 1rem;
    align-items: start;
}

.bb-onboarding-studio .lux-editor-card[b-l2f3zzezq3],
.bb-onboarding-studio .lux-team-list-card[b-l2f3zzezq3],
.bb-onboarding-studio .lux-upload-card[b-l2f3zzezq3],
.bb-onboarding-studio .lux-portfolio-section[b-l2f3zzezq3],
.bb-onboarding-studio .lux-readiness-panel[b-l2f3zzezq3],
.bb-onboarding-studio .lux-final-submit-panel[b-l2f3zzezq3] {
    padding: 1rem;
}

.bb-onboarding-studio .lux-editor-card-header[b-l2f3zzezq3],
.bb-onboarding-studio .lux-team-list-header[b-l2f3zzezq3],
.bb-onboarding-studio .lux-upload-copy[b-l2f3zzezq3],
.bb-onboarding-studio .lux-readiness-heading[b-l2f3zzezq3],
.bb-onboarding-studio .lux-final-submit-top[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.75rem;
    align-items: center;
}

.bb-onboarding-studio .lux-profile-photo-studio[b-l2f3zzezq3] {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(190px, 0.62fr) minmax(0, 1.38fr);
    gap: 1rem;
    align-items: center;
    margin: 1rem 0;
    padding: 1rem;
    border-radius: 24px;
    background: radial-gradient(circle at 12% 15%, color-mix(in srgb, var(--bb-secondary) 12%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--bb-primary) 6%, var(--bb-surface)), var(--bb-surface));
    border: 1px solid color-mix(in srgb, var(--bb-primary) 10%, var(--bb-divider));
}

.bb-onboarding-studio .lux-profile-photo-visual[b-l2f3zzezq3] {
    position: relative;
    width: 172px;
    height: 172px;
    margin: 0 auto;
}

.bb-onboarding-studio .lux-profile-photo-ring[b-l2f3zzezq3] {
    width: 100%;
    height: 100%;
    display: grid;
    place-items: center;
    overflow: hidden;
    border-radius: 50%;
    background: linear-gradient(135deg, color-mix(in srgb, var(--bb-primary) 14%, var(--bb-surface)), color-mix(in srgb, var(--bb-secondary) 12%, var(--bb-surface)));
    border: 7px solid color-mix(in srgb, var(--bb-surface) 96%, transparent);
    box-shadow: 0 22px 50px color-mix(in srgb, var(--bb-primary) 18%, transparent), 0 0 0 1px color-mix(in srgb, var(--bb-primary) 10%, var(--bb-divider));
}

    .bb-onboarding-studio .lux-profile-photo-ring img[b-l2f3zzezq3] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-profile-photo-ring > .mud-icon-root {
    color: color-mix(in srgb, var(--bb-primary) 60%, var(--bb-muted));
    font-size: 4.3rem;
}

.bb-onboarding-studio .lux-profile-photo-camera[b-l2f3zzezq3] {
    position: absolute;
    right: 4px;
    bottom: 8px;
    width: 50px;
    height: 50px;
    display: grid;
    place-items: center;
    cursor: pointer;
    overflow: hidden;
    border-radius: 17px;
    background: linear-gradient(135deg, var(--bb-secondary), color-mix(in srgb, var(--bb-secondary) 72%, var(--bb-primary)));
    border: 4px solid var(--bb-surface);
    box-shadow: 0 16px 34px color-mix(in srgb, var(--bb-secondary) 28%, transparent);
    transition: transform 150ms ease, filter 150ms ease;
}

    .bb-onboarding-studio .lux-profile-photo-camera:hover[b-l2f3zzezq3] {
        transform: translateY(-2px) scale(1.03);
        filter: saturate(1.08);
    }

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-profile-photo-camera > .mud-icon-root {
    color: var(--mud-palette-secondary-text);
}

.bb-onboarding-studio .lux-profile-photo-copy[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.38rem;
}

    .bb-onboarding-studio .lux-profile-photo-copy > small[b-l2f3zzezq3] {
        color: var(--bb-secondary);
        font-size: 0.64rem;
        font-weight: 950;
        letter-spacing: 0.1em;
        text-transform: uppercase;
    }

    .bb-onboarding-studio .lux-profile-photo-copy > strong[b-l2f3zzezq3] {
        color: var(--bb-text);
        font-size: 1.15rem;
        font-weight: 950;
        line-height: 1.15;
    }

    .bb-onboarding-studio .lux-profile-photo-copy > p[b-l2f3zzezq3] {
        margin: 0;
        color: var(--bb-muted);
        font-size: 0.84rem;
        line-height: 1.5;
    }

.bb-onboarding-studio .lux-profile-photo-tips[b-l2f3zzezq3] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

    .bb-onboarding-studio .lux-profile-photo-tips span[b-l2f3zzezq3] {
        display: inline-flex;
        align-items: center;
        gap: 0.3rem;
        padding: 0.42rem 0.58rem;
        color: var(--bb-text);
        font-size: 0.68rem;
        font-weight: 800;
        border-radius: 999px;
        background: color-mix(in srgb, var(--bb-primary) 6%, var(--bb-surface));
        border: 1px solid color-mix(in srgb, var(--bb-primary) 8%, var(--bb-divider));
    }

.bb-onboarding-studio .lux-profile-photo-actions[b-l2f3zzezq3] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    align-items: center;
    margin-top: 0.25rem;
}

.bb-onboarding-studio .lux-profile-photo-upload[b-l2f3zzezq3],
.bb-onboarding-studio .lux-portfolio-file-button[b-l2f3zzezq3] {
    position: relative;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    overflow: hidden;
    padding: 0 0.9rem;
    color: var(--mud-palette-secondary-text);
    cursor: pointer;
    border-radius: 14px;
    background: linear-gradient(135deg, var(--bb-secondary), color-mix(in srgb, var(--bb-secondary) 72%, var(--bb-primary)));
    box-shadow: 0 14px 28px color-mix(in srgb, var(--bb-secondary) 20%, transparent);
    font-size: 0.76rem;
    font-weight: 900;
}

/* The native browser choose-file button is completely invisible. */
.bb-onboarding-studio[b-l2f3zzezq3]  .bb-native-file-input {
    position: absolute !important;
    inset: 0 !important;
    z-index: 4 !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 0 !important;
    cursor: pointer !important;
    appearance: none !important;
    font-size: 0 !important;
    color: transparent !important;
    border: 0 !important;
    background: transparent !important;
}

    .bb-onboarding-studio[b-l2f3zzezq3]  .bb-native-file-input::file-selector-button,
    .bb-onboarding-studio[b-l2f3zzezq3]  .bb-native-file-input::-webkit-file-upload-button {
        display: none !important;
        width: 0 !important;
        height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        opacity: 0 !important;
    }

.bb-onboarding-studio .lux-service-picker-list[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
}

.bb-onboarding-studio .lux-service-choice[b-l2f3zzezq3] {
    min-height: 64px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.65rem;
    align-items: center;
    padding: 0.62rem;
    cursor: pointer;
    border-radius: 18px;
    background: var(--bb-surface);
    border: 1px solid color-mix(in srgb, var(--bb-primary) 8%, var(--bb-divider));
    transition: transform 150ms ease, border-color 150ms ease, background 150ms ease, box-shadow 150ms ease;
}

    .bb-onboarding-studio .lux-service-choice:hover[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-service-choice-selected[b-l2f3zzezq3] {
        transform: translateY(-2px);
        border-color: color-mix(in srgb, var(--bb-primary) 30%, var(--bb-divider));
        background: color-mix(in srgb, var(--bb-primary) 6%, var(--bb-surface));
        box-shadow: 0 12px 28px color-mix(in srgb, var(--bb-primary) 7%, transparent);
    }

/* Salon and service photo upload */
.bb-onboarding-studio .lux-dropzone[b-l2f3zzezq3] {
    position: relative;
    min-height: 210px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 0.75rem;
    overflow: hidden;
    padding: 1.35rem;
    text-align: center;
    cursor: pointer;
    border-radius: 26px;
    border: 1.5px dashed color-mix(in srgb, var(--bb-primary) 30%, var(--bb-divider));
    background: radial-gradient(circle at 50% 15%, color-mix(in srgb, var(--bb-secondary) 10%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--bb-primary) 5%, var(--bb-surface)), var(--bb-surface));
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

    .bb-onboarding-studio .lux-dropzone:hover[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-dropzone:focus-within[b-l2f3zzezq3] {
        transform: translateY(-3px);
        border-color: var(--bb-primary);
        box-shadow: 0 22px 48px color-mix(in srgb, var(--bb-primary) 12%, transparent);
        background: radial-gradient(circle at 50% 15%, color-mix(in srgb, var(--bb-secondary) 15%, transparent), transparent 36%), linear-gradient(135deg, color-mix(in srgb, var(--bb-primary) 8%, var(--bb-surface)), var(--bb-surface));
    }

.bb-onboarding-studio .lux-dropzone-icon[b-l2f3zzezq3] {
    width: 68px;
    height: 68px;
    display: grid;
    place-items: center;
    border-radius: 24px;
    background: linear-gradient(135deg, var(--bb-primary), color-mix(in srgb, var(--bb-primary) 68%, var(--bb-secondary)));
    box-shadow: 0 18px 40px color-mix(in srgb, var(--bb-primary) 22%, transparent);
}

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-dropzone-icon .mud-icon-root {
    color: var(--mud-palette-primary-text);
    font-size: 2rem;
}

.bb-onboarding-studio .lux-dropzone-copy[b-l2f3zzezq3] {
    display: grid;
    gap: 0.26rem;
}

    .bb-onboarding-studio .lux-dropzone-copy strong[b-l2f3zzezq3] {
        color: var(--bb-text);
        font-size: 1rem;
        font-weight: 950;
    }

    .bb-onboarding-studio .lux-dropzone-copy span[b-l2f3zzezq3] {
        color: var(--bb-muted);
        font-size: 0.8rem;
        font-weight: 600;
    }

.bb-onboarding-studio .lux-media-grid[b-l2f3zzezq3],
.bb-onboarding-studio .lux-portfolio-media-grid[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.bb-onboarding-studio .lux-media-card[b-l2f3zzezq3],
.bb-onboarding-studio .lux-portfolio-card[b-l2f3zzezq3] {
    position: relative;
    overflow: hidden;
    min-height: 190px;
    border-radius: 22px;
    background: color-mix(in srgb, var(--bb-primary) 7%, var(--bb-surface));
    border: 1px solid color-mix(in srgb, var(--bb-primary) 9%, var(--bb-divider));
    box-shadow: 0 14px 32px color-mix(in srgb, var(--bb-text) 6%, transparent);
}

    .bb-onboarding-studio .lux-media-card img[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-portfolio-card img[b-l2f3zzezq3] {
        width: 100%;
        height: 100%;
        min-height: 190px;
        display: block;
        object-fit: cover;
    }

.bb-onboarding-studio .lux-portfolio-service[b-l2f3zzezq3] {
    overflow: hidden;
    border-radius: 22px;
    background: var(--bb-surface);
    border: 1px solid color-mix(in srgb, var(--bb-primary) 9%, var(--bb-divider));
}

.bb-onboarding-studio .lux-portfolio-upload-row[b-l2f3zzezq3] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.65rem;
    align-items: end;
}

/* Availability */
.bb-onboarding-studio .lux-hours-list[b-l2f3zzezq3] {
    display: grid;
    gap: 0.72rem;
}

.bb-onboarding-studio .lux-hour-card[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: minmax(150px, 0.55fr) minmax(190px, 0.75fr) minmax(280px, 1fr);
    gap: 0.85rem;
    align-items: center;
    padding: 0.85rem;
    border-radius: 22px;
    background: radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--bb-secondary) 7%, transparent), transparent 34%), var(--bb-surface);
    border: 1px solid color-mix(in srgb, var(--bb-primary) 9%, var(--bb-divider));
    box-shadow: 0 12px 28px color-mix(in srgb, var(--bb-text) 4%, transparent);
}

.bb-onboarding-studio .lux-hour-card-closed[b-l2f3zzezq3] {
    grid-template-columns: minmax(150px, 0.55fr) minmax(190px, 0.75fr);
    opacity: 0.86;
    background: color-mix(in srgb, var(--bb-muted) 5%, var(--bb-surface));
}

.bb-onboarding-studio .lux-hour-day[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.65rem;
    align-items: center;
}

    .bb-onboarding-studio .lux-hour-day > span[b-l2f3zzezq3] {
        width: 48px;
        height: 48px;
        display: grid;
        place-items: center;
        border-radius: 16px;
        color: var(--bb-primary);
        font-size: 0.72rem;
        font-weight: 950;
        background: color-mix(in srgb, var(--bb-primary) 8%, var(--bb-surface));
        border: 1px solid color-mix(in srgb, var(--bb-primary) 10%, var(--bb-divider));
    }

.bb-onboarding-studio .lux-day-switch[b-l2f3zzezq3] {
    min-height: 54px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.72rem;
    align-items: center;
    padding: 0.5rem 0.62rem;
    text-align: left;
    cursor: pointer;
    appearance: none;
    border-radius: 18px;
    background: color-mix(in srgb, var(--bb-primary) 5%, var(--bb-surface));
    border: 1px solid color-mix(in srgb, var(--bb-primary) 9%, var(--bb-divider));
    transition: transform 150ms ease, border-color 150ms ease, background 150ms ease, box-shadow 150ms ease;
}

    .bb-onboarding-studio .lux-day-switch:hover:not(:disabled)[b-l2f3zzezq3] {
        transform: translateY(-2px);
        box-shadow: 0 12px 26px color-mix(in srgb, var(--bb-primary) 8%, transparent);
    }

.bb-onboarding-studio .lux-day-switch-track[b-l2f3zzezq3] {
    position: relative;
    width: 62px;
    height: 32px;
    display: block;
    border-radius: 999px;
    background: color-mix(in srgb, var(--bb-muted) 24%, var(--bb-surface));
    box-shadow: inset 0 2px 7px color-mix(in srgb, var(--bb-text) 15%, transparent);
    transition: background 160ms ease;
}

.bb-onboarding-studio .lux-day-switch-open .lux-day-switch-track[b-l2f3zzezq3] {
    background: color-mix(in srgb, var(--bb-success) 72%, var(--bb-surface));
}

.bb-onboarding-studio .lux-day-switch-thumb[b-l2f3zzezq3] {
    position: absolute;
    top: 4px;
    left: 4px;
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--bb-surface);
    box-shadow: 0 4px 12px color-mix(in srgb, var(--bb-text) 24%, transparent);
    transition: transform 180ms cubic-bezier(.2,.9,.2,1);
}

.bb-onboarding-studio .lux-day-switch-open .lux-day-switch-thumb[b-l2f3zzezq3] {
    transform: translateX(30px);
}

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-day-switch-thumb .mud-icon-root {
    color: var(--bb-primary);
    font-size: 0.92rem;
}

.bb-onboarding-studio .lux-day-switch-open[b-l2f3zzezq3]  .lux-day-switch-thumb .mud-icon-root {
    color: var(--bb-success);
}

.bb-onboarding-studio .lux-day-switch-copy[b-l2f3zzezq3] {
    display: grid;
    gap: 0.08rem;
}

    .bb-onboarding-studio .lux-day-switch-copy strong[b-l2f3zzezq3] {
        color: var(--bb-text);
        font-size: 0.8rem;
        font-weight: 950;
    }

    .bb-onboarding-studio .lux-day-switch-copy small[b-l2f3zzezq3] {
        color: var(--bb-muted);
        font-size: 0.66rem;
        font-weight: 700;
    }

.bb-onboarding-studio .lux-hour-times[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.58rem;
}

.bb-onboarding-studio .lux-breaks[b-l2f3zzezq3] {
    grid-column: 1 / -1;
    padding-top: 0.45rem;
    border-top: 1px solid color-mix(in srgb, var(--bb-primary) 7%, var(--bb-divider));
}

.bb-onboarding-studio .lux-break-row[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: minmax(150px, 1fr) repeat(2, minmax(120px, 0.6fr)) auto;
    gap: 0.55rem;
    align-items: center;
}

/* Final public profile mirror */
.bb-onboarding-studio .bb-preview-guidance[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.75rem;
    align-items: center;
    padding: 0.85rem;
    border-radius: 20px;
    background: color-mix(in srgb, var(--bb-secondary) 7%, var(--bb-surface));
    border: 1px solid color-mix(in srgb, var(--bb-secondary) 13%, var(--bb-divider));
}

    .bb-onboarding-studio .bb-preview-guidance > span[b-l2f3zzezq3],
    .bb-onboarding-studio .bb-preview-booking-heading > span[b-l2f3zzezq3] {
        width: 46px;
        height: 46px;
        display: grid;
        place-items: center;
        border-radius: 16px;
        background: linear-gradient(135deg, var(--bb-secondary), color-mix(in srgb, var(--bb-secondary) 72%, var(--bb-primary)));
        box-shadow: 0 14px 28px color-mix(in srgb, var(--bb-secondary) 20%, transparent);
    }

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-preview-guidance > span .mud-icon-root,
.bb-onboarding-studio[b-l2f3zzezq3]  .bb-preview-booking-heading > span .mud-icon-root {
    color: var(--mud-palette-secondary-text);
}

.bb-onboarding-studio .bb-preview-guidance div[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.12rem;
}

.bb-onboarding-studio .bb-preview-guidance strong[b-l2f3zzezq3] {
    color: var(--bb-text);
    font-size: 0.92rem;
    font-weight: 950;
}

.bb-onboarding-studio .bb-preview-guidance p[b-l2f3zzezq3] {
    margin: 0;
    color: var(--bb-muted);
    font-size: 0.78rem;
    line-height: 1.4;
}

.bb-onboarding-studio .bb-public-profile-canvas[b-l2f3zzezq3] {
    display: grid;
    gap: 1rem;
    padding: clamp(0.55rem, 1.4vw, 1rem);
    overflow: hidden;
    border-radius: 30px;
    background: color-mix(in srgb, var(--bb-background) 76%, var(--bb-surface));
    border: 1px solid color-mix(in srgb, var(--bb-primary) 8%, var(--bb-divider));
}

    .bb-onboarding-studio .bb-public-profile-canvas.salon-details-page[b-l2f3zzezq3] {
        padding-bottom: 0;
    }

    .bb-onboarding-studio .bb-public-profile-canvas[b-l2f3zzezq3]  .salon-profile-hero,
    .bb-onboarding-studio .bb-public-profile-canvas[b-l2f3zzezq3]  .salon-profile-panel {
        box-shadow: 0 16px 38px color-mix(in srgb, var(--bb-text) 6%, transparent);
    }

.bb-onboarding-studio .bb-preview-noninteractive[b-l2f3zzezq3]  .mud-button-root,
.bb-onboarding-studio .bb-preview-noninteractive button[b-l2f3zzezq3],
.bb-onboarding-studio .bb-preview-service-card[b-l2f3zzezq3] {
    pointer-events: none;
}

.bb-onboarding-studio .bb-preview-booking-card[b-l2f3zzezq3] {
    display: grid;
    gap: 0.85rem;
    padding: 1.15rem;
    border-radius: 28px;
    background: radial-gradient(circle at 95% 0%, color-mix(in srgb, var(--bb-secondary) 10%, transparent), transparent 32%), var(--bb-surface);
    border: 1px solid color-mix(in srgb, var(--bb-primary) 9%, var(--bb-divider));
    box-shadow: 0 18px 46px color-mix(in srgb, var(--bb-text) 7%, transparent);
}

.bb-onboarding-studio .bb-preview-booking-heading[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.7rem;
    align-items: center;
}

    .bb-onboarding-studio .bb-preview-booking-heading div[b-l2f3zzezq3] {
        display: grid;
        gap: 0.1rem;
    }

    .bb-onboarding-studio .bb-preview-booking-heading small[b-l2f3zzezq3] {
        color: var(--bb-secondary);
        font-size: 0.62rem;
        font-weight: 950;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .bb-onboarding-studio .bb-preview-booking-heading strong[b-l2f3zzezq3] {
        color: var(--bb-text);
        font-size: 1rem;
        font-weight: 950;
    }

.bb-onboarding-studio .bb-preview-booking-card > p[b-l2f3zzezq3] {
    margin: 0;
    color: var(--bb-muted);
    font-size: 0.82rem;
    line-height: 1.48;
}

.bb-onboarding-studio .bb-preview-booking-list[b-l2f3zzezq3] {
    display: grid;
    gap: 0.42rem;
}

    .bb-onboarding-studio .bb-preview-booking-list div[b-l2f3zzezq3] {
        display: flex;
        justify-content: space-between;
        gap: 1rem;
        padding: 0.62rem;
        border-radius: 15px;
        background: color-mix(in srgb, var(--bb-primary) 5%, var(--bb-surface));
        border: 1px solid color-mix(in srgb, var(--bb-primary) 8%, var(--bb-divider));
    }

    .bb-onboarding-studio .bb-preview-booking-list span[b-l2f3zzezq3] {
        color: var(--bb-text);
        font-size: 0.76rem;
        font-weight: 800;
    }

    .bb-onboarding-studio .bb-preview-booking-list strong[b-l2f3zzezq3] {
        color: var(--bb-primary);
        font-size: 0.76rem;
        font-weight: 950;
    }

.bb-onboarding-studio .bb-preview-map[b-l2f3zzezq3] {
    min-height: 150px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 0.35rem;
    margin-top: 0.45rem;
    border-radius: 18px;
    color: var(--bb-primary);
    background: radial-gradient(circle at 50% 45%, color-mix(in srgb, var(--bb-secondary) 12%, transparent), transparent 34%), repeating-linear-gradient(45deg, color-mix(in srgb, var(--bb-primary) 5%, transparent) 0 1px, transparent 1px 18px), color-mix(in srgb, var(--bb-primary) 5%, var(--bb-surface));
    border: 1px solid color-mix(in srgb, var(--bb-primary) 8%, var(--bb-divider));
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-preview-map .mud-icon-root {
    color: var(--bb-primary);
    font-size: 2rem;
}

.bb-onboarding-studio .bb-preview-map span[b-l2f3zzezq3] {
    font-size: 0.72rem;
    font-weight: 900;
}

.bb-onboarding-studio .lux-final-review-grid[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(330px, 0.8fr);
    gap: 1rem;
    align-items: start;
}

.bb-onboarding-studio .lux-readiness-list[b-l2f3zzezq3] {
    display: grid;
    gap: 0.5rem;
    margin-top: 0.85rem;
}

.bb-onboarding-studio .lux-readiness-item[b-l2f3zzezq3] {
    width: 100%;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.65rem;
    align-items: center;
    padding: 0.68rem;
    text-align: left;
    cursor: pointer;
    border-radius: 16px;
    background: color-mix(in srgb, var(--bb-primary) 4%, var(--bb-surface));
    border: 1px solid color-mix(in srgb, var(--bb-primary) 8%, var(--bb-divider));
}

.bb-onboarding-studio .lux-final-submit-panel[b-l2f3zzezq3] {
    position: sticky;
    top: 96px;
}

.bb-onboarding-studio .lux-photo-requirements-note[b-l2f3zzezq3] {
    display: grid;
    gap: 0.45rem;
    padding: 0.72rem;
    border-radius: 17px;
    background: color-mix(in srgb, var(--bb-secondary) 6%, var(--bb-surface));
    border: 1px solid color-mix(in srgb, var(--bb-secondary) 10%, var(--bb-divider));
}

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-final-submit-button {
    min-height: 54px;
    border-radius: 17px;
    font-size: 0.84rem;
    font-weight: 950;
    box-shadow: 0 18px 38px color-mix(in srgb, var(--bb-primary) 20%, transparent);
}

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-stage-footer {
    position: sticky;
    bottom: 0;
    z-index: 25;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.9rem;
    align-items: center;
    min-height: 76px;
    padding: 0.75rem clamp(0.85rem, 2vw, 1.5rem);
    border-top: 1px solid color-mix(in srgb, var(--bb-primary) 9%, var(--bb-divider));
    background: color-mix(in srgb, var(--bb-surface) 92%, transparent);
    box-shadow: 0 -18px 38px color-mix(in srgb, var(--bb-text) 7%, transparent);
    backdrop-filter: blur(20px);
}

.bb-onboarding-studio .lux-stage-footer > div[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.1rem;
    text-align: center;
}

.bb-onboarding-studio .lux-stage-footer small[b-l2f3zzezq3] {
    color: var(--bb-secondary);
    font-size: 0.62rem;
    font-weight: 950;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.bb-onboarding-studio .lux-stage-footer strong[b-l2f3zzezq3] {
    overflow: hidden;
    color: var(--bb-text);
    font-size: 0.78rem;
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-stage-footer .mud-button-root {
    min-height: 46px;
    border-radius: 15px;
    font-weight: 900;
}

/* Tablet */
@media (max-width: 1180px) {
    .bb-onboarding-layout[b-l2f3zzezq3] {
        grid-template-columns: 246px minmax(0, 1fr);
    }

    .bb-onboarding-rail[b-l2f3zzezq3] {
        padding: 1rem;
    }

    .bb-onboarding-rail-intro h1[b-l2f3zzezq3] {
        font-size: 1.6rem;
    }

    .bb-onboarding-rail-intro p[b-l2f3zzezq3] {
        font-size: 0.78rem;
    }

    .bb-onboarding-stage-copy small[b-l2f3zzezq3],
    .bb-onboarding-rail-summary span[b-l2f3zzezq3] {
        display: none;
    }

    .bb-onboarding-studio .lux-service-studio-grid[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-team-layout[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-final-review-grid[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
    }

    .bb-onboarding-studio .lux-final-submit-panel[b-l2f3zzezq3] {
        position: static;
    }

    .bb-onboarding-studio .lux-hour-card[b-l2f3zzezq3] {
        grid-template-columns: minmax(140px, 0.5fr) minmax(180px, 0.7fr);
    }

    .bb-onboarding-studio .lux-hour-times[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-breaks[b-l2f3zzezq3] {
        grid-column: 1 / -1;
    }
}

/* Mobile — rebuilt, not compressed desktop */
@media (max-width: 900px) {
    .bb-onboarding-studio[b-l2f3zzezq3] {
        padding: 0.35rem 0.45rem 7rem;
    }

    .bb-onboarding-layout[b-l2f3zzezq3] {
        display: block;
    }

    .bb-onboarding-rail[b-l2f3zzezq3] {
        display: none;
    }

    .bb-onboarding-main[b-l2f3zzezq3] {
        gap: 0.65rem;
    }

    .bb-onboarding-mobile-header[b-l2f3zzezq3] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
        padding: 0.7rem 0.75rem;
        border-radius: 20px;
        background: radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--bb-secondary) 18%, transparent), transparent 36%), linear-gradient(135deg, color-mix(in srgb, var(--bb-primary) 94%, var(--bb-text)), var(--bb-primary));
        box-shadow: 0 18px 42px color-mix(in srgb, var(--bb-primary) 20%, transparent);
    }

    .bb-onboarding-mobile-brand[b-l2f3zzezq3] {
        min-width: 0;
        display: grid;
        grid-template-columns: 42px minmax(0, 1fr);
        gap: 0.6rem;
        align-items: center;
    }

        .bb-onboarding-mobile-brand img[b-l2f3zzezq3] {
            width: 42px;
            height: 42px;
            padding: 0.28rem;
            border-radius: 14px;
            background: color-mix(in srgb, var(--bb-surface) 94%, transparent);
        }

        .bb-onboarding-mobile-brand div[b-l2f3zzezq3] {
            min-width: 0;
            display: grid;
            gap: 0.05rem;
        }

        .bb-onboarding-mobile-brand small[b-l2f3zzezq3] {
            color: color-mix(in srgb, var(--mud-palette-primary-text) 66%, transparent);
            font-size: 0.58rem;
            font-weight: 900;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }

        .bb-onboarding-mobile-brand strong[b-l2f3zzezq3] {
            overflow: hidden;
            color: var(--mud-palette-primary-text);
            font-size: 0.92rem;
            font-weight: 950;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

    .bb-onboarding-mobile-percent[b-l2f3zzezq3] {
        flex: 0 0 auto;
        padding: 0.5rem 0.62rem;
        color: var(--mud-palette-primary-text);
        font-size: 0.75rem;
        font-weight: 950;
        border-radius: 999px;
        background: color-mix(in srgb, var(--bb-surface) 12%, transparent);
        border: 1px solid color-mix(in srgb, var(--mud-palette-primary-text) 17%, transparent);
    }

    .bb-onboarding-mobile-progress[b-l2f3zzezq3] {
        display: grid;
        gap: 0.4rem;
        padding: 0.68rem 0.75rem;
        border-radius: 18px;
        background: var(--bb-surface);
        border: 1px solid color-mix(in srgb, var(--bb-primary) 8%, var(--bb-divider));
    }

        .bb-onboarding-mobile-progress div[b-l2f3zzezq3] {
            min-width: 0;
            display: flex;
            justify-content: space-between;
            gap: 0.7rem;
        }

        .bb-onboarding-mobile-progress span[b-l2f3zzezq3] {
            color: var(--bb-secondary);
            font-size: 0.62rem;
            font-weight: 950;
            text-transform: uppercase;
            letter-spacing: 0.05em;
        }

        .bb-onboarding-mobile-progress strong[b-l2f3zzezq3] {
            overflow: hidden;
            color: var(--bb-text);
            font-size: 0.67rem;
            font-weight: 800;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

    .bb-onboarding-mobile-nav[b-l2f3zzezq3] {
        display: grid;
        grid-auto-flow: column;
        grid-auto-columns: minmax(88px, 108px);
        gap: 0.45rem;
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        scroll-snap-type: inline mandatory;
        padding: 0.1rem 0.05rem 0.25rem;
        scrollbar-width: none;
    }

        .bb-onboarding-mobile-nav[b-l2f3zzezq3]::-webkit-scrollbar {
            display: none;
        }

    .bb-onboarding-mobile-step[b-l2f3zzezq3] {
        scroll-snap-align: start;
        min-height: 72px;
        display: grid;
        place-items: center;
        align-content: center;
        gap: 0.28rem;
        padding: 0.5rem;
        color: var(--bb-muted);
        text-align: center;
        cursor: pointer;
        border-radius: 17px;
        background: var(--bb-surface);
        border: 1px solid color-mix(in srgb, var(--bb-primary) 8%, var(--bb-divider));
        box-shadow: 0 8px 20px color-mix(in srgb, var(--bb-text) 4%, transparent);
    }

        .bb-onboarding-mobile-step > span[b-l2f3zzezq3] {
            width: 27px;
            height: 27px;
            display: grid;
            place-items: center;
            border-radius: 9px;
            color: var(--bb-primary);
            font-size: 0.66rem;
            font-weight: 950;
            background: color-mix(in srgb, var(--bb-primary) 8%, var(--bb-surface));
        }

        .bb-onboarding-mobile-step strong[b-l2f3zzezq3] {
            max-width: 100%;
            overflow: hidden;
            font-size: 0.66rem;
            font-weight: 900;
            line-height: 1.08;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .bb-onboarding-mobile-step.is-active[b-l2f3zzezq3] {
            color: var(--mud-palette-primary-text);
            background: linear-gradient(135deg, var(--bb-primary), color-mix(in srgb, var(--bb-primary) 74%, var(--bb-secondary)));
            border-color: transparent;
            box-shadow: 0 14px 30px color-mix(in srgb, var(--bb-primary) 20%, transparent);
        }

            .bb-onboarding-mobile-step.is-active > span[b-l2f3zzezq3] {
                color: var(--mud-palette-secondary-text);
                background: var(--bb-secondary);
            }

        .bb-onboarding-mobile-step.is-complete:not(.is-active) > span[b-l2f3zzezq3] {
            color: var(--mud-palette-success-text);
            background: var(--bb-success);
        }

    .bb-onboarding-studio[b-l2f3zzezq3]  .bb-onboarding-status-alert {
        border-radius: 18px;
    }

    .bb-onboarding-stage-frame[b-l2f3zzezq3] {
        border-radius: 24px;
    }

    .bb-onboarding-stage-header[b-l2f3zzezq3] {
        align-items: flex-start;
        padding: 0.9rem;
    }

    .bb-onboarding-stage-heading[b-l2f3zzezq3] {
        grid-template-columns: 42px minmax(0, 1fr);
        gap: 0.65rem;
    }

    .bb-onboarding-stage-icon[b-l2f3zzezq3] {
        width: 42px;
        height: 42px;
        border-radius: 14px;
    }

    .bb-onboarding-stage-heading h2[b-l2f3zzezq3] {
        font-size: 1.24rem;
    }

    .bb-onboarding-stage-heading p[b-l2f3zzezq3] {
        font-size: 0.78rem;
        line-height: 1.4;
    }

    .bb-onboarding-studio[b-l2f3zzezq3]  .bb-onboarding-stage-chip {
        display: none;
    }

    .bb-onboarding-studio[b-l2f3zzezq3]  .lux-workspace-body {
        padding: 0.72rem;
    }

    .bb-onboarding-studio .lux-section-heading[b-l2f3zzezq3] {
        display: grid;
        gap: 0.55rem;
        padding-bottom: 0.75rem;
    }

        .bb-onboarding-studio .lux-section-heading h3[b-l2f3zzezq3] {
            font-size: 1.2rem;
        }

    .bb-onboarding-studio .lux-service-studio[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-editor-card[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-team-list-card[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-upload-card[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-portfolio-section[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-readiness-panel[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-final-submit-panel[b-l2f3zzezq3] {
        padding: 0.75rem;
        border-radius: 20px;
    }

    .bb-onboarding-studio .lux-service-studio-header[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-editor-card-header[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-team-intro[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-team-list-header[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-upload-copy[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-readiness-heading[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-final-submit-top[b-l2f3zzezq3],
    .bb-onboarding-studio .bb-preview-guidance[b-l2f3zzezq3] {
        grid-template-columns: auto minmax(0, 1fr);
    }

        .bb-onboarding-studio .lux-service-studio-header > :last-child[b-l2f3zzezq3],
        .bb-onboarding-studio .bb-preview-guidance > :last-child[b-l2f3zzezq3] {
            grid-column: 1 / -1;
        }

    .bb-onboarding-studio .lux-service-identity-panel[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-service-booking-panel[b-l2f3zzezq3] {
        padding: 0.72rem;
        border-radius: 18px;
    }

    .bb-onboarding-studio .lux-service-control-card[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-service-control-card-price[b-l2f3zzezq3] {
        grid-template-columns: auto minmax(0, 1fr);
    }

        .bb-onboarding-studio .lux-service-control-card > .lux-field[b-l2f3zzezq3],
        .bb-onboarding-studio .lux-service-control-card > .lux-service-price-fields[b-l2f3zzezq3] {
            grid-column: 1 / -1;
        }

    .bb-onboarding-studio .lux-service-price-fields[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
    }

    .bb-onboarding-studio .lux-service-menu-card[b-l2f3zzezq3] {
        grid-template-columns: 74px minmax(0, 1fr);
        padding: 0.6rem;
        border-radius: 19px;
    }

    .bb-onboarding-studio .lux-service-menu-media[b-l2f3zzezq3] {
        width: 74px;
        height: 72px;
        border-radius: 16px;
    }

    .bb-onboarding-studio .lux-service-actions[b-l2f3zzezq3] {
        grid-column: 1 / -1;
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .bb-onboarding-studio .lux-profile-photo-studio[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
        text-align: center;
        padding: 0.8rem;
        border-radius: 20px;
    }

    .bb-onboarding-studio .lux-profile-photo-visual[b-l2f3zzezq3] {
        width: 148px;
        height: 148px;
    }

    .bb-onboarding-studio .lux-profile-photo-copy[b-l2f3zzezq3] {
        justify-items: center;
    }

    .bb-onboarding-studio .lux-profile-photo-actions[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-profile-photo-tips[b-l2f3zzezq3] {
        justify-content: center;
    }

    .bb-onboarding-studio .lux-service-picker-list[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
    }

    .bb-onboarding-studio .lux-dropzone[b-l2f3zzezq3] {
        min-height: 180px;
        padding: 1rem;
        border-radius: 21px;
    }

    .bb-onboarding-studio .lux-media-grid[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-portfolio-media-grid[b-l2f3zzezq3] {
        grid-template-columns: 1fr 1fr;
        gap: 0.55rem;
    }

    .bb-onboarding-studio .lux-media-card[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-portfolio-card[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-media-card img[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-portfolio-card img[b-l2f3zzezq3] {
        min-height: 150px;
    }

    .bb-onboarding-studio .lux-portfolio-upload-row[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
    }

    .bb-onboarding-studio .lux-portfolio-file-button[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-profile-photo-upload[b-l2f3zzezq3] {
        width: 100%;
    }

    .bb-onboarding-studio .lux-hour-card[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-hour-card-closed[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
        gap: 0.65rem;
        padding: 0.72rem;
        border-radius: 19px;
    }

    .bb-onboarding-studio .lux-hour-day[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-day-switch[b-l2f3zzezq3] {
        width: 100%;
    }

    .bb-onboarding-studio .lux-hour-times[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-breaks[b-l2f3zzezq3] {
        grid-column: auto;
    }

    .bb-onboarding-studio .lux-break-row[b-l2f3zzezq3] {
        grid-template-columns: 1fr 1fr;
    }

        .bb-onboarding-studio .lux-break-row > :first-child[b-l2f3zzezq3] {
            grid-column: 1 / -1;
        }

    .bb-onboarding-studio .bb-public-profile-canvas[b-l2f3zzezq3] {
        padding: 0.35rem;
        border-radius: 22px;
    }

        .bb-onboarding-studio .bb-public-profile-canvas[b-l2f3zzezq3]  .salon-profile-hero,
        .bb-onboarding-studio .bb-public-profile-canvas[b-l2f3zzezq3]  .salon-profile-panel,
        .bb-onboarding-studio .bb-preview-booking-card[b-l2f3zzezq3] {
            border-radius: 22px;
        }

        .bb-onboarding-studio .bb-public-profile-canvas[b-l2f3zzezq3]  .salon-profile-title {
            font-size: 2rem;
        }

        .bb-onboarding-studio .bb-public-profile-canvas[b-l2f3zzezq3]  .salon-service-card {
            pointer-events: none;
        }

    .bb-onboarding-studio .lux-final-review-grid[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
    }

    .bb-onboarding-studio[b-l2f3zzezq3]  .lux-stage-footer {
        position: fixed;
        left: 0.45rem;
        right: 0.45rem;
        bottom: 0.45rem;
        z-index: 1200;
        grid-template-columns: minmax(0, 0.75fr) minmax(0, 1.25fr);
        gap: 0.45rem;
        min-height: 64px;
        padding: 0.55rem;
        border: 1px solid color-mix(in srgb, var(--bb-primary) 12%, var(--bb-divider));
        border-radius: 20px;
        background: color-mix(in srgb, var(--bb-surface) 92%, transparent);
        box-shadow: 0 20px 50px color-mix(in srgb, var(--bb-text) 18%, transparent);
    }

    .bb-onboarding-studio .lux-stage-footer > div[b-l2f3zzezq3] {
        display: none;
    }

    .bb-onboarding-studio[b-l2f3zzezq3]  .lux-stage-footer .mud-button-root {
        width: 100%;
        min-width: 0;
        min-height: 50px;
        padding-inline: 0.55rem;
        border-radius: 15px;
        font-size: 0.72rem;
    }
}

@media (max-width: 520px) {
    .bb-onboarding-studio .lux-media-grid[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-portfolio-media-grid[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
    }

    .bb-onboarding-studio .lux-service-actions[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
    }

    .bb-onboarding-studio .lux-break-row[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
    }

        .bb-onboarding-studio .lux-break-row > :first-child[b-l2f3zzezq3] {
            grid-column: auto;
        }

    .bb-onboarding-studio .bb-preview-guidance[b-l2f3zzezq3] {
        align-items: start;
    }

        .bb-onboarding-studio .bb-preview-guidance > span[b-l2f3zzezq3] {
            width: 40px;
            height: 40px;
            border-radius: 14px;
        }

    .bb-onboarding-studio .bb-public-profile-canvas[b-l2f3zzezq3]  .salon-profile-hero {
        padding: 1rem;
    }

    .bb-onboarding-studio .bb-public-profile-canvas[b-l2f3zzezq3]  .salon-profile-title {
        font-size: 1.75rem;
    }
}

/* ========================================================================== */
/* BOOKBEAUT SALON ATELIER V4 — TARGETED UX REFINEMENT                        */
/* ========================================================================== */

/* Final look uses the complete width so the preview has the same breathing
   room and proportions as the real public salon profile. */
.bb-onboarding-layout.is-preview-stage[b-l2f3zzezq3] {
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
    max-width: 1520px;
    margin-inline: auto;
}

    .bb-onboarding-layout.is-preview-stage > .bb-onboarding-rail[b-l2f3zzezq3] {
        display: none;
    }

    .bb-onboarding-layout.is-preview-stage .bb-onboarding-main[b-l2f3zzezq3],
    .bb-onboarding-layout.is-preview-stage .bb-onboarding-stage-frame[b-l2f3zzezq3],
    .bb-onboarding-layout.is-preview-stage .bb-public-preview-stage[b-l2f3zzezq3] {
        width: 100%;
        min-width: 0;
    }

    .bb-onboarding-layout.is-preview-stage .bb-onboarding-status-alert[b-l2f3zzezq3] {
        display: none;
    }

    .bb-onboarding-layout.is-preview-stage .bb-onboarding-stage-frame[b-l2f3zzezq3] {
        overflow: visible;
    }

    .bb-onboarding-layout.is-preview-stage[b-l2f3zzezq3]  .lux-workspace-body {
        padding: clamp(0.9rem, 1.7vw, 1.45rem);
    }

/* Details: name and address are intentionally full width and read as a calm,
   linear first task rather than a dense two-column form. */
.bb-onboarding-studio[b-l2f3zzezq3]  #basic-salon-details .lux-form-grid {
    row-gap: 0.5rem;
}

.bb-address-verification-card[b-l2f3zzezq3] {
    display: grid;
    gap: 0.9rem;
    padding: clamp(0.95rem, 1.8vw, 1.25rem);
    border-radius: 24px;
    border: 1px solid color-mix(in srgb, var(--bb-primary) 10%, var(--bb-divider));
    background: radial-gradient(circle at 94% 8%, color-mix(in srgb, var(--bb-secondary) 10%, transparent), transparent 32%), linear-gradient(135deg, color-mix(in srgb, var(--bb-surface) 98%, var(--bb-primary)), var(--bb-surface));
    box-shadow: 0 16px 36px color-mix(in srgb, var(--bb-text) 5%, transparent);
}

    .bb-address-verification-card.is-verified[b-l2f3zzezq3] {
        border-color: color-mix(in srgb, var(--bb-success) 28%, var(--bb-divider));
        background: radial-gradient(circle at 92% 12%, color-mix(in srgb, var(--bb-success) 11%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--bb-success) 5%, var(--bb-surface)), var(--bb-surface));
    }

.bb-address-verification-main[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.85rem;
    align-items: center;
}

.bb-address-verification-icon[b-l2f3zzezq3] {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border-radius: 18px;
    color: var(--bb-primary);
    background: color-mix(in srgb, var(--bb-primary) 9%, var(--bb-surface));
    box-shadow: 0 12px 26px color-mix(in srgb, var(--bb-primary) 11%, transparent);
}

.is-verified .bb-address-verification-icon[b-l2f3zzezq3] {
    color: var(--bb-success);
    background: color-mix(in srgb, var(--bb-success) 10%, var(--bb-surface));
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-address-verification-icon .mud-icon-root {
    color: inherit;
    font-size: 1.4rem;
}

.bb-address-verification-copy[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.16rem;
}

    .bb-address-verification-copy small[b-l2f3zzezq3] {
        color: var(--bb-secondary);
        font-size: 0.64rem;
        font-weight: 950;
        letter-spacing: 0.09em;
        text-transform: uppercase;
    }

    .bb-address-verification-copy strong[b-l2f3zzezq3] {
        color: var(--bb-text);
        font-size: 1rem;
        font-weight: 950;
        line-height: 1.18;
    }

    .bb-address-verification-copy p[b-l2f3zzezq3] {
        margin: 0;
        color: var(--bb-muted);
        font-size: 0.82rem;
        font-weight: 620;
        line-height: 1.45;
    }

.bb-address-ready-pill[b-l2f3zzezq3] {
    display: inline-flex;
    align-items: center;
    gap: 0.34rem;
    padding: 0.52rem 0.7rem;
    color: var(--bb-success);
    font-size: 0.7rem;
    font-weight: 900;
    white-space: nowrap;
    border-radius: 999px;
    background: color-mix(in srgb, var(--bb-success) 8%, var(--bb-surface));
    border: 1px solid color-mix(in srgb, var(--bb-success) 18%, var(--bb-divider));
}

.bb-address-verification-details[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(110px, 0.5fr) minmax(120px, 0.55fr);
    gap: 0.6rem;
    padding-top: 0.85rem;
    border-top: 1px solid color-mix(in srgb, var(--bb-primary) 8%, var(--bb-divider));
}

    .bb-address-verification-details > div[b-l2f3zzezq3] {
        min-width: 0;
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-rows: auto auto;
        column-gap: 0.55rem;
        padding: 0.72rem;
        border-radius: 17px;
        background: color-mix(in srgb, var(--bb-surface) 96%, var(--bb-background));
        border: 1px solid color-mix(in srgb, var(--bb-primary) 8%, var(--bb-divider));
    }

        .bb-address-verification-details > div > span[b-l2f3zzezq3] {
            grid-row: 1 / 3;
            align-self: center;
            width: 34px;
            height: 34px;
            display: grid;
            place-items: center;
            color: var(--bb-primary);
            border-radius: 12px;
            background: color-mix(in srgb, var(--bb-primary) 8%, var(--bb-surface));
        }

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-address-verification-details .mud-icon-root {
    color: inherit;
    font-size: 1rem;
}

.bb-address-verification-details small[b-l2f3zzezq3] {
    color: var(--bb-muted);
    font-size: 0.61rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.045em;
}

.bb-address-verification-details strong[b-l2f3zzezq3] {
    overflow: hidden;
    color: var(--bb-text);
    font-size: 0.82rem;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Phone prefix stays aligned with the outlined input even when validation text
   appears underneath it. */
.bb-onboarding-studio .lux-phone-field[b-l2f3zzezq3] {
    position: relative;
    min-width: 0;
}

.bb-onboarding-studio .lux-phone-prefix[b-l2f3zzezq3] {
    top: 8px;
    left: 10px;
    height: 38px;
    min-width: 78px;
    transform: none;
    justify-content: center;
    padding: 0.28rem 0.48rem;
    border-radius: 11px;
    background: color-mix(in srgb, var(--bb-primary) 6%, var(--bb-surface));
    border-color: color-mix(in srgb, var(--bb-primary) 11%, var(--bb-divider));
}

.bb-country-flag-image[b-l2f3zzezq3] {
    width: 24px;
    height: 16px;
    display: block;
    object-fit: cover;
    border-radius: 4px;
    box-shadow: 0 2px 6px color-mix(in srgb, var(--bb-text) 16%, transparent);
}

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-phone-input .mud-input-adornment-start {
    width: 88px;
    min-width: 88px;
    visibility: hidden;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-phone-input .mud-input-helper-text,
.bb-onboarding-studio[b-l2f3zzezq3]  .lux-phone-input .mud-input-error {
    padding-left: 0.15rem;
    line-height: 1.35;
}

.bb-onboarding-studio .bb-timezone-locked-value[b-l2f3zzezq3] {
    min-height: 62px;
    max-width: 100%;
}

/* Services: labels and controls form compact rows on desktop and clean stacked
   cards on mobile. */
.bb-onboarding-studio .bb-service-settings-grid[b-l2f3zzezq3] {
    gap: 0.68rem;
}

.bb-onboarding-studio .bb-service-setting-card[b-l2f3zzezq3] {
    grid-template-columns: minmax(0, 1fr) minmax(180px, 0.72fr);
    gap: 0.85rem;
    padding: 0.8rem;
}

.bb-onboarding-studio .bb-service-setting-head[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.68rem;
    align-items: center;
}

    .bb-onboarding-studio .bb-service-setting-head .lux-service-control-copy[b-l2f3zzezq3] {
        min-width: 0;
        display: grid;
        gap: 0.12rem;
    }

    .bb-onboarding-studio .bb-service-setting-head strong[b-l2f3zzezq3] {
        color: var(--bb-text);
        font-size: 0.88rem;
        font-weight: 950;
        line-height: 1.18;
    }

    .bb-onboarding-studio .bb-service-setting-head small[b-l2f3zzezq3] {
        color: var(--bb-muted);
        font-size: 0.7rem;
        font-weight: 620;
        line-height: 1.35;
    }

.bb-onboarding-studio .bb-service-setting-field[b-l2f3zzezq3] {
    min-width: 0;
}

.bb-onboarding-studio .bb-service-price-card[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.72rem;
}

    .bb-onboarding-studio .bb-service-price-card .lux-service-price-fields[b-l2f3zzezq3] {
        grid-column: auto;
        grid-template-columns: minmax(150px, 0.72fr) minmax(220px, 1.28fr);
    }

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-service-currency-field input {
    overflow: hidden;
    color: var(--bb-text);
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bb-selected-currency[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.55rem;
    align-items: center;
    padding: 0.62rem 0.72rem;
    border-radius: 16px;
    background: color-mix(in srgb, var(--bb-success) 6%, var(--bb-surface));
    border: 1px solid color-mix(in srgb, var(--bb-success) 13%, var(--bb-divider));
}

    .bb-selected-currency > span[b-l2f3zzezq3] {
        color: var(--bb-success);
    }

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-selected-currency .mud-icon-root {
    color: inherit;
}

.bb-selected-currency > div[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.08rem;
}

.bb-selected-currency small[b-l2f3zzezq3] {
    color: var(--bb-muted);
    font-size: 0.61rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.bb-selected-currency strong[b-l2f3zzezq3] {
    overflow: hidden;
    color: var(--bb-text);
    font-size: 0.78rem;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Team remains the same flow, with slightly stronger visual hierarchy. */
.bb-onboarding-studio .lux-profile-photo-studio[b-l2f3zzezq3] {
    padding: 1rem;
    border-radius: 24px;
    background: radial-gradient(circle at 90% 10%, color-mix(in srgb, var(--bb-secondary) 9%, transparent), transparent 36%), color-mix(in srgb, var(--bb-primary) 3%, var(--bb-surface));
}

.bb-onboarding-studio .lux-profile-photo-visual[b-l2f3zzezq3] {
    box-shadow: 0 18px 44px color-mix(in srgb, var(--bb-primary) 15%, transparent);
}

.bb-onboarding-studio .lux-service-choice-selected[b-l2f3zzezq3] {
    border-color: color-mix(in srgb, var(--bb-success) 35%, var(--bb-divider));
    background: color-mix(in srgb, var(--bb-success) 6%, var(--bb-surface));
}

/* Photos: more breathing room, a full-width cover row and two equal gallery
   cards underneath. */
.bb-onboarding-studio .lux-upload-card[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: minmax(230px, 0.8fr) minmax(260px, 1fr);
    gap: 1rem;
    align-items: stretch;
    padding: clamp(1rem, 2vw, 1.35rem);
}

.bb-onboarding-studio .lux-upload-copy[b-l2f3zzezq3] {
    min-width: 0;
    align-self: center;
}

.bb-onboarding-studio .lux-upload-card > .lux-field[b-l2f3zzezq3] {
    grid-column: 1;
    align-self: end;
}

.bb-onboarding-studio .lux-upload-card > .lux-dropzone[b-l2f3zzezq3] {
    grid-column: 2;
    grid-row: 1 / 3;
    min-height: 230px;
    margin: 0.2rem;
}

.bb-onboarding-studio .lux-upload-card > .mud-progress-linear[b-l2f3zzezq3] {
    grid-column: 1 / -1;
}

.bb-onboarding-studio .lux-media-grid[b-l2f3zzezq3] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
}

    .bb-onboarding-studio .lux-media-grid > figure[b-l2f3zzezq3] {
        min-height: 270px;
    }

        .bb-onboarding-studio .lux-media-grid > figure img[b-l2f3zzezq3] {
            min-height: 270px;
        }

    .bb-onboarding-studio .lux-media-grid > .owner-media-card-primary[b-l2f3zzezq3] {
        grid-column: 1 / -1;
        min-height: clamp(340px, 40vw, 470px);
    }

        .bb-onboarding-studio .lux-media-grid > .owner-media-card-primary img[b-l2f3zzezq3] {
            min-height: clamp(340px, 40vw, 470px);
        }

.bb-onboarding-studio .lux-portfolio-card[b-l2f3zzezq3] {
    padding: 0.95rem;
}

    .bb-onboarding-studio .lux-portfolio-card > header[b-l2f3zzezq3] {
        gap: 0.8rem;
        padding: 0.15rem 0.1rem 0.75rem;
    }

.bb-onboarding-studio .lux-portfolio-service[b-l2f3zzezq3] {
    min-width: 0;
    padding: 0.52rem 0.65rem;
}

    .bb-onboarding-studio .lux-portfolio-service > div[b-l2f3zzezq3] {
        min-width: 0;
        padding-right: 0.25rem;
    }

    .bb-onboarding-studio .lux-portfolio-service strong[b-l2f3zzezq3],
    .bb-onboarding-studio .lux-portfolio-service small[b-l2f3zzezq3] {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.bb-onboarding-studio .lux-portfolio-upload-row[b-l2f3zzezq3] {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.8rem;
    padding-top: 0.2rem;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-portfolio-description-field .mud-input-label,
.bb-onboarding-studio[b-l2f3zzezq3]  .lux-portfolio-description-field input {
    font-size: 0.78rem;
}

/* Final look: reuse the existing OwnerSalonPublicPreview component and remove
   its owner-only chrome so the stage itself reads like the public page. */
.bb-final-public-preview[b-l2f3zzezq3] {
    width: 100%;
    min-width: 0;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-root,
.bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-shell,
.bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-live-page {
    width: 100%;
    min-width: 0;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-shell {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-header,
.bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-alert {
    display: none;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-hero {
    grid-template-columns: minmax(0, 1.35fr) minmax(360px, 0.65fr);
    gap: 1.35rem;
    padding: clamp(1.45rem, 2.6vw, 2.35rem);
    border-radius: 32px;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-hero-card {
    min-height: 390px;
    border-radius: 28px;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-salon-name {
    font-size: clamp(2rem, 3.5vw, 3.15rem);
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-content-grid {
    grid-template-columns: minmax(0, 1fr) minmax(330px, 390px);
    gap: 1.2rem;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-panel,
.bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-side-card {
    padding: 1.25rem;
    border-radius: 28px;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-gallery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-gallery-card-primary {
    grid-column: 1 / -1;
    min-height: 360px;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-gallery-card:not(.owner-public-preview-gallery-card-primary) {
    min-height: 240px;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-service-card {
    min-height: 142px;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-side-column {
    align-self: start;
}

/* Responsive refinements */
@media (max-width: 1100px) {
    .bb-onboarding-studio .bb-service-setting-card[b-l2f3zzezq3] {
        grid-template-columns: minmax(0, 1fr);
    }

    .bb-onboarding-studio .bb-service-price-card .lux-service-price-fields[b-l2f3zzezq3] {
        grid-template-columns: 1fr 1fr;
    }

    .bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-hero {
        grid-template-columns: 1fr;
    }

    .bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-hero-card {
        min-height: 440px;
    }
}

@media (max-width: 760px) {
    .bb-address-verification-main[b-l2f3zzezq3] {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .bb-address-ready-pill[b-l2f3zzezq3] {
        grid-column: 1 / -1;
        width: fit-content;
        margin-left: 3.9rem;
    }

    .bb-address-verification-details[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
    }

    .bb-onboarding-studio .lux-upload-card[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
    }

        .bb-onboarding-studio .lux-upload-card > .lux-field[b-l2f3zzezq3],
        .bb-onboarding-studio .lux-upload-card > .lux-dropzone[b-l2f3zzezq3] {
            grid-column: 1;
            grid-row: auto;
        }

        .bb-onboarding-studio .lux-upload-card > .lux-dropzone[b-l2f3zzezq3] {
            min-height: 190px;
            margin: 0.35rem 0 0;
        }

    .bb-onboarding-studio .lux-media-grid[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
    }

        .bb-onboarding-studio .lux-media-grid > .owner-media-card-primary[b-l2f3zzezq3] {
            grid-column: auto;
            min-height: 300px;
        }

            .bb-onboarding-studio .lux-media-grid > .owner-media-card-primary img[b-l2f3zzezq3] {
                min-height: 300px;
            }

    .bb-onboarding-studio .lux-portfolio-upload-row[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
    }

    .bb-onboarding-studio .lux-portfolio-file-button[b-l2f3zzezq3] {
        width: 100%;
        min-height: 48px;
        justify-content: center;
    }

    .bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-content-grid {
        grid-template-columns: 1fr;
    }

    .bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-hero-card {
        min-height: 360px;
    }
}

@media (max-width: 600px) {
    .bb-onboarding-studio .lux-phone-prefix[b-l2f3zzezq3] {
        top: 8px;
        left: 9px;
        min-width: 76px;
    }

    .bb-onboarding-studio[b-l2f3zzezq3]  .lux-phone-input .mud-input-adornment-start {
        width: 84px;
        min-width: 84px;
    }

    .bb-onboarding-studio .bb-service-price-card .lux-service-price-fields[b-l2f3zzezq3] {
        grid-template-columns: 1fr;
    }

    .bb-onboarding-studio .bb-service-setting-card[b-l2f3zzezq3],
    .bb-onboarding-studio .bb-service-price-card[b-l2f3zzezq3] {
        padding: 0.72rem;
    }

    .bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-hero {
        padding: 1rem;
        border-radius: 24px;
    }

    .bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-hero-card {
        min-height: 310px;
    }

    .bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-gallery-grid {
        grid-template-columns: 1fr;
    }

    .bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-public-preview .owner-public-preview-gallery-card-primary {
        grid-column: auto;
        min-height: 260px;
    }
}


/* BB-SALON-ONBOARDING-V5 — focused service, team and final-review refinements */
.bb-onboarding-studio .bb-service-setting-card[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.72rem;
    align-items: stretch;
    padding: 0.9rem;
}

.bb-onboarding-studio .bb-service-setting-head[b-l2f3zzezq3] {
    width: 100%;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
}

    .bb-onboarding-studio .bb-service-setting-head .lux-service-control-copy[b-l2f3zzezq3] {
        gap: 0.16rem;
    }

    .bb-onboarding-studio .bb-service-setting-head strong[b-l2f3zzezq3] {
        font-size: 0.95rem;
        line-height: 1.14;
    }

    .bb-onboarding-studio .bb-service-setting-head small[b-l2f3zzezq3] {
        max-width: 330px;
        font-size: 0.74rem;
        line-height: 1.42;
    }

.bb-onboarding-studio .bb-service-setting-field[b-l2f3zzezq3] {
    width: min(100%, 230px);
    max-width: 230px;
    justify-self: start;
}

.bb-onboarding-studio .bb-service-price-card[b-l2f3zzezq3] {
    gap: 0.85rem;
}

    .bb-onboarding-studio .bb-service-price-card .bb-service-price-stack[b-l2f3zzezq3] {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 0.72rem;
        width: 100%;
    }

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-service-currency-field,
.bb-onboarding-studio[b-l2f3zzezq3]  .bb-service-currency-field .mud-input-control,
.bb-onboarding-studio[b-l2f3zzezq3]  .bb-service-currency-field .mud-input,
.bb-onboarding-studio[b-l2f3zzezq3]  .bb-service-currency-field .mud-input-root,
.bb-onboarding-studio[b-l2f3zzezq3]  .bb-service-currency-field .mud-input-slot {
    width: 100%;
    min-width: 0;
    max-width: 100%;
}

    .bb-onboarding-studio[b-l2f3zzezq3]  .bb-service-currency-field input {
        width: 100%;
        min-width: 0;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-service-price-field {
    width: min(100%, 250px);
    max-width: 250px;
}

.bb-onboarding-studio .bb-selected-currency[b-l2f3zzezq3] {
    width: 100%;
    max-width: 100%;
}

.bb-onboarding-studio .lux-profile-photo-visual[b-l2f3zzezq3] {
    background: transparent !important;
    box-shadow: none !important;
    filter: none !important;
}

.bb-onboarding-studio .lux-profile-photo-ring[b-l2f3zzezq3] {
    border-radius: 50%;
    box-shadow: 0 22px 50px color-mix(in srgb, var(--bb-primary) 18%, transparent), 0 0 0 1px color-mix(in srgb, var(--bb-primary) 10%, var(--bb-divider));
}

    .bb-onboarding-studio .lux-profile-photo-ring img[b-l2f3zzezq3] {
        border-radius: 50%;
    }

.bb-onboarding-studio .lux-form-grid[b-l2f3zzezq3] {
    row-gap: 0.22rem;
}

.bb-onboarding-studio .bb-final-submit-card[b-l2f3zzezq3] {
    position: sticky;
    top: 96px;
    display: grid;
    gap: 0.9rem;
    padding: 1rem;
    background: radial-gradient(circle at 92% 8%, color-mix(in srgb, var(--bb-secondary) 10%, transparent), transparent 34%), linear-gradient(145deg, color-mix(in srgb, var(--bb-surface) 98%, var(--bb-primary)), var(--bb-surface));
}

.bb-onboarding-studio .bb-final-submit-header[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.72rem;
    align-items: start;
}

    .bb-onboarding-studio .bb-final-submit-header > div:nth-child(2)[b-l2f3zzezq3] {
        min-width: 0;
    }

        .bb-onboarding-studio .bb-final-submit-header > div:nth-child(2) > small[b-l2f3zzezq3] {
            color: var(--bb-secondary);
            font-size: 0.64rem;
            font-weight: 950;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }

        .bb-onboarding-studio .bb-final-submit-header > div:nth-child(2) > strong[b-l2f3zzezq3] {
            display: block;
            margin-top: 0.16rem;
            color: var(--bb-text);
            font-size: 1.02rem;
            font-weight: 950;
            line-height: 1.18;
        }

        .bb-onboarding-studio .bb-final-submit-header > div:nth-child(2) > p[b-l2f3zzezq3] {
            margin: 0.24rem 0 0;
            color: var(--bb-muted);
            font-size: 0.78rem;
            font-weight: 620;
            line-height: 1.48;
        }

.bb-final-submit-status[b-l2f3zzezq3] {
    grid-column: 1 / -1;
    width: fit-content;
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    gap: 0.42rem;
    padding: 0.5rem 0.66rem;
    color: var(--bb-primary);
    font-size: 0.72rem;
    font-weight: 850;
    line-height: 1.25;
    border-radius: 13px;
    background: color-mix(in srgb, var(--bb-primary) 6%, var(--bb-surface));
    border: 1px solid color-mix(in srgb, var(--bb-primary) 10%, var(--bb-divider));
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-submit-status .mud-icon-root {
    flex: 0 0 auto;
    color: currentColor;
}

.bb-final-submit-status.is-ready[b-l2f3zzezq3] {
    color: var(--bb-success);
    background: color-mix(in srgb, var(--bb-success) 6%, var(--bb-surface));
    border-color: color-mix(in srgb, var(--bb-success) 13%, var(--bb-divider));
}

.bb-final-submit-summary[b-l2f3zzezq3] {
    display: grid;
    gap: 0.58rem;
}

.bb-final-submit-summary-item[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.58rem;
    align-items: center;
    padding: 0.68rem;
    border-radius: 16px;
    background: color-mix(in srgb, var(--bb-secondary) 5%, var(--bb-surface));
    border: 1px solid color-mix(in srgb, var(--bb-secondary) 10%, var(--bb-divider));
}

    .bb-final-submit-summary-item > span[b-l2f3zzezq3] {
        width: 36px;
        height: 36px;
        display: grid;
        place-items: center;
        border-radius: 12px;
        background: color-mix(in srgb, var(--bb-secondary) 12%, var(--bb-surface));
    }

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-submit-summary-item > span .mud-icon-root {
    color: var(--bb-secondary);
    font-size: 1.05rem;
}

.bb-final-submit-summary-item > div[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.12rem;
}

.bb-final-submit-summary-item strong[b-l2f3zzezq3] {
    color: var(--bb-text);
    font-size: 0.78rem;
    font-weight: 950;
}

.bb-final-submit-summary-item small[b-l2f3zzezq3] {
    color: var(--bb-muted);
    font-size: 0.7rem;
    font-weight: 620;
    line-height: 1.42;
}

.bb-final-submit-privacy[b-l2f3zzezq3] {
    display: flex;
    align-items: flex-start;
    gap: 0.42rem;
    color: var(--bb-muted);
    font-size: 0.68rem;
    font-weight: 650;
    line-height: 1.4;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-final-submit-privacy .mud-icon-root {
    flex: 0 0 auto;
    margin-top: 0.05rem;
    color: var(--bb-primary);
}

@media (max-width: 600px) {
    .bb-onboarding-studio .bb-service-setting-field[b-l2f3zzezq3],
    .bb-onboarding-studio[b-l2f3zzezq3]  .bb-service-price-field {
        width: 100%;
        max-width: 100%;
    }

    .bb-onboarding-studio .bb-service-setting-card[b-l2f3zzezq3] {
        padding: 0.78rem;
    }

    .bb-onboarding-studio .bb-final-submit-card[b-l2f3zzezq3] {
        position: static;
        padding: 0.85rem;
    }
}

/* BB-SALON-ONBOARDING-V6 — Serbia launch validation, locked currency and final visual polish */
.salon-onboarding-luxury[b-l2f3zzezq3],
.salon-onboarding-luxury button[b-l2f3zzezq3],
.salon-onboarding-luxury input[b-l2f3zzezq3],
.salon-onboarding-luxury textarea[b-l2f3zzezq3],
.salon-onboarding-luxury select[b-l2f3zzezq3],
.salon-onboarding-luxury label[b-l2f3zzezq3],
.salon-onboarding-luxury small[b-l2f3zzezq3],
.salon-onboarding-luxury strong[b-l2f3zzezq3],
.salon-onboarding-luxury span[b-l2f3zzezq3],
.salon-onboarding-luxury p[b-l2f3zzezq3],
.salon-onboarding-luxury h1[b-l2f3zzezq3],
.salon-onboarding-luxury h2[b-l2f3zzezq3],
.salon-onboarding-luxury h3[b-l2f3zzezq3],
.salon-onboarding-luxury h4[b-l2f3zzezq3],
.salon-onboarding-luxury[b-l2f3zzezq3]  .mud-typography,
.salon-onboarding-luxury[b-l2f3zzezq3]  .mud-button-label,
.salon-onboarding-luxury[b-l2f3zzezq3]  .mud-chip-content,
.salon-onboarding-luxury[b-l2f3zzezq3]  .mud-input-label,
.salon-onboarding-luxury[b-l2f3zzezq3]  .mud-input-helper-text,
.salon-onboarding-luxury[b-l2f3zzezq3]  .mud-select-input,
.salon-onboarding-luxury[b-l2f3zzezq3]  .mud-input-slot {
    font-family: inherit !important;
}

.bb-onboarding-studio .lux-phone-prefix[b-l2f3zzezq3] {
    min-width: 82px;
    gap: 0.42rem;
}

.bb-onboarding-studio .bb-country-flag-image[b-l2f3zzezq3] {
    width: 25px;
    height: 17px;
    border-radius: 5px;
    object-fit: cover;
    object-position: center;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-phone-input input {
    letter-spacing: 0.015em;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-phone-input .mud-input-error,
.bb-onboarding-studio[b-l2f3zzezq3]  .lux-phone-input .mud-input-helper-text {
    width: 100%;
    margin-top: 0.2rem;
    padding-left: 0.2rem !important;
    text-align: left;
}

/* Compact time controls: labels remain above the controls, while the inputs no
   longer stretch across the entire booking panel on desktop. */
.bb-onboarding-studio .bb-service-setting-card:not(.bb-service-price-card) .bb-service-setting-field[b-l2f3zzezq3] {
    width: min(100%, 205px);
    max-width: 205px;
    justify-self: start;
}

.bb-onboarding-studio .bb-service-price-card .bb-service-price-stack[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.72rem;
}

.bb-locked-service-currency[b-l2f3zzezq3] {
    width: min(100%, 420px);
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.72rem;
    padding: 0.78rem 0.82rem;
    border: 1px solid color-mix(in srgb, var(--bb-success) 15%, var(--bb-divider));
    border-radius: 16px;
    background: radial-gradient(circle at 94% 8%, color-mix(in srgb, var(--bb-success) 8%, transparent), transparent 38%), color-mix(in srgb, var(--bb-success) 5%, var(--bb-surface));
}

.bb-locked-service-currency-icon[b-l2f3zzezq3] {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    color: var(--bb-success);
    border-radius: 14px;
    background: color-mix(in srgb, var(--bb-success) 11%, var(--bb-surface));
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-locked-service-currency-icon .mud-icon-root,
.bb-onboarding-studio[b-l2f3zzezq3]  .bb-locked-service-currency > .mud-icon-root {
    color: inherit;
}

.bb-locked-service-currency > div[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.1rem;
}

.bb-locked-service-currency small[b-l2f3zzezq3] {
    color: var(--bb-muted);
    font-size: 0.62rem;
    font-weight: 900;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.bb-locked-service-currency strong[b-l2f3zzezq3] {
    overflow: hidden;
    color: var(--bb-text);
    font-size: 0.88rem;
    font-weight: 950;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bb-locked-service-currency span:not(.bb-locked-service-currency-icon)[b-l2f3zzezq3] {
    color: var(--bb-muted);
    font-size: 0.7rem;
    font-weight: 650;
    line-height: 1.35;
}

.bb-locked-service-currency > .mud-icon-root[b-l2f3zzezq3] {
    color: var(--bb-muted) !important;
    font-size: 1rem;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-service-price-field {
    width: min(100%, 230px);
    max-width: 230px;
    justify-self: start;
}

/* The portrait is a true circular control with no square surface behind it. */
.bb-onboarding-studio .lux-profile-photo-visual[b-l2f3zzezq3] {
    width: fit-content;
    height: fit-content;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: transparent !important;
    box-shadow: none !important;
}

.bb-onboarding-studio .lux-profile-photo-ring[b-l2f3zzezq3] {
    overflow: hidden;
    border-radius: 50% !important;
    background: color-mix(in srgb, var(--bb-primary) 5%, var(--bb-surface));
}

/* Keep the optional description and the custom upload control perfectly aligned. */
.bb-onboarding-studio .lux-portfolio-upload-row[b-l2f3zzezq3] {
    align-items: start;
}

.bb-onboarding-studio .lux-portfolio-file-button[b-l2f3zzezq3] {
    width: 158px;
    min-width: 158px;
    height: 56px;
    min-height: 56px;
    align-self: start;
    margin: 0;
    border-radius: 15px;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-portfolio-description-field,
.bb-onboarding-studio[b-l2f3zzezq3]  .lux-portfolio-description-field .mud-input-control,
.bb-onboarding-studio[b-l2f3zzezq3]  .lux-portfolio-description-field .mud-input-root {
    width: 100%;
    min-width: 0;
}

@media (max-width: 600px) {
    .bb-onboarding-studio .bb-service-setting-card:not(.bb-service-price-card) .bb-service-setting-field[b-l2f3zzezq3],
    .bb-onboarding-studio[b-l2f3zzezq3]  .bb-service-price-field,
    .bb-locked-service-currency[b-l2f3zzezq3] {
        width: 100%;
        max-width: 100%;
    }

    .bb-onboarding-studio .lux-portfolio-file-button[b-l2f3zzezq3] {
        width: 100%;
        min-width: 0;
    }
}

/* ========================================================================== */
/* BOOKBEAUT SALON ONBOARDING V6.1 — FINAL VISUAL POLISH                      */
/* ========================================================================== */

/* Country flag rendering.
   Keep browser interpolation enabled: crisp-edges/pixelated makes the coat of
   arms visibly jagged. The UI uses a stable 3:2 flag viewport. */
.bb-onboarding-studio .lux-phone-prefix[b-l2f3zzezq3] {
    min-width: 82px;
    gap: 0.42rem;
    padding-inline: 0.46rem;
}

.bb-onboarding-studio .bb-country-flag-image[b-l2f3zzezq3] {
    flex: 0 0 24px;
    width: 24px !important;
    min-width: 24px;
    max-width: 24px;
    height: 16px !important;
    min-height: 16px;
    max-height: 16px;
    display: block;
    object-fit: cover;
    object-position: center;
    border: 0;
    border-radius: 3px;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
    image-rendering: auto !important;
    backface-visibility: hidden;
}

/* The previous fit-content override collapsed the portrait control around the
   fallback icon. Keep a real, generous circular portrait on every state. */
.bb-onboarding-studio .lux-profile-photo-visual[b-l2f3zzezq3] {
    width: 200px !important;
    min-width: 200px;
    max-width: 200px;
    height: 200px !important;
    min-height: 200px;
    max-height: 200px;
    aspect-ratio: 1;
    margin-inline: auto;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: transparent !important;
    box-shadow: none !important;
}

.bb-onboarding-studio .lux-profile-photo-ring[b-l2f3zzezq3] {
    width: 100% !important;
    height: 100% !important;
    border-width: 8px;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-profile-photo-ring > .mud-icon-root {
    font-size: 5.5rem;
}

.bb-onboarding-studio .lux-profile-photo-camera[b-l2f3zzezq3] {
    right: 8px;
    bottom: 12px;
    width: 58px;
    height: 58px;
    border-radius: 19px;
}

@media (max-width: 760px) {
    .bb-onboarding-studio .lux-profile-photo-visual[b-l2f3zzezq3] {
        width: 190px !important;
        min-width: 190px;
        max-width: 190px;
        height: 190px !important;
        min-height: 190px;
        max-height: 190px;
    }

    .bb-onboarding-studio .lux-profile-photo-camera[b-l2f3zzezq3] {
        width: 54px;
        height: 54px;
    }
}

@media (max-width: 420px) {
    .bb-onboarding-studio .lux-profile-photo-visual[b-l2f3zzezq3] {
        width: 176px !important;
        min-width: 176px;
        max-width: 176px;
        height: 176px !important;
        min-height: 176px;
        max-height: 176px;
    }
}


/* BB-ONBOARDING-SEQUENCE-01 strict guided flow and top review submit */
.bb-onboarding-mobile-step.is-disabled[b-l2f3zzezq3],
.bb-onboarding-mobile-step:disabled[b-l2f3zzezq3] {
    cursor: not-allowed;
    opacity: 0.44;
    box-shadow: none;
}

.bb-onboarding-top-submit[b-l2f3zzezq3] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) minmax(230px, auto);
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border-radius: 24px;
    background: radial-gradient(circle at 92% 8%, color-mix(in srgb, var(--bb-secondary) 11%, transparent), transparent 36%), linear-gradient(145deg, color-mix(in srgb, var(--bb-surface) 98%, var(--bb-primary)), var(--bb-surface));
    border: 1px solid color-mix(in srgb, var(--bb-secondary) 18%, var(--bb-divider));
    box-shadow: 0 18px 44px color-mix(in srgb, var(--bb-primary) 8%, transparent);
}

.bb-onboarding-top-submit-icon[b-l2f3zzezq3] {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    color: var(--mud-palette-secondary-text);
    border-radius: 18px;
    background: linear-gradient(135deg, var(--bb-secondary), color-mix(in srgb, var(--bb-secondary) 72%, var(--bb-primary)));
    box-shadow: 0 14px 30px color-mix(in srgb, var(--bb-secondary) 22%, transparent);
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-onboarding-top-submit-icon .mud-icon-root {
    color: inherit;
    font-size: 1.3rem;
}

.bb-onboarding-top-submit-copy[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    gap: 0.22rem;
}

    .bb-onboarding-top-submit-copy > small[b-l2f3zzezq3] {
        color: var(--bb-secondary);
        font-size: 0.64rem;
        font-weight: 950;
        letter-spacing: 0.09em;
        text-transform: uppercase;
    }

    .bb-onboarding-top-submit-copy > strong[b-l2f3zzezq3] {
        color: var(--bb-text);
        font-size: 1.08rem;
        font-weight: 950;
        line-height: 1.2;
    }

    .bb-onboarding-top-submit-copy > p[b-l2f3zzezq3] {
        max-width: 760px;
        margin: 0;
        color: var(--bb-muted);
        font-size: 0.8rem;
        font-weight: 620;
        line-height: 1.46;
    }

    .bb-onboarding-top-submit-copy > span[b-l2f3zzezq3] {
        width: fit-content;
        max-width: 100%;
        display: inline-flex;
        align-items: center;
        gap: 0.38rem;
        margin-top: 0.2rem;
        padding: 0.42rem 0.58rem;
        color: var(--bb-primary);
        font-size: 0.7rem;
        font-weight: 850;
        line-height: 1.28;
        border-radius: 12px;
        background: color-mix(in srgb, var(--bb-primary) 6%, var(--bb-surface));
        border: 1px solid color-mix(in srgb, var(--bb-primary) 10%, var(--bb-divider));
    }

        .bb-onboarding-top-submit-copy > span.is-ready[b-l2f3zzezq3] {
            color: var(--bb-success);
            background: color-mix(in srgb, var(--bb-success) 7%, var(--bb-surface));
            border-color: color-mix(in srgb, var(--bb-success) 14%, var(--bb-divider));
        }

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-onboarding-top-submit-copy > span .mud-icon-root {
    flex: 0 0 auto;
    color: currentColor;
}

.bb-onboarding-top-submit-action[b-l2f3zzezq3] {
    min-width: 0;
    display: grid;
    justify-items: stretch;
    gap: 0.42rem;
}

.bb-onboarding-studio[b-l2f3zzezq3]  .bb-onboarding-top-submit-button {
    min-height: 48px;
    border-radius: 14px;
    font-size: 0.76rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.bb-onboarding-top-submit-action > small[b-l2f3zzezq3] {
    max-width: 300px;
    color: var(--bb-muted);
    font-size: 0.66rem;
    font-weight: 650;
    line-height: 1.38;
    text-align: center;
}

.lux-optional-polish-list[b-l2f3zzezq3] {
    display: grid;
    gap: 0.5rem;
    padding: 0.72rem;
    border-radius: 17px;
    background: color-mix(in srgb, var(--bb-info) 5%, var(--bb-surface));
    border: 1px solid color-mix(in srgb, var(--bb-info) 11%, var(--bb-divider));
}

    .lux-optional-polish-list > small[b-l2f3zzezq3] {
        color: var(--bb-info);
        font-size: 0.64rem;
        font-weight: 950;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .lux-optional-polish-list > button[b-l2f3zzezq3] {
        width: 100%;
        display: grid;
        grid-template-columns: auto minmax(0, 1fr) auto;
        align-items: center;
        gap: 0.55rem;
        padding: 0.62rem;
        color: var(--bb-text);
        font: inherit;
        text-align: left;
        cursor: pointer;
        border-radius: 13px;
        background: var(--bb-surface);
        border: 1px solid color-mix(in srgb, var(--bb-info) 10%, var(--bb-divider));
    }

        .lux-optional-polish-list > button > span[b-l2f3zzezq3] {
            min-width: 0;
            font-size: 0.75rem;
            font-weight: 850;
        }

        .lux-optional-polish-list > button > small[b-l2f3zzezq3] {
            color: var(--bb-muted);
            font-size: 0.65rem;
            font-weight: 750;
        }

.bb-onboarding-studio[b-l2f3zzezq3]  .lux-optional-polish-list > button .mud-icon-root {
    color: var(--bb-info);
    font-size: 1rem;
}

@media (max-width: 900px) {
    .bb-onboarding-top-submit[b-l2f3zzezq3] {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .bb-onboarding-top-submit-action[b-l2f3zzezq3] {
        grid-column: 1 / -1;
    }

        .bb-onboarding-top-submit-action > small[b-l2f3zzezq3] {
            max-width: none;
        }
}

@media (max-width: 600px) {
    .bb-onboarding-top-submit[b-l2f3zzezq3] {
        grid-template-columns: minmax(0, 1fr);
        justify-items: stretch;
        padding: 0.85rem;
        border-radius: 20px;
    }

    .bb-onboarding-top-submit-icon[b-l2f3zzezq3] {
        width: 46px;
        height: 46px;
        border-radius: 15px;
    }

    .bb-onboarding-top-submit-copy > span[b-l2f3zzezq3] {
        width: 100%;
    }

    .bb-onboarding-top-submit-action[b-l2f3zzezq3] {
        grid-column: auto;
    }

    .bb-onboarding-studio[b-l2f3zzezq3]  .bb-onboarding-top-submit-button {
        width: 100%;
    }

    .lux-optional-polish-list > button[b-l2f3zzezq3] {
        grid-template-columns: auto minmax(0, 1fr);
    }

        .lux-optional-polish-list > button > small[b-l2f3zzezq3] {
            grid-column: 2;
        }
}
/* /Components/Pages/SalonProfile.razor.rz.scp.css */
.salon-profile-page[b-4401q130fg] {
    --profile-primary: var(--mud-palette-primary);
    --profile-secondary: var(--mud-palette-secondary);
    --profile-surface: var(--mud-palette-surface);
    --profile-background: var(--mud-palette-background);
    --profile-text: var(--mud-palette-text-primary);
    --profile-muted: var(--mud-palette-text-secondary);
    --profile-divider: var(--mud-palette-divider);
    padding-bottom: 3rem;
}

    .salon-profile-page[b-4401q130fg]  .profile-loading-panel {
        min-height: 360px;
        display: grid;
        place-items: center;
        padding: 2rem;
        border: 1px solid color-mix(in srgb, var(--profile-primary) 10%, var(--profile-divider));
        background: color-mix(in srgb, var(--profile-surface) 96%, var(--profile-background));
        border-radius: 22px;
    }

    .salon-profile-page[b-4401q130fg]  .profile-error-alert {
        border-radius: 16px;
    }

    .salon-profile-page[b-4401q130fg]  .profile-status-hero {
        position: relative;
        overflow: hidden;
        padding: clamp(1.15rem, 2.1vw, 1.85rem);
        border: 1px solid color-mix(in srgb, var(--profile-secondary) 22%, var(--profile-divider));
        background: radial-gradient(circle at 82% 8%, color-mix(in srgb, var(--profile-secondary) 15%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--profile-surface) 97%, var(--profile-secondary)), color-mix(in srgb, var(--profile-background) 80%, var(--profile-surface)));
        border-radius: 26px;
        box-shadow: 0 22px 54px color-mix(in srgb, var(--profile-primary) 10%, transparent);
    }

.profile-status-glow[b-4401q130fg] {
    position: absolute;
    z-index: 0;
    border-radius: 999px;
    pointer-events: none;
    filter: blur(2px);
}

.profile-status-glow-one[b-4401q130fg] {
    width: 260px;
    height: 260px;
    right: -90px;
    top: -110px;
    background: color-mix(in srgb, var(--profile-secondary) 16%, transparent);
}

.profile-status-glow-two[b-4401q130fg] {
    width: 230px;
    height: 230px;
    left: -120px;
    bottom: -120px;
    background: color-mix(in srgb, var(--profile-primary) 10%, transparent);
}

.profile-status-hero-grid[b-4401q130fg],
.profile-hero-actions[b-4401q130fg] {
    position: relative;
    z-index: 1;
}

.profile-status-hero-grid[b-4401q130fg] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
    gap: 1rem;
    align-items: stretch;
}

.profile-status-copy[b-4401q130fg] {
    display: grid;
    gap: 1rem;
    align-content: start;
}

.profile-status-kicker-row[b-4401q130fg] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.profile-status-icon-badge[b-4401q130fg] {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    color: #ffffff;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--profile-primary), var(--profile-secondary));
    box-shadow: 0 14px 30px color-mix(in srgb, var(--profile-primary) 16%, transparent);
}

.salon-profile-page[b-4401q130fg]  .profile-status-icon-badge .mud-icon-root {
    color: #ffffff !important;
    font-size: 1.35rem;
}

.salon-profile-page[b-4401q130fg]  .profile-eyebrow {
    margin-top: 0.32rem;
    color: var(--profile-secondary);
    font-size: 0.7rem;
    font-weight: 950;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.salon-profile-page[b-4401q130fg]  .profile-hero-title {
    max-width: 780px;
    color: var(--profile-primary);
    font-weight: 950;
    line-height: 1.05;
    letter-spacing: -0.05em;
    text-wrap: balance;
}

.salon-profile-page[b-4401q130fg]  .profile-hero-subtitle {
    max-width: 800px;
    color: var(--profile-muted);
    font-size: 1rem;
    font-weight: 650;
    line-height: 1.55;
}

.profile-status-note[b-4401q130fg] {
    width: fit-content;
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.62rem 0.76rem;
    color: var(--profile-text);
    font-size: 0.82rem;
    font-weight: 760;
    border-radius: 14px;
    background: color-mix(in srgb, var(--profile-primary) 6%, var(--profile-surface));
    border: 1px solid color-mix(in srgb, var(--profile-primary) 10%, var(--profile-divider));
}

.salon-profile-page[b-4401q130fg]  .profile-status-note .mud-icon-root {
    color: var(--profile-secondary);
}

.profile-status-side-card[b-4401q130fg] {
    display: grid;
    gap: 0.7rem;
    align-content: start;
    padding: 1rem;
    border-radius: 22px;
    background: color-mix(in srgb, var(--profile-surface) 82%, transparent);
    border: 1px solid color-mix(in srgb, var(--profile-primary) 10%, var(--profile-divider));
    box-shadow: 0 14px 32px color-mix(in srgb, var(--profile-primary) 7%, transparent);
}

    .profile-status-side-card > span[b-4401q130fg] {
        color: var(--profile-secondary);
        font-size: 0.68rem;
        font-weight: 950;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .profile-status-side-card > strong[b-4401q130fg] {
        color: var(--profile-primary);
        font-size: 2rem;
        font-weight: 950;
        line-height: 1;
        letter-spacing: -0.055em;
    }

    .profile-status-side-card p[b-4401q130fg] {
        margin: 0;
        color: var(--profile-muted);
        font-size: 0.82rem;
        font-weight: 650;
        line-height: 1.45;
    }

.profile-status-metrics[b-4401q130fg] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
}

    .profile-status-metrics div[b-4401q130fg] {
        min-width: 0;
        display: grid;
        gap: 0.18rem;
        padding: 0.62rem;
        border-radius: 14px;
        background: color-mix(in srgb, var(--profile-primary) 5%, var(--profile-surface));
        border: 1px solid color-mix(in srgb, var(--profile-primary) 8%, var(--profile-divider));
    }

    .profile-status-metrics strong[b-4401q130fg] {
        overflow: hidden;
        color: var(--profile-primary);
        font-size: 0.95rem;
        font-weight: 950;
        line-height: 1.1;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .profile-status-metrics span[b-4401q130fg] {
        overflow: hidden;
        color: var(--profile-muted);
        font-size: 0.62rem;
        font-weight: 850;
        line-height: 1.12;
        text-overflow: ellipsis;
        white-space: nowrap;
        text-transform: uppercase;
        letter-spacing: 0.035em;
    }

.salon-profile-page[b-4401q130fg]  .profile-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    margin-top: 1.2rem;
}

    .salon-profile-page[b-4401q130fg]  .profile-hero-actions .mud-button-root {
        min-height: 44px;
        border-radius: 10px;
        font-family: inherit;
        font-size: 0.76rem;
        font-weight: 950;
        letter-spacing: 0.045em;
        text-transform: uppercase;
    }

    .salon-profile-page[b-4401q130fg]  .profile-hero-actions .mud-button-filled-secondary .mud-button-label,
    .salon-profile-page[b-4401q130fg]  .profile-hero-actions .mud-button-filled-secondary .mud-icon-root {
        color: #ffffff !important;
    }

.salon-profile-page[b-4401q130fg]  .profile-muted {
    color: var(--profile-muted);
    font-weight: 650;
    line-height: 1.45;
}

@media (max-width: 960px) {
    .profile-status-hero-grid[b-4401q130fg] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .salon-profile-page[b-4401q130fg]  .profile-status-hero {
        padding: 1rem;
        border-radius: 20px;
    }

    .profile-status-kicker-row[b-4401q130fg] {
        align-items: flex-start;
    }

    .profile-status-metrics[b-4401q130fg] {
        grid-template-columns: 1fr;
    }

    .salon-profile-page[b-4401q130fg]  .profile-hero-actions,
    .salon-profile-page[b-4401q130fg]  .profile-hero-actions .mud-button-root {
        width: 100%;
    }
}


/* BB-FOUNDING-50-01 */
.profile-status-chip-row[b-4401q130fg] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.salon-profile-page[b-4401q130fg]  .profile-founding-chip {
    color: #fffaf0 !important;
    font-weight: 950;
    background: linear-gradient(135deg, #7a5d27, #c7a15a 58%, #8b6b2f) !important;
    border: 1px solid rgba(255,255,255,0.28) !important;
}
/* /Components/Pages/Salons.razor.rz.scp.css */
.salons-page[b-8ttrl1tgdw] {
    --salons-primary: var(--mud-palette-primary);
    --salons-secondary: var(--mud-palette-secondary);
    --salons-info: var(--mud-palette-info);
    --salons-success: var(--mud-palette-success);
    --salons-warning: var(--mud-palette-warning);
    --salons-error: var(--mud-palette-error);
    --salons-surface: var(--mud-palette-surface);
    --salons-background: var(--mud-palette-background);
    --salons-text-primary: var(--mud-palette-text-primary);
    --salons-text-secondary: var(--mud-palette-text-secondary);
    --salons-divider: var(--mud-palette-divider);
    padding-bottom: 4rem;
}

    .salons-page[b-8ttrl1tgdw]  .salons-hero-panel {
        position: relative;
        overflow: hidden;
        padding: 2.8rem;
        border-radius: 36px;
        background: radial-gradient(circle at 87% 14%, color-mix(in srgb, var(--salons-secondary) 20%, transparent), transparent 27%), radial-gradient(circle at 12% 92%, color-mix(in srgb, var(--salons-primary) 15%, transparent), transparent 30%), linear-gradient(135deg, color-mix(in srgb, var(--salons-surface) 98%, var(--salons-primary)) 0%, var(--salons-surface) 52%, color-mix(in srgb, var(--salons-secondary) 8%, var(--salons-surface)) 100%);
        border: 1px solid color-mix(in srgb, var(--salons-primary) 12%, var(--salons-divider));
        box-shadow: 0 30px 76px color-mix(in srgb, var(--salons-primary) 12%, transparent);
    }

        .salons-page[b-8ttrl1tgdw]  .salons-hero-panel::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(112deg, color-mix(in srgb, var(--salons-surface) 80%, transparent), transparent 54%), radial-gradient(circle at 42% 14%, color-mix(in srgb, var(--salons-primary) 6%, transparent), transparent 25%);
            pointer-events: none;
        }

.salons-hero-glow[b-8ttrl1tgdw] {
    position: absolute;
    border-radius: 999px;
    pointer-events: none;
    filter: blur(10px);
}

.salons-hero-glow-one[b-8ttrl1tgdw] {
    top: 3rem;
    right: 9rem;
    width: 175px;
    height: 175px;
    background: color-mix(in srgb, var(--salons-secondary) 14%, transparent);
}

.salons-hero-glow-two[b-8ttrl1tgdw] {
    left: -3rem;
    bottom: -5rem;
    width: 285px;
    height: 285px;
    background: color-mix(in srgb, var(--salons-primary) 11%, transparent);
}

.salons-page[b-8ttrl1tgdw]  .salons-hero-grid {
    position: relative;
    z-index: 2;
    align-items: center;
}

.salons-page[b-8ttrl1tgdw]  .salons-hero-copy {
    position: relative;
    z-index: 3;
}

.salons-eyebrow[b-8ttrl1tgdw] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.62rem 1rem;
    color: #ffffff;
    font-size: 0.78rem;
    font-weight: 950;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--salons-primary), var(--salons-secondary));
    box-shadow: 0 16px 34px color-mix(in srgb, var(--salons-primary) 24%, transparent);
}

.salons-page[b-8ttrl1tgdw]  .salons-eyebrow .mud-icon-root {
    color: #ffffff !important;
}

.salons-page[b-8ttrl1tgdw]  .salons-title {
    max-width: 680px;
    color: var(--salons-text-primary);
    font-size: clamp(2.55rem, 4.5vw, 3.95rem);
    font-weight: 950;
    line-height: 1.03;
    letter-spacing: -0.055em;
}

    .salons-page[b-8ttrl1tgdw]  .salons-title span {
        display: block;
        color: var(--salons-secondary);
        font-style: italic;
    }

.salons-page[b-8ttrl1tgdw]  .salons-subtitle {
    max-width: 660px;
    color: var(--salons-text-secondary);
    font-size: 1.08rem;
    line-height: 1.72;
    font-weight: 600;
}

.salons-page[b-8ttrl1tgdw]  .salons-hero-actions {
    flex-wrap: wrap;
}

    .salons-page[b-8ttrl1tgdw]  .salons-hero-actions .mud-button-root {
        min-height: 52px;
        border-radius: 999px;
        font-weight: 950;
        letter-spacing: 0.02em;
    }

.salons-discovery-note[b-8ttrl1tgdw] {
    width: fit-content;
    max-width: 680px;
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.85rem 1rem;
    color: var(--salons-text-primary);
    font-size: 0.9rem;
    font-weight: 800;
    border-radius: 18px;
    background: color-mix(in srgb, var(--salons-primary) 7%, var(--salons-surface));
    border: 1px solid color-mix(in srgb, var(--salons-primary) 10%, var(--salons-divider));
}

.salons-page[b-8ttrl1tgdw]  .salons-discovery-note .mud-icon-root {
    color: var(--salons-primary);
}

.salons-page[b-8ttrl1tgdw]  .salons-hero-visual {
    position: relative;
    overflow: hidden;
    min-height: 430px;
    padding: 2rem;
    border-radius: 32px;
    background: radial-gradient(circle at 86% 12%, color-mix(in srgb, var(--salons-secondary) 20%, transparent), transparent 28%), radial-gradient(circle at 14% 92%, color-mix(in srgb, var(--salons-primary) 14%, transparent), transparent 30%), linear-gradient(145deg, color-mix(in srgb, var(--salons-surface) 98%, transparent), color-mix(in srgb, var(--salons-background) 82%, var(--salons-surface)));
    border: 1px solid color-mix(in srgb, var(--salons-surface) 92%, var(--salons-divider));
    box-shadow: 0 24px 62px color-mix(in srgb, var(--salons-text-primary) 9%, transparent);
}

    .salons-page[b-8ttrl1tgdw]  .salons-hero-visual::after {
        content: "";
        position: absolute;
        right: -95px;
        bottom: -122px;
        width: 270px;
        height: 270px;
        border-radius: 999px;
        background: color-mix(in srgb, var(--salons-primary) 11%, transparent);
        pointer-events: none;
    }

.salons-page[b-8ttrl1tgdw]  .salons-visual-top,
.salons-category-grid[b-8ttrl1tgdw],
.salons-flow-card[b-8ttrl1tgdw] {
    position: relative;
    z-index: 2;
}

.salons-visual-icon[b-8ttrl1tgdw] {
    width: 70px;
    height: 70px;
    display: grid;
    place-items: center;
    border-radius: 26px;
    background: linear-gradient(135deg, var(--salons-primary), var(--salons-secondary));
    box-shadow: 0 18px 42px color-mix(in srgb, var(--salons-primary) 22%, transparent);
}

.salons-page[b-8ttrl1tgdw]  .salons-visual-icon .mud-icon-root {
    color: #ffffff !important;
    font-size: 2.2rem;
}

.salons-page[b-8ttrl1tgdw]  .salons-visual-title {
    color: var(--salons-text-primary);
    font-weight: 950;
    line-height: 1.13;
    letter-spacing: -0.035em;
}

.salons-page[b-8ttrl1tgdw]  .salons-visual-text {
    max-width: 520px;
    color: var(--salons-text-secondary);
    line-height: 1.68;
    font-weight: 560;
}

.salons-category-grid[b-8ttrl1tgdw] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
}

.salons-category-card[b-8ttrl1tgdw] {
    min-height: 94px;
    display: grid;
    place-items: center;
    gap: 0.25rem;
    padding: 0.86rem 0.55rem;
    text-align: center;
    border-radius: 22px;
    cursor: pointer;
    appearance: none;
    border: 1px solid color-mix(in srgb, var(--salons-primary) 8%, var(--salons-divider));
    background: color-mix(in srgb, var(--salons-surface) 94%, transparent);
    box-shadow: 0 12px 28px color-mix(in srgb, var(--salons-text-primary) 5%, transparent);
    transition: transform 170ms ease, box-shadow 170ms ease, border-color 170ms ease, background 170ms ease;
}

    .salons-category-card:hover[b-8ttrl1tgdw] {
        transform: translateY(-4px);
        border-color: color-mix(in srgb, var(--category-color, var(--salons-primary)) 30%, var(--salons-divider));
        background: radial-gradient(circle at 80% 12%, color-mix(in srgb, var(--category-color, var(--salons-primary)) 13%, transparent), transparent 34%), color-mix(in srgb, var(--salons-surface) 96%, transparent);
        box-shadow: 0 18px 44px color-mix(in srgb, var(--category-color, var(--salons-primary)) 14%, transparent);
    }

    .salons-category-card:focus-visible[b-8ttrl1tgdw] {
        outline: none;
        border-color: color-mix(in srgb, var(--category-color, var(--salons-primary)) 60%, var(--salons-divider));
        box-shadow: 0 0 0 4px color-mix(in srgb, var(--category-color, var(--salons-primary)) 16%, transparent);
    }

    .salons-category-card span[b-8ttrl1tgdw] {
        color: var(--salons-text-primary);
        font-size: 0.82rem;
        font-weight: 950;
    }

    .salons-category-card small[b-8ttrl1tgdw] {
        color: var(--salons-text-secondary);
        font-size: 0.68rem;
        font-weight: 750;
    }

.salons-page[b-8ttrl1tgdw]  .salons-category-card .mud-icon-root {
    color: var(--category-color, var(--salons-primary));
    font-size: 1.45rem;
}

.salons-category-card-primary[b-8ttrl1tgdw] {
    --category-color: var(--salons-primary);
}

.salons-category-card-secondary[b-8ttrl1tgdw],
.salons-category-card-teal[b-8ttrl1tgdw] {
    --category-color: var(--salons-secondary);
}

.salons-category-card-pink[b-8ttrl1tgdw] {
    --category-color: var(--salons-error);
}

.salons-category-card-info[b-8ttrl1tgdw] {
    --category-color: var(--salons-info);
}

.salons-category-card-gold[b-8ttrl1tgdw] {
    --category-color: var(--salons-warning);
}

.salons-flow-card[b-8ttrl1tgdw] {
    display: grid;
    grid-template-columns: auto 1fr auto 1fr auto;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    border-radius: 24px;
    background: color-mix(in srgb, var(--salons-primary) 6%, var(--salons-surface));
    border: 1px solid color-mix(in srgb, var(--salons-primary) 10%, var(--salons-divider));
}

.salons-flow-step[b-8ttrl1tgdw] {
    display: grid;
    place-items: center;
    gap: 0.35rem;
    color: var(--salons-text-primary);
    font-size: 0.78rem;
    font-weight: 950;
}

.salons-flow-step-icon[b-8ttrl1tgdw] {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 16px;
    background: var(--salons-surface);
    box-shadow: 0 10px 24px color-mix(in srgb, var(--salons-text-primary) 6%, transparent);
}

.salons-page[b-8ttrl1tgdw]  .salons-flow-step-icon .mud-icon-root {
    color: var(--salons-primary);
    font-size: 1.25rem;
}

.salons-flow-line[b-8ttrl1tgdw] {
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, color-mix(in srgb, var(--salons-primary) 14%, transparent), color-mix(in srgb, var(--salons-secondary) 38%, transparent));
}

.salons-page[b-8ttrl1tgdw]  .salons-search-panel {
    position: relative;
    z-index: 1;
    padding: 1.55rem;
    border-radius: 28px;
    background: color-mix(in srgb, var(--salons-surface) 98%, transparent);
    border: 1px solid color-mix(in srgb, var(--salons-primary) 10%, var(--salons-divider));
    box-shadow: 0 18px 48px color-mix(in srgb, var(--salons-text-primary) 7%, transparent);
    scroll-margin-top: 96px;
}

.salons-page[b-8ttrl1tgdw]  .salons-search-header,
.salons-page[b-8ttrl1tgdw]  .salons-search-summary,
.salons-page[b-8ttrl1tgdw]  .salons-results-toolbar,
.salons-page[b-8ttrl1tgdw]  .salons-area-strip-header,
.salons-page[b-8ttrl1tgdw]  .salons-results-summary-content,
.salons-page[b-8ttrl1tgdw]  .salons-rail-header {
    gap: 1rem;
}

.salons-page[b-8ttrl1tgdw]  .salons-search-title,
.salons-page[b-8ttrl1tgdw]  .salons-results-title,
.salons-page[b-8ttrl1tgdw]  .salons-empty-title,
.salons-page[b-8ttrl1tgdw]  .salons-area-title,
.salons-page[b-8ttrl1tgdw]  .salons-start-title,
.salons-page[b-8ttrl1tgdw]  .salons-results-summary-title,
.salons-page[b-8ttrl1tgdw]  .salons-rail-title {
    color: var(--salons-text-primary);
    font-weight: 950;
    letter-spacing: -0.028em;
}

.salons-page[b-8ttrl1tgdw]  .salons-search-subtitle,
.salons-page[b-8ttrl1tgdw]  .salons-search-context,
.salons-page[b-8ttrl1tgdw]  .salons-results-subtitle,
.salons-page[b-8ttrl1tgdw]  .salons-area-subtitle,
.salons-page[b-8ttrl1tgdw]  .salons-market-subtitle,
.salons-page[b-8ttrl1tgdw]  .salons-start-text,
.salons-page[b-8ttrl1tgdw]  .salons-results-summary-text,
.salons-page[b-8ttrl1tgdw]  .salons-load-more-text,
.salons-page[b-8ttrl1tgdw]  .salons-rail-subtitle {
    color: var(--salons-text-secondary);
    font-weight: 560;
}

.salons-market-strip[b-8ttrl1tgdw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem;
    border-radius: 22px;
    background: color-mix(in srgb, var(--salons-primary) 5%, var(--salons-surface));
    border: 1px solid color-mix(in srgb, var(--salons-primary) 8%, var(--salons-divider));
}

.salons-page[b-8ttrl1tgdw]  .salons-market-title {
    color: var(--salons-text-primary);
    font-weight: 950;
}

.salons-market-chip-list[b-8ttrl1tgdw] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.5rem;
}

.salons-page[b-8ttrl1tgdw]  .salons-market-chip {
    min-height: 34px;
    border-radius: 999px;
    font-weight: 850;
    white-space: nowrap;
}

.salons-filter-row[b-8ttrl1tgdw] {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(240px, 1fr) auto;
    gap: 0.85rem;
    align-items: end;
}

.salons-filter-field[b-8ttrl1tgdw] {
    min-width: 0;
}

.salons-filter-actions[b-8ttrl1tgdw] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.65rem;
    min-height: 56px;
    padding-bottom: 0;
}

.salons-page[b-8ttrl1tgdw]  .salons-search-button,
.salons-page[b-8ttrl1tgdw]  .salons-clear-button {
    min-height: 56px;
    border-radius: 999px;
    font-weight: 950;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.salons-page[b-8ttrl1tgdw]  .salons-search-button {
    min-width: 132px;
}

.salons-page[b-8ttrl1tgdw]  .salons-near-button {
    min-width: 148px;
}

.salons-page[b-8ttrl1tgdw]  .salons-clear-button {
    min-width: 88px;
    padding-inline: 1rem;
}

.salons-page[b-8ttrl1tgdw]  .salons-loading-panel,
.salons-page[b-8ttrl1tgdw]  .salons-empty-state,
.salons-page[b-8ttrl1tgdw]  .salons-area-strip,
.salons-page[b-8ttrl1tgdw]  .salons-start-state,
.salons-page[b-8ttrl1tgdw]  .salons-results-summary-panel,
.salons-page[b-8ttrl1tgdw]  .salons-load-more-panel,
.salons-page[b-8ttrl1tgdw]  .salons-discovery-rail-panel {
    padding: 1.25rem;
    border-radius: 26px;
    background: var(--salons-surface);
    border: 1px solid var(--salons-divider);
    box-shadow: 0 16px 42px color-mix(in srgb, var(--salons-text-primary) 6%, transparent);
}

.salons-page[b-8ttrl1tgdw]  .salons-start-state {
    padding: 2rem;
    background: radial-gradient(circle at 92% 18%, color-mix(in srgb, var(--salons-secondary) 10%, transparent), transparent 30%), linear-gradient(135deg, var(--salons-surface), color-mix(in srgb, var(--salons-primary) 4%, var(--salons-surface)));
}

.salons-page[b-8ttrl1tgdw]  .salons-start-grid {
    align-items: center;
}

.salons-start-icon[b-8ttrl1tgdw] {
    width: 66px;
    height: 66px;
    display: grid;
    place-items: center;
    border-radius: 24px;
    background: linear-gradient(135deg, var(--salons-primary), var(--salons-secondary));
    box-shadow: 0 18px 38px color-mix(in srgb, var(--salons-primary) 22%, transparent);
}

.salons-page[b-8ttrl1tgdw]  .salons-start-icon .mud-icon-root {
    color: #ffffff !important;
    font-size: 2rem;
}

.salons-page[b-8ttrl1tgdw]  .salons-start-actions .mud-button-root {
    min-height: 48px;
    border-radius: 999px;
    font-weight: 950;
}

.salons-page[b-8ttrl1tgdw]  .salons-discovery-rail-panel {
    overflow: hidden;
    padding: 1.35rem;
    background: radial-gradient(circle at 90% 18%, color-mix(in srgb, var(--salons-primary) 7%, transparent), transparent 32%), var(--salons-surface);
}

.salons-rail-controls[b-8ttrl1tgdw] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    flex: 0 0 auto;
}

.salons-rail-nav-button[b-8ttrl1tgdw] {
    width: 42px;
    height: 42px;
    display: inline-grid;
    place-items: center;
    cursor: pointer;
    appearance: none;
    border: 1px solid color-mix(in srgb, var(--salons-primary) 18%, var(--salons-divider));
    border-radius: 999px;
    color: var(--salons-primary);
    background: color-mix(in srgb, var(--salons-surface) 96%, transparent);
    box-shadow: 0 10px 24px color-mix(in srgb, var(--salons-text-primary) 6%, transparent);
    transition: transform 150ms ease, box-shadow 150ms ease, background 150ms ease, border-color 150ms ease;
}

    .salons-rail-nav-button:hover[b-8ttrl1tgdw] {
        transform: translateY(-2px);
        border-color: color-mix(in srgb, var(--salons-primary) 42%, var(--salons-divider));
        background: color-mix(in srgb, var(--salons-primary) 8%, var(--salons-surface));
        box-shadow: 0 14px 30px color-mix(in srgb, var(--salons-primary) 12%, transparent);
    }

    .salons-rail-nav-button:active[b-8ttrl1tgdw] {
        transform: translateY(0);
    }

    .salons-rail-nav-button:focus-visible[b-8ttrl1tgdw] {
        outline: none;
        box-shadow: 0 0 0 4px color-mix(in srgb, var(--salons-primary) 16%, transparent), 0 14px 30px color-mix(in srgb, var(--salons-primary) 12%, transparent);
    }

.salons-page[b-8ttrl1tgdw]  .salons-rail-nav-button .mud-icon-root {
    color: var(--salons-primary);
    font-size: 1.35rem;
}

.salons-rail-nav-button-small[b-8ttrl1tgdw] {
    width: 36px;
    height: 36px;
}

.salons-page[b-8ttrl1tgdw]  .salons-rail-nav-button-small .mud-icon-root {
    font-size: 1.2rem;
}

.salons-rail-shell[b-8ttrl1tgdw] {
    position: relative;
    min-width: 0;
}

.salons-scroll-rail[b-8ttrl1tgdw] {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(220px, 260px);
    gap: 0.85rem;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline mandatory;
    scroll-behavior: smooth;
    padding: 0.25rem 0.2rem 0.15rem;
    margin-top: 1rem;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

    .salons-scroll-rail[b-8ttrl1tgdw]::-webkit-scrollbar,
    .salons-area-chip-list[b-8ttrl1tgdw]::-webkit-scrollbar {
        display: none;
    }

.salons-city-card[b-8ttrl1tgdw] {
    scroll-snap-align: start;
    min-height: 112px;
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: 1fr auto;
    gap: 0.75rem;
    padding: 1rem;
    text-align: left;
    cursor: pointer;
    appearance: none;
    border-radius: 24px;
    border: 1px solid color-mix(in srgb, var(--salons-primary) 9%, var(--salons-divider));
    background: radial-gradient(circle at 90% 10%, color-mix(in srgb, var(--salons-secondary) 9%, transparent), transparent 38%), color-mix(in srgb, var(--salons-surface) 96%, transparent);
    box-shadow: 0 12px 30px color-mix(in srgb, var(--salons-text-primary) 5%, transparent);
    transition: transform 170ms ease, box-shadow 170ms ease, border-color 170ms ease;
}

    .salons-city-card:hover[b-8ttrl1tgdw] {
        transform: translateY(-4px);
        border-color: color-mix(in srgb, var(--salons-primary) 28%, var(--salons-divider));
        box-shadow: 0 20px 44px color-mix(in srgb, var(--salons-primary) 12%, transparent);
    }

    .salons-city-card:focus-visible[b-8ttrl1tgdw] {
        outline: none;
        border-color: color-mix(in srgb, var(--salons-primary) 60%, var(--salons-divider));
        box-shadow: 0 0 0 4px color-mix(in srgb, var(--salons-primary) 16%, transparent);
    }

.salons-city-card-icon[b-8ttrl1tgdw] {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 17px;
    background: linear-gradient(135deg, var(--salons-primary), var(--salons-secondary));
}

.salons-page[b-8ttrl1tgdw]  .salons-city-card-icon .mud-icon-root {
    color: #ffffff !important;
    font-size: 1.35rem;
}

.salons-city-card-copy[b-8ttrl1tgdw] {
    min-width: 0;
    display: grid;
    gap: 0.15rem;
}

    .salons-city-card-copy strong[b-8ttrl1tgdw] {
        color: var(--salons-text-primary);
        font-size: 1rem;
        font-weight: 950;
        line-height: 1.2;
        letter-spacing: -0.02em;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .salons-city-card-copy small[b-8ttrl1tgdw] {
        color: var(--salons-text-secondary);
        font-size: 0.78rem;
        font-weight: 750;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.salons-city-card-count[b-8ttrl1tgdw] {
    grid-column: 1 / -1;
    width: fit-content;
    padding: 0.34rem 0.65rem;
    color: var(--salons-primary);
    font-size: 0.74rem;
    font-weight: 950;
    border-radius: 999px;
    background: color-mix(in srgb, var(--salons-primary) 8%, var(--salons-surface));
    border: 1px solid color-mix(in srgb, var(--salons-primary) 10%, var(--salons-divider));
}

.salons-page[b-8ttrl1tgdw]  .salons-empty-state {
    padding: 2rem;
    text-align: center;
}

.salons-page[b-8ttrl1tgdw]  .salons-empty-icon {
    width: 68px;
    height: 68px;
    box-shadow: 0 18px 38px color-mix(in srgb, var(--salons-primary) 22%, transparent);
}

    .salons-page[b-8ttrl1tgdw]  .salons-empty-icon .mud-icon-root {
        color: #ffffff !important;
        font-size: 2rem;
    }

.salons-empty-copy[b-8ttrl1tgdw] {
    max-width: 560px;
}

.salons-page[b-8ttrl1tgdw]  .salons-error-alert {
    border-radius: 18px;
    box-shadow: 0 16px 40px color-mix(in srgb, var(--mud-palette-error) 16%, transparent);
}

.salons-page[b-8ttrl1tgdw]  .salons-results-section {
    padding-top: 0.75rem;
}

.salons-page[b-8ttrl1tgdw]  .salons-area-strip {
    overflow: hidden;
}

.salons-page[b-8ttrl1tgdw]  .salons-area-strip-header {
    align-items: flex-start !important;
}

.salons-area-rail-shell[b-8ttrl1tgdw] {
    margin-top: 0.85rem;
}

.salons-area-chip-list[b-8ttrl1tgdw] {
    width: 100%;
    min-width: 0;
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    gap: 0.5rem;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline mandatory;
    scroll-behavior: smooth;
    padding: 0.15rem 0.15rem;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.salons-page[b-8ttrl1tgdw]  .salons-area-chip {
    flex: 0 0 auto;
    scroll-snap-align: start;
    min-height: 34px;
    max-width: 220px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--salons-primary) 7%, transparent);
    font-weight: 850;
    white-space: nowrap;
}

.salons-page[b-8ttrl1tgdw]  .salons-result-group {
    padding-top: 0.25rem;
}

.salons-page[b-8ttrl1tgdw]  .salons-results-grid {
    align-items: stretch;
}

.salons-page[b-8ttrl1tgdw]  .salon-card {
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 30px;
    background: linear-gradient(145deg, var(--salons-surface), color-mix(in srgb, var(--salons-background) 70%, var(--salons-surface)));
    border: 1px solid color-mix(in srgb, var(--salons-primary) 8%, var(--salons-divider));
    box-shadow: 0 18px 46px color-mix(in srgb, var(--salons-text-primary) 8%, transparent);
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.salons-page[b-8ttrl1tgdw]  .salon-card-clickable {
    cursor: pointer;
}

.salons-page[b-8ttrl1tgdw]  .salon-card:hover,
.salons-page[b-8ttrl1tgdw]  .salon-card:focus-visible {
    transform: translateY(-4px);
    border-color: color-mix(in srgb, var(--salons-primary) 26%, var(--salons-divider));
    box-shadow: 0 28px 68px color-mix(in srgb, var(--salons-text-primary) 12%, transparent);
}

.salons-page[b-8ttrl1tgdw]  .salon-card:focus-visible {
    outline: none;
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--salons-primary) 16%, transparent), 0 28px 68px color-mix(in srgb, var(--salons-text-primary) 12%, transparent);
}

.salon-card-media[b-8ttrl1tgdw] {
    position: relative;
    overflow: hidden;
    min-height: 184px;
    padding: 1.25rem;
    background: radial-gradient(circle at 82% 16%, color-mix(in srgb, var(--salons-secondary) 28%, transparent), transparent 34%), radial-gradient(circle at 15% 92%, color-mix(in srgb, var(--salons-primary) 24%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--salons-primary) 18%, var(--salons-surface)), color-mix(in srgb, var(--salons-secondary) 12%, var(--salons-surface)));
    border-bottom: 1px solid color-mix(in srgb, var(--salons-primary) 10%, var(--salons-divider));
}

    .salon-card-media[b-8ttrl1tgdw]::before {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(135deg, color-mix(in srgb, var(--salons-surface) 22%, transparent), transparent 54%), repeating-linear-gradient(135deg, color-mix(in srgb, var(--salons-surface) 18%, transparent) 0 1px, transparent 1px 16px);
        pointer-events: none;
    }

.salon-card-media-with-image[b-8ttrl1tgdw] {
    background: #111827;
}

    .salon-card-media-with-image[b-8ttrl1tgdw]::before {
        z-index: 1;
        background: linear-gradient(180deg, rgba(15, 23, 42, 0.50) 0%, rgba(15, 23, 42, 0.08) 42%, rgba(15, 23, 42, 0.72) 100%), linear-gradient(135deg, rgba(91, 75, 255, 0.24), rgba(20, 184, 166, 0.18));
    }

.salon-card-image[b-8ttrl1tgdw] {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.01);
    transition: transform 280ms ease, filter 280ms ease;
}

.salons-page[b-8ttrl1tgdw]  .salon-card:hover .salon-card-image {
    transform: scale(1.055);
    filter: saturate(1.06);
}

.salon-card-image-overlay[b-8ttrl1tgdw] {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: radial-gradient(circle at 18% 12%, rgba(255, 255, 255, 0.18), transparent 28%), linear-gradient(180deg, rgba(15, 23, 42, 0.15), rgba(15, 23, 42, 0.68));
    pointer-events: none;
}

.salon-card-media-glow[b-8ttrl1tgdw] {
    position: absolute;
    right: -44px;
    bottom: -72px;
    width: 180px;
    height: 180px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--salons-surface) 34%, transparent);
    pointer-events: none;
}

.salon-card-media-with-image .salon-card-media-glow[b-8ttrl1tgdw] {
    display: none;
}

.salons-page[b-8ttrl1tgdw]  .salon-card-media-top {
    position: relative;
    z-index: 2;
}

.salons-page[b-8ttrl1tgdw]  .salon-card-media-badges {
    flex-wrap: wrap;
    justify-content: flex-end;
}

.salon-card-initials[b-8ttrl1tgdw] {
    width: 68px;
    height: 68px;
    display: grid;
    place-items: center;
    color: #ffffff;
    font-size: 1.3rem;
    font-weight: 950;
    letter-spacing: -0.04em;
    border-radius: 24px;
    background: linear-gradient(135deg, var(--salons-primary), var(--salons-secondary));
    box-shadow: 0 18px 38px color-mix(in srgb, var(--salons-primary) 24%, transparent);
}

.salon-card-media-with-image .salon-card-initials[b-8ttrl1tgdw] {
    background: rgba(255, 255, 255, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.28);
    backdrop-filter: blur(14px);
    box-shadow: 0 18px 38px rgba(15, 23, 42, 0.28);
}

.salon-card-media-bottom[b-8ttrl1tgdw] {
    position: absolute;
    left: 1.25rem;
    right: 1.25rem;
    bottom: 1rem;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.salons-page[b-8ttrl1tgdw]  .salon-card-media-bottom .mud-typography {
    color: color-mix(in srgb, var(--salons-text-primary) 72%, transparent);
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.salons-page[b-8ttrl1tgdw]  .salon-card-media-with-image .salon-card-media-bottom .mud-typography {
    color: rgba(255, 255, 255, 0.86);
}

.salons-page[b-8ttrl1tgdw]  .salon-card-content {
    flex: 1;
    padding: 1.25rem 1.25rem 0.85rem;
}

.salons-page[b-8ttrl1tgdw]  .salon-card-title {
    color: var(--salons-text-primary);
    font-weight: 950;
    letter-spacing: -0.028em;
    line-height: 1.15;
}

.salons-page[b-8ttrl1tgdw]  .salon-card-location-line {
    color: var(--salons-secondary);
    font-weight: 750;
}

.salon-card-highlight-row[b-8ttrl1tgdw] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.salon-card-price-pill[b-8ttrl1tgdw],
.salon-card-review-pill[b-8ttrl1tgdw] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 0.38rem;
    padding: 0.45rem 0.68rem;
    font-size: 0.76rem;
    font-weight: 950;
    line-height: 1;
    border-radius: 999px;
    white-space: nowrap;
}

.salon-card-price-pill[b-8ttrl1tgdw] {
    color: var(--salons-primary);
    background: color-mix(in srgb, var(--salons-primary) 8%, var(--salons-surface));
    border: 1px solid color-mix(in srgb, var(--salons-primary) 14%, var(--salons-divider));
}

.salon-card-review-pill[b-8ttrl1tgdw] {
    color: color-mix(in srgb, var(--salons-warning) 78%, #7c2d12);
    background: color-mix(in srgb, var(--salons-warning) 12%, var(--salons-surface));
    border: 1px solid color-mix(in srgb, var(--salons-warning) 18%, var(--salons-divider));
}

.salons-page[b-8ttrl1tgdw]  .salon-card-price-pill .mud-icon-root,
.salons-page[b-8ttrl1tgdw]  .salon-card-review-pill .mud-icon-root {
    font-size: 1rem;
}

.salon-card-address[b-8ttrl1tgdw] {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
    color: var(--salons-text-primary);
    padding: 0.82rem;
    border-radius: 18px;
    background: color-mix(in srgb, var(--salons-primary) 5%, var(--salons-surface));
    border: 1px solid color-mix(in srgb, var(--salons-primary) 8%, var(--salons-divider));
}

.salons-page[b-8ttrl1tgdw]  .salon-card-address .mud-icon-root {
    color: var(--salons-primary);
    margin-top: 0.1rem;
}

.salons-page[b-8ttrl1tgdw]  .salon-card-description {
    min-height: 48px;
    color: var(--salons-text-secondary);
    line-height: 1.65;
}

.salon-card-service-chips[b-8ttrl1tgdw] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.salon-card-service-chip[b-8ttrl1tgdw] {
    max-width: 100%;
    padding: 0.38rem 0.64rem;
    color: var(--salons-text-primary);
    font-size: 0.74rem;
    font-weight: 900;
    line-height: 1;
    border-radius: 999px;
    background: color-mix(in srgb, var(--salons-secondary) 8%, var(--salons-surface));
    border: 1px solid color-mix(in srgb, var(--salons-secondary) 12%, var(--salons-divider));
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.salon-card-meta-grid[b-8ttrl1tgdw] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.6rem;
    margin-top: 0.25rem;
}

.salon-card-meta-item[b-8ttrl1tgdw] {
    min-height: 54px;
    display: grid;
    place-items: center;
    gap: 0.25rem;
    padding: 0.65rem 0.35rem;
    text-align: center;
    border-radius: 16px;
    color: var(--salons-primary);
    background: color-mix(in srgb, var(--salons-primary) 6%, var(--salons-surface));
    border: 1px solid color-mix(in srgb, var(--salons-primary) 8%, var(--salons-divider));
}

    .salon-card-meta-item span[b-8ttrl1tgdw] {
        color: var(--salons-text-primary);
        font-size: 0.74rem;
        font-weight: 900;
    }

.salons-page[b-8ttrl1tgdw]  .salon-card-meta-item .mud-icon-root {
    color: var(--salons-primary);
    font-size: 1.12rem;
}

.salons-page[b-8ttrl1tgdw]  .salon-card-footer {
    padding: 0 1.25rem 1.25rem;
    margin-top: auto;
}

    .salons-page[b-8ttrl1tgdw]  .salon-card-footer .mud-button-root {
        min-height: 48px;
        border-radius: 999px;
        font-weight: 950;
        letter-spacing: 0.02em;
    }

.salons-page[b-8ttrl1tgdw]  .salons-load-more-panel {
    text-align: center;
    background: radial-gradient(circle at 88% 18%, color-mix(in srgb, var(--salons-secondary) 8%, transparent), transparent 30%), var(--salons-surface);
}

    .salons-page[b-8ttrl1tgdw]  .salons-load-more-panel .mud-button-root {
        min-height: 48px;
        border-radius: 999px;
        font-weight: 950;
    }

@media (max-width: 1280px) {
    .salons-filter-row[b-8ttrl1tgdw] {
        grid-template-columns: 1fr 1fr;
    }

    .salons-filter-actions[b-8ttrl1tgdw] {
        grid-column: 1 / -1;
        justify-content: flex-start;
    }
}

@media (max-width: 960px) {
    .salons-page[b-8ttrl1tgdw]  .salons-hero-panel {
        padding: 2rem;
        border-radius: 28px;
    }

    .salons-page[b-8ttrl1tgdw]  .salons-hero-visual {
        min-height: 0;
    }

    .salons-page[b-8ttrl1tgdw]  .salons-title {
        font-size: clamp(2.35rem, 7vw, 3.35rem);
    }

    .salons-page[b-8ttrl1tgdw]  .salons-area-strip-header,
    .salons-market-strip[b-8ttrl1tgdw],
    .salons-page[b-8ttrl1tgdw]  .salons-results-summary-content,
    .salons-page[b-8ttrl1tgdw]  .salons-rail-header {
        flex-direction: column;
        align-items: flex-start !important;
    }

    .salons-area-chip-list[b-8ttrl1tgdw],
    .salons-market-chip-list[b-8ttrl1tgdw] {
        justify-content: flex-start;
    }

    .salons-area-chip-list[b-8ttrl1tgdw] {
        width: 100%;
    }
}

@media (max-width: 700px) {
    .salons-category-grid[b-8ttrl1tgdw] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .salons-filter-row[b-8ttrl1tgdw] {
        grid-template-columns: 1fr;
    }

    .salons-filter-actions[b-8ttrl1tgdw] {
        grid-column: auto;
    }

    .salons-scroll-rail[b-8ttrl1tgdw] {
        grid-auto-columns: minmax(210px, 84vw);
    }
}

@media (max-width: 600px) {
    .salons-page[b-8ttrl1tgdw] {
        padding-bottom: 2.5rem;
    }

        .salons-page[b-8ttrl1tgdw]  .salons-hero-panel,
        .salons-page[b-8ttrl1tgdw]  .salons-hero-visual,
        .salons-page[b-8ttrl1tgdw]  .salons-search-panel,
        .salons-page[b-8ttrl1tgdw]  .salons-loading-panel,
        .salons-page[b-8ttrl1tgdw]  .salons-empty-state,
        .salons-page[b-8ttrl1tgdw]  .salons-area-strip,
        .salons-page[b-8ttrl1tgdw]  .salons-start-state,
        .salons-page[b-8ttrl1tgdw]  .salons-results-summary-panel,
        .salons-page[b-8ttrl1tgdw]  .salons-load-more-panel,
        .salons-page[b-8ttrl1tgdw]  .salons-discovery-rail-panel {
            padding: 1rem;
            border-radius: 22px;
        }

        .salons-page[b-8ttrl1tgdw]  .salons-title {
            font-size: 2.35rem;
        }

        .salons-page[b-8ttrl1tgdw]  .salons-subtitle {
            font-size: 1rem;
        }

        .salons-page[b-8ttrl1tgdw]  .salons-hero-actions,
        .salons-page[b-8ttrl1tgdw]  .salons-search-header,
        .salons-page[b-8ttrl1tgdw]  .salons-search-summary,
        .salons-page[b-8ttrl1tgdw]  .salons-results-toolbar {
            flex-direction: column;
            align-items: flex-start !important;
        }

            .salons-page[b-8ttrl1tgdw]  .salons-hero-actions,
            .salons-page[b-8ttrl1tgdw]  .salons-hero-actions .mud-button-root,
            .salons-filter-actions[b-8ttrl1tgdw],
            .salons-page[b-8ttrl1tgdw]  .salons-search-button,
            .salons-page[b-8ttrl1tgdw]  .salons-clear-button,
            .salons-page[b-8ttrl1tgdw]  .salon-card-footer .mud-button-root {
                width: 100%;
            }

    .salons-filter-actions[b-8ttrl1tgdw] {
        flex-direction: column;
        align-items: stretch;
    }

    .salons-page[b-8ttrl1tgdw]  .salons-search-button,
    .salons-page[b-8ttrl1tgdw]  .salons-clear-button {
        min-height: 44px;
    }

    .salons-flow-card[b-8ttrl1tgdw] {
        grid-template-columns: 1fr;
        gap: 0.65rem;
    }

    .salons-flow-line[b-8ttrl1tgdw] {
        width: 2px;
        height: 18px;
        margin: 0 auto;
    }

    .salon-card-media[b-8ttrl1tgdw] {
        min-height: 164px;
    }

    .salons-page[b-8ttrl1tgdw]  .salon-card-content {
        padding: 1rem 1rem 0.75rem;
    }

    .salons-page[b-8ttrl1tgdw]  .salon-card-footer {
        padding: 0 1rem 1rem;
    }

    .salons-rail-nav-button[b-8ttrl1tgdw] {
        width: 38px;
        height: 38px;
    }

    .salon-card-highlight-row[b-8ttrl1tgdw],
    .salon-card-service-chips[b-8ttrl1tgdw] {
        gap: 0.38rem;
    }

    .salon-card-price-pill[b-8ttrl1tgdw],
    .salon-card-review-pill[b-8ttrl1tgdw],
    .salon-card-service-chip[b-8ttrl1tgdw] {
        font-size: 0.7rem;
    }
}

/* BB-013.3.5 Salons/Home landing UX merge polish */
.salons-landing-shell[b-8ttrl1tgdw] {
    position: relative;
    padding-top: 3.2rem;
    padding-bottom: 0.25rem;
}

.salons-floating-benefits[b-8ttrl1tgdw] {
    position: relative;
    z-index: 6;
    width: min(1120px, calc(100% - 3rem));
    margin: 0 auto -2.15rem;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    padding: 0.8rem;
    border-radius: 28px;
    background: color-mix(in srgb, var(--salons-surface) 94%, transparent);
    border: 1px solid color-mix(in srgb, var(--salons-primary) 10%, var(--salons-divider));
    box-shadow: 0 22px 52px color-mix(in srgb, var(--salons-text-primary) 9%, transparent);
    backdrop-filter: blur(18px);
}

.salons-floating-benefit-item[b-8ttrl1tgdw] {
    min-width: 0;
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 0.85rem;
    padding: 0.88rem 1rem;
    border-radius: 22px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--salons-primary) 5%, var(--salons-surface)), color-mix(in srgb, var(--salons-secondary) 4%, var(--salons-surface)));
    border: 1px solid color-mix(in srgb, var(--salons-primary) 8%, var(--salons-divider));
}

.salons-floating-benefit-icon[b-8ttrl1tgdw] {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border-radius: 19px;
    background: color-mix(in srgb, var(--salons-primary) 10%, var(--salons-surface));
}

.salons-page[b-8ttrl1tgdw]  .salons-floating-benefit-icon .mud-icon-root {
    color: var(--salons-primary);
    font-size: 1.45rem;
}

.salons-floating-benefit-copy[b-8ttrl1tgdw] {
    min-width: 0;
    display: grid;
    gap: 0.15rem;
}

    .salons-floating-benefit-copy strong[b-8ttrl1tgdw] {
        color: var(--salons-text-primary);
        font-size: 1.02rem;
        font-weight: 950;
        line-height: 1.15;
        letter-spacing: -0.02em;
    }

    .salons-floating-benefit-copy small[b-8ttrl1tgdw] {
        color: var(--salons-text-secondary);
        font-size: 0.78rem;
        font-weight: 650;
        line-height: 1.35;
    }

.salons-page[b-8ttrl1tgdw]  .salons-hero-panel-compact {
    padding-top: 5.4rem;
    padding-bottom: 5rem;
}

    .salons-page[b-8ttrl1tgdw]  .salons-hero-panel-compact .salons-hero-grid {
        align-items: center;
    }

    .salons-page[b-8ttrl1tgdw]  .salons-hero-panel-compact .salons-title {
        font-size: clamp(2.55rem, 4.5vw, 3.15rem);
    }

    .salons-page[b-8ttrl1tgdw]  .salons-hero-panel-compact .salons-subtitle {
        max-width: 610px;
        font-size: 1.02rem;
    }

    .salons-page[b-8ttrl1tgdw]  .salons-hero-panel-compact .salons-hero-visual {
        min-height: 360px;
        padding: 1.75rem;
    }

    .salons-page[b-8ttrl1tgdw]  .salons-hero-panel-compact .salons-category-card {
        min-height: 88px;
        border-radius: 20px;
        padding-block: 0.72rem;
    }

.salons-page[b-8ttrl1tgdw]  .salons-search-panel-floating {
    z-index: 7;
    width: min(1120px, calc(100% - 2.5rem));
    margin: -3.6rem auto 0;
}

    .salons-page[b-8ttrl1tgdw]  .salons-search-panel-floating .salons-search-header {
        align-items: flex-start !important;
    }

.salons-page[b-8ttrl1tgdw]  .salons-results-summary-compact {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    width: 100%;
    padding: 0.9rem 1.15rem;
    border-radius: 20px;
    background: color-mix(in srgb, var(--salons-surface) 96%, transparent);
    border: 1px solid color-mix(in srgb, var(--salons-primary) 8%, var(--salons-divider));
    box-shadow: 0 10px 26px color-mix(in srgb, var(--salons-text-primary) 4%, transparent);
    scroll-margin-top: 104px;
}

.salons-results-summary-copy[b-8ttrl1tgdw] {
    min-width: 0;
    display: grid;
    gap: 0.12rem;
}

.salons-page[b-8ttrl1tgdw]  .salons-results-summary-compact .salons-results-summary-title {
    line-height: 1.18;
}

.salons-page[b-8ttrl1tgdw]  .salons-results-summary-compact .salons-results-summary-text {
    line-height: 1.25;
}

.salons-page[b-8ttrl1tgdw]  .salons-area-chip {
    min-width: 142px;
    min-height: 60px;
    max-width: 180px;
    padding: 0.5rem 0.9rem;
    border-radius: 20px;
    background: color-mix(in srgb, var(--salons-primary) 6%, var(--salons-surface));
    border: 1px solid color-mix(in srgb, var(--salons-primary) 9%, var(--salons-divider));
    white-space: normal;
}

    .salons-page[b-8ttrl1tgdw]  .salons-area-chip .mud-button-label {
        display: grid;
        place-items: center;
        gap: 0.18rem;
        width: 100%;
        line-height: 1.1;
    }

        .salons-page[b-8ttrl1tgdw]  .salons-area-chip .mud-button-label span {
            max-width: 100%;
            color: var(--salons-text-primary);
            font-size: 0.84rem;
            font-weight: 950;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .salons-page[b-8ttrl1tgdw]  .salons-area-chip .mud-button-label small {
            color: var(--salons-primary);
            font-size: 0.74rem;
            font-weight: 900;
        }

.salons-auto-scroll-rail[b-8ttrl1tgdw] {
    will-change: scroll-position;
    touch-action: pan-x;
}


@media (max-width: 960px) {
    .salons-landing-shell[b-8ttrl1tgdw] {
        padding-top: 0;
    }

    .salons-floating-benefits[b-8ttrl1tgdw] {
        width: 100%;
        margin: 0 0 1rem;
        grid-template-columns: 1fr;
        border-radius: 24px;
    }

    .salons-page[b-8ttrl1tgdw]  .salons-hero-panel-compact {
        padding-top: 2rem;
        padding-bottom: 4.7rem;
    }

    .salons-page[b-8ttrl1tgdw]  .salons-search-panel-floating {
        width: 100%;
        margin-top: -3.2rem;
    }
}

@media (max-width: 600px) {
    .salons-floating-benefits[b-8ttrl1tgdw] {
        padding: 0.65rem;
        gap: 0.65rem;
    }

    .salons-floating-benefit-item[b-8ttrl1tgdw] {
        padding: 0.72rem;
        border-radius: 18px;
    }

    .salons-floating-benefit-icon[b-8ttrl1tgdw] {
        width: 46px;
        height: 46px;
        border-radius: 16px;
    }

    .salons-page[b-8ttrl1tgdw]  .salons-hero-panel-compact {
        padding-bottom: 4.35rem;
    }

    .salons-page[b-8ttrl1tgdw]  .salons-search-panel-floating {
        margin-top: -2.85rem;
    }

    .salons-page[b-8ttrl1tgdw]  .salons-results-summary-compact {
        flex-direction: column;
        align-items: flex-start;
        padding: 0.85rem;
    }

    .salons-page[b-8ttrl1tgdw]  .salons-area-chip {
        min-width: 130px;
        min-height: 56px;
    }
}


/* BB-013.3.5B Home/discovery merge final polish */

.salons-page[b-8ttrl1tgdw] {
    margin-top: -4.75rem;
}

.salons-landing-shell[b-8ttrl1tgdw] {
    padding-top: 0.35rem;
}

.salons-floating-benefits[b-8ttrl1tgdw] {
    margin-bottom: -1.55rem;
}

.salons-page[b-8ttrl1tgdw]  .salons-hero-panel-compact {
    padding-top: 4rem;
    padding-bottom: 3.35rem;
}

    .salons-page[b-8ttrl1tgdw]  .salons-hero-panel-compact .salons-title {
        font-size: clamp(2.25rem, 3.8vw, 3.35rem);
    }

    .salons-page[b-8ttrl1tgdw]  .salons-hero-panel-compact .salons-subtitle {
        font-size: 1.02rem;
        line-height: 1.58;
    }

    .salons-page[b-8ttrl1tgdw]  .salons-hero-panel-compact .salons-hero-visual {
        min-height: 330px;
        padding: 1.55rem;
    }

    .salons-page[b-8ttrl1tgdw]  .salons-hero-panel-compact .salons-category-card {
        min-height: 76px;
        border-radius: 18px;
    }

.salons-page[b-8ttrl1tgdw]  .salons-search-panel-floating {
    margin-top: -2.85rem;
}

.salons-page[b-8ttrl1tgdw]  .salons-results-summary-compact {
    width: auto;
    padding: 0;
    margin: -0.2rem 0 -0.2rem 0.2rem;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.salons-results-summary-copy[b-8ttrl1tgdw] {
    display: inline-flex;
    align-items: baseline;
    gap: 0.45rem;
    min-width: 0;
}

.salons-page[b-8ttrl1tgdw]  .salons-results-summary-compact .salons-results-summary-title {
    font-size: 0.92rem;
    line-height: 1;
}

.salons-page[b-8ttrl1tgdw]  .salons-results-summary-compact .salons-results-summary-text {
    font-size: 0.74rem;
    line-height: 1;
    opacity: 0.72;
}

.salons-page[b-8ttrl1tgdw]  .salons-page ::deep .salons-discovery-marquee-panel {
    overflow: hidden;
    padding: 1.55rem 1.75rem 1.45rem;
    border-radius: 30px;
    background: radial-gradient(circle at 92% 12%, color-mix(in srgb, var(--salons-secondary) 9%, transparent), transparent 30%), linear-gradient(135deg, color-mix(in srgb, var(--salons-primary) 4%, var(--salons-surface)), var(--salons-surface));
    border: 1px solid color-mix(in srgb, var(--salons-primary) 10%, var(--salons-divider));
    box-shadow: 0 18px 44px color-mix(in srgb, var(--salons-text-primary) 6%, transparent);
}

.salons-page[b-8ttrl1tgdw]  .salons-discovery-marquee-panel-results {
    margin-top: 0.15rem;
}

.salons-marquee-header[b-8ttrl1tgdw] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 0 0.35rem;
}

.salons-page[b-8ttrl1tgdw]  .salons-marquee-header .salons-rail-title {
    font-size: 1.08rem;
    line-height: 1.1;
}

.salons-page[b-8ttrl1tgdw]  .salons-marquee-header .salons-rail-subtitle {
    max-width: 560px;
    font-size: 0.82rem;
    line-height: 1.35;
}

.salons-marquee-shell[b-8ttrl1tgdw] {
    position: relative;
    min-width: 0;
    margin-top: 1.15rem;
}

    .salons-marquee-shell[b-8ttrl1tgdw]::before,
    .salons-marquee-shell[b-8ttrl1tgdw]::after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        z-index: 3;
        width: 64px;
        pointer-events: none;
    }

    .salons-marquee-shell[b-8ttrl1tgdw]::before {
        left: 0;
        background: linear-gradient(90deg, var(--salons-surface), transparent);
    }

    .salons-marquee-shell[b-8ttrl1tgdw]::after {
        right: 0;
        background: linear-gradient(270deg, var(--salons-surface), transparent);
    }

.salons-place-marquee-rail[b-8ttrl1tgdw] {
    display: flex;
    flex-wrap: nowrap;
    gap: 0.85rem;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    scroll-snap-type: none;
    scroll-behavior: auto;
    padding: 0.2rem 0.2rem 0.35rem;
    cursor: grab;
    user-select: none;
    scrollbar-width: none;
    -ms-overflow-style: none;
    will-change: scroll-position;
}

    .salons-place-marquee-rail[b-8ttrl1tgdw]::-webkit-scrollbar {
        display: none;
    }

    .salons-place-marquee-rail.is-dragging[b-8ttrl1tgdw] {
        cursor: grabbing;
    }

.salons-place-card[b-8ttrl1tgdw] {
    flex: 0 0 calc((100% - 1.7rem) / 3);
    min-width: 260px;
    min-height: 112px;
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: 1fr auto;
    gap: 0.72rem;
    padding: 1.05rem 1.15rem;
    text-align: left;
    cursor: pointer;
    appearance: none;
    border-radius: 24px;
    border: 1px solid color-mix(in srgb, var(--salons-primary) 11%, var(--salons-divider));
    background: radial-gradient(circle at 90% 10%, color-mix(in srgb, var(--salons-secondary) 8%, transparent), transparent 38%), color-mix(in srgb, var(--salons-surface) 96%, transparent);
    box-shadow: 0 12px 28px color-mix(in srgb, var(--salons-text-primary) 5%, transparent);
    transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

    .salons-place-card:hover[b-8ttrl1tgdw] {
        transform: translateY(-3px);
        border-color: color-mix(in srgb, var(--salons-primary) 28%, var(--salons-divider));
        box-shadow: 0 18px 40px color-mix(in srgb, var(--salons-primary) 10%, transparent);
    }

    .salons-place-card:focus-visible[b-8ttrl1tgdw] {
        outline: none;
        border-color: color-mix(in srgb, var(--salons-primary) 56%, var(--salons-divider));
        box-shadow: 0 0 0 4px color-mix(in srgb, var(--salons-primary) 15%, transparent);
    }

.salons-place-card-icon[b-8ttrl1tgdw] {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border-radius: 18px;
    background: linear-gradient(135deg, var(--salons-primary), var(--salons-secondary));
    box-shadow: 0 12px 24px color-mix(in srgb, var(--salons-primary) 16%, transparent);
}

.salons-page[b-8ttrl1tgdw]  .salons-place-card-icon .mud-icon-root {
    color: #ffffff !important;
    font-size: 1.3rem;
}

.salons-place-card-copy[b-8ttrl1tgdw] {
    min-width: 0;
    display: grid;
    gap: 0.14rem;
}

    .salons-place-card-copy strong[b-8ttrl1tgdw] {
        color: var(--salons-text-primary);
        font-size: 1.02rem;
        font-weight: 950;
        line-height: 1.1;
        letter-spacing: -0.02em;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .salons-place-card-copy small[b-8ttrl1tgdw] {
        color: var(--salons-text-secondary);
        font-size: 0.78rem;
        font-weight: 750;
        line-height: 1.1;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.salons-place-card-count[b-8ttrl1tgdw] {
    grid-column: 1 / -1;
    width: fit-content;
    padding: 0.34rem 0.66rem;
    color: var(--salons-primary);
    font-size: 0.74rem;
    font-weight: 950;
    border-radius: 999px;
    background: color-mix(in srgb, var(--salons-primary) 8%, var(--salons-surface));
    border: 1px solid color-mix(in srgb, var(--salons-primary) 12%, var(--salons-divider));
}

.salons-area-place-card[b-8ttrl1tgdw] {
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto;
    align-items: center;
    min-height: 88px;
    text-align: left;
}

.salons-area-place-card-copy[b-8ttrl1tgdw] {
    place-items: start;
    gap: 0.32rem;
}

    .salons-area-place-card-copy strong[b-8ttrl1tgdw] {
        font-size: 0.9rem;
        text-transform: uppercase;
        letter-spacing: 0.06em;
    }

    .salons-area-place-card-copy small[b-8ttrl1tgdw] {
        color: var(--salons-primary);
        font-size: 0.76rem;
        font-weight: 950;
        text-transform: lowercase;
    }

/* Keep old rail classes safe if any markup still references them */
.salons-page[b-8ttrl1tgdw]  .salons-area-strip {
    display: none;
}

.salons-page[b-8ttrl1tgdw]  .salons-discovery-rail-panel {
    display: none;
}

@media (max-width: 1280px) {
    .salons-page[b-8ttrl1tgdw] {
        margin-top: -3.6rem;
    }

        .salons-page[b-8ttrl1tgdw]  .salons-hero-panel-compact {
            padding-top: 3.75rem;
            padding-bottom: 3.45rem;
        }
}

@media (max-width: 960px) {
    .salons-page[b-8ttrl1tgdw] {
        margin-top: -1.4rem;
    }

    .salons-landing-shell[b-8ttrl1tgdw] {
        padding-top: 0;
    }

    .salons-floating-benefits[b-8ttrl1tgdw] {
        margin-bottom: 1rem;
    }

    .salons-page[b-8ttrl1tgdw]  .salons-hero-panel-compact {
        padding-top: 1.75rem;
        padding-bottom: 4.25rem;
    }

    .salons-page[b-8ttrl1tgdw]  .salons-search-panel-floating {
        margin-top: -2.6rem;
    }

    .salons-page[b-8ttrl1tgdw]  .salons-page ::deep .salons-discovery-marquee-panel {
        border-radius: 24px;
        padding: 1rem;
    }

    .salons-marquee-header[b-8ttrl1tgdw] {
        flex-direction: column;
    }

    .salons-place-card[b-8ttrl1tgdw] {
        flex-basis: clamp(230px, 46%, 300px);
    }

    .salons-results-summary-copy[b-8ttrl1tgdw] {
        display: grid;
        gap: 0.1rem;
    }
}

@media (max-width: 600px) {
    .salons-page[b-8ttrl1tgdw] {
        margin-top: -0.65rem;
    }

        .salons-page[b-8ttrl1tgdw]  .salons-hero-panel-compact {
            padding-top: 1.35rem;
            padding-bottom: 3.9rem;
        }

        .salons-page[b-8ttrl1tgdw]  .salons-search-panel-floating {
            margin-top: -2.4rem;
        }

    .salons-place-card[b-8ttrl1tgdw] {
        flex-basis: 78vw;
        min-height: 92px;
    }

    .salons-marquee-shell[b-8ttrl1tgdw]::before,
    .salons-marquee-shell[b-8ttrl1tgdw]::after {
        width: 32px;
    }
}

/* BB-013.3.5B Final marquee polish */
.salons-page[b-8ttrl1tgdw] {
    margin-top: -3.85rem;
}

.salons-landing-shell[b-8ttrl1tgdw] {
    padding-top: 0.45rem;
}

.salons-page[b-8ttrl1tgdw]  .salons-hero-panel-compact {
    padding-top: 3.85rem;
    padding-bottom: 3.45rem;
}

    .salons-page[b-8ttrl1tgdw]  .salons-hero-panel-compact .salons-title {
        font-size: clamp(2.55rem, 4.5vw, 3.15rem);
    }

    .salons-page[b-8ttrl1tgdw]  .salons-hero-panel-compact .salons-hero-visual {
        min-height: 330px;
    }

    .salons-page[b-8ttrl1tgdw]  .salons-hero-panel-compact .salons-category-card {
        min-height: 76px;
    }

.salons-page[b-8ttrl1tgdw]  .salons-discovery-marquee-panel {
    padding: 1.55rem 1.75rem 1.45rem;
}

.salons-marquee-header[b-8ttrl1tgdw] {
    padding: 0 0.35rem;
}

.salons-marquee-shell[b-8ttrl1tgdw] {
    margin-top: 1.15rem;
}

.salons-place-marquee-rail[b-8ttrl1tgdw] {
    padding: 0.25rem 0.35rem 0.42rem;
    touch-action: pan-x;
}

.salons-place-card[b-8ttrl1tgdw] {
    flex: 0 0 calc((100% - 1.7rem) / 3);
    min-width: 260px;
    min-height: 112px;
    padding: 1.05rem 1.15rem;
}

.salons-place-card-icon[b-8ttrl1tgdw] {
    width: 48px;
    height: 48px;
}

.salons-place-card-copy strong[b-8ttrl1tgdw] {
    font-size: 1.02rem;
}

.salons-place-card-copy small[b-8ttrl1tgdw] {
    font-size: 0.78rem;
}

.salons-place-card-count[b-8ttrl1tgdw] {
    font-size: 0.74rem;
}

.salons-area-place-card[b-8ttrl1tgdw] {
    min-height: 88px;
}

@media (max-width: 960px) {
    .salons-page[b-8ttrl1tgdw] {
        margin-top: -1.45rem;
    }

    .salons-landing-shell[b-8ttrl1tgdw] {
        padding-top: 0;
    }

    .salons-page[b-8ttrl1tgdw]  .salons-hero-panel-compact {
        padding-top: 1.7rem;
        padding-bottom: 4.1rem;
    }

    .salons-place-card[b-8ttrl1tgdw] {
        flex-basis: clamp(230px, 46%, 300px);
    }
}

@media (max-width: 600px) {
    .salons-page[b-8ttrl1tgdw] {
        margin-top: -0.65rem;
    }

        .salons-page[b-8ttrl1tgdw]  .salons-hero-panel-compact {
            padding-top: 1.3rem;
            padding-bottom: 3.75rem;
        }

    .salons-place-card[b-8ttrl1tgdw] {
        flex-basis: 78vw;
        min-height: 92px;
    }
}


/* BB-013.3.5B Stable finite carousel polish */

.salons-page[b-8ttrl1tgdw]  .salons-discovery-marquee-panel {
    padding: 1.2rem 1.3rem 1.15rem;
}

.salons-marquee-header[b-8ttrl1tgdw] {
    padding-inline: 0.2rem;
}

.salons-marquee-shell[b-8ttrl1tgdw] {
    margin-inline: 0.1rem;
}

.salons-place-marquee-rail[b-8ttrl1tgdw] {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - 2.4rem) / 4);
    gap: 0.8rem;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline mandatory;
    padding: 0.45rem 0.2rem 0.3rem;
    scrollbar-width: none;
    -ms-overflow-style: none;
    cursor: grab;
}

    .salons-place-marquee-rail[b-8ttrl1tgdw]::-webkit-scrollbar {
        display: none;
    }

    .salons-place-marquee-rail.is-dragging[b-8ttrl1tgdw] {
        cursor: grabbing;
        scroll-snap-type: none;
    }

.salons-place-card[b-8ttrl1tgdw] {
    scroll-snap-align: start;
    min-width: 0;
    min-height: 112px;
    padding: 1rem;
}

.salons-area-place-card[b-8ttrl1tgdw] {
    min-height: 86px;
    place-items: center;
}

.salons-area-place-card-copy[b-8ttrl1tgdw] {
    width: 100%;
    text-align: center;
}

    .salons-area-place-card-copy strong[b-8ttrl1tgdw],
    .salons-area-place-card-copy small[b-8ttrl1tgdw] {
        display: block;
    }

@media (max-width: 960px) {
    .salons-place-marquee-rail[b-8ttrl1tgdw] {
        grid-auto-columns: calc((100% - 0.8rem) / 2);
    }
}

@media (max-width: 600px) {
    .salons-place-marquee-rail[b-8ttrl1tgdw] {
        grid-auto-columns: 76%;
        gap: 0.7rem;
    }

    .salons-page[b-8ttrl1tgdw]  .salons-discovery-marquee-panel {
        padding: 1rem;
    }
}

/* BB-013.3.5C Stable finite city carousel fixes */
.salons-page[b-8ttrl1tgdw]  .salons-discovery-marquee-panel {
    padding: 1.65rem 2rem 1.45rem;
}

.salons-marquee-header[b-8ttrl1tgdw] {
    padding-inline: 0.55rem;
    gap: 1.25rem;
}

.salons-page[b-8ttrl1tgdw]  .salons-marquee-header .salons-rail-title {
    margin-bottom: 0.2rem;
}

.salons-marquee-shell[b-8ttrl1tgdw] {
    margin-top: 1.25rem;
    margin-inline: 0.15rem;
}

.salons-place-marquee-rail[b-8ttrl1tgdw] {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - 2.4rem) / 4);
    gap: 0.8rem;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline mandatory;
    padding: 0.65rem 0.35rem 0.45rem;
    scrollbar-width: none;
    -ms-overflow-style: none;
    cursor: grab;
    touch-action: pan-x;
    user-select: none;
}

    .salons-place-marquee-rail.is-dragging[b-8ttrl1tgdw] {
        cursor: grabbing;
        scroll-snap-type: none;
    }

.salons-place-card[b-8ttrl1tgdw] {
    scroll-snap-align: start;
    min-width: 0;
    min-height: 108px;
    padding: 1rem 1.1rem;
    user-select: none;
}

    .salons-place-card:active[b-8ttrl1tgdw] {
        transform: translateY(-1px);
    }

.salons-area-place-card[b-8ttrl1tgdw] {
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto;
    place-items: center stretch;
    min-height: 84px;
    text-align: left;
}

.salons-area-place-card-copy[b-8ttrl1tgdw] {
    width: auto;
    place-items: start;
    text-align: left;
}

@media (max-width: 960px) {
    .salons-page[b-8ttrl1tgdw]  .salons-discovery-marquee-panel {
        padding: 1.25rem;
    }

    .salons-marquee-header[b-8ttrl1tgdw] {
        padding-inline: 0.2rem;
    }

    .salons-place-marquee-rail[b-8ttrl1tgdw] {
        grid-auto-columns: calc((100% - 0.8rem) / 2);
    }
}

@media (max-width: 600px) {
    .salons-page[b-8ttrl1tgdw]  .salons-discovery-marquee-panel {
        padding: 1rem;
    }

    .salons-place-marquee-rail[b-8ttrl1tgdw] {
        grid-auto-columns: 78%;
        gap: 0.7rem;
        padding-inline: 0.2rem;
    }
}

/* BB-013.3.5C Finite continuous discovery rail polish */
.salons-page[b-8ttrl1tgdw]  .salons-discovery-marquee-panel {
    padding: 1.45rem 1.7rem 1.35rem;
}

.salons-marquee-header[b-8ttrl1tgdw] {
    padding: 0 0.35rem;
}

.salons-marquee-shell[b-8ttrl1tgdw] {
    margin-top: 1.05rem;
}

.salons-place-marquee-rail[b-8ttrl1tgdw] {
    gap: 0.9rem;
    padding: 0.35rem 0.3rem 0.55rem;
    scroll-behavior: auto;
}

.salons-place-card[b-8ttrl1tgdw] {
    flex: 0 0 calc((100% - 2.7rem) / 4);
    min-width: 230px;
    max-width: none;
}

.salons-place-marquee-rail.is-dragging .salons-place-card[b-8ttrl1tgdw] {
    cursor: grabbing;
}

@media (max-width: 960px) {
    .salons-page[b-8ttrl1tgdw]  .salons-discovery-marquee-panel {
        padding: 1.15rem;
    }

    .salons-place-card[b-8ttrl1tgdw] {
        flex-basis: calc((100% - 0.9rem) / 2);
        min-width: 210px;
    }
}

@media (max-width: 600px) {
    .salons-page[b-8ttrl1tgdw]  .salons-discovery-marquee-panel {
        padding: 1rem;
    }

    .salons-place-card[b-8ttrl1tgdw] {
        flex-basis: 76vw;
        min-width: 0;
    }
}


/* BB-013.3.5D Final CTA + manual carousel stabilization */
.salons-page[b-8ttrl1tgdw]  .salons-discovery-marquee-panel {
    padding: 1.55rem 1.9rem 1.45rem;
}

.salons-marquee-header[b-8ttrl1tgdw] {
    padding: 0 0.45rem;
}

.salons-marquee-shell[b-8ttrl1tgdw] {
    margin-top: 1.1rem;
    margin-inline: 0.2rem;
}

    .salons-marquee-shell[b-8ttrl1tgdw]::before,
    .salons-marquee-shell[b-8ttrl1tgdw]::after {
        width: 40px;
    }

.salons-place-marquee-rail[b-8ttrl1tgdw] {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - 2.7rem) / 4);
    gap: 0.9rem;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    scroll-behavior: auto;
    scroll-snap-type: none;
    padding: 0.4rem 0.3rem 0.6rem;
    cursor: grab;
    user-select: none;
    touch-action: pan-y;
    scrollbar-width: none;
    -ms-overflow-style: none;
    will-change: scroll-position;
}

    .salons-place-marquee-rail[b-8ttrl1tgdw]::-webkit-scrollbar {
        display: none;
    }

    .salons-place-marquee-rail.is-dragging[b-8ttrl1tgdw] {
        cursor: grabbing;
    }

        .salons-place-marquee-rail.is-dragging .salons-place-card[b-8ttrl1tgdw] {
            cursor: grabbing;
        }

.salons-place-card[b-8ttrl1tgdw] {
    width: auto;
    min-width: 0;
    max-width: none;
    min-height: 108px;
    padding: 1rem 1.1rem;
    scroll-snap-align: none;
    user-select: none;
}

.salons-area-place-card[b-8ttrl1tgdw] {
    min-height: 84px;
}

@media (max-width: 960px) {
    .salons-page[b-8ttrl1tgdw]  .salons-discovery-marquee-panel {
        padding: 1.2rem;
    }

    .salons-marquee-header[b-8ttrl1tgdw] {
        padding-inline: 0.2rem;
    }

    .salons-place-marquee-rail[b-8ttrl1tgdw] {
        grid-auto-columns: calc((100% - 0.9rem) / 2);
    }
}

@media (max-width: 600px) {
    .salons-page[b-8ttrl1tgdw]  .salons-discovery-marquee-panel {
        padding: 1rem;
    }

    .salons-place-marquee-rail[b-8ttrl1tgdw] {
        grid-auto-columns: 78%;
        gap: 0.7rem;
        padding-inline: 0.2rem;
    }
}


/* BB-013.3.5C CTA stability + carousel final polish */
.salons-page[b-8ttrl1tgdw]  .salons-location-alert {
    border-radius: 16px;
    font-weight: 750;
}

.salons-location-intelligence-note[b-8ttrl1tgdw] {
    width: fit-content;
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    gap: 0.48rem;
    padding: 0.62rem 0.82rem;
    color: var(--salons-text-primary);
    font-size: 0.82rem;
    font-weight: 820;
    line-height: 1.35;
    border-radius: 999px;
    background: color-mix(in srgb, var(--salons-info) 8%, var(--salons-surface));
    border: 1px solid color-mix(in srgb, var(--salons-info) 14%, var(--salons-divider));
}

.salons-page[b-8ttrl1tgdw]  .salons-location-intelligence-note .mud-icon-root {
    color: var(--salons-info);
    flex: 0 0 auto;
}


.salons-page[b-8ttrl1tgdw]  .salons-discovery-marquee-panel {
    padding: 1.55rem 1.65rem 1.25rem;
}

.salons-marquee-header[b-8ttrl1tgdw] {
    padding: 0 0.35rem;
}

.salons-marquee-shell[b-8ttrl1tgdw] {
    margin-top: 1.1rem;
}

.salons-place-marquee-rail[b-8ttrl1tgdw] {
    gap: 0.85rem;
    padding: 0.25rem 0.35rem 0.45rem;
    touch-action: pan-y;
}

.salons-place-card[b-8ttrl1tgdw] {
    flex: 0 0 calc((100% - 2.55rem) / 4);
}

@media (max-width: 960px) {
    .salons-page[b-8ttrl1tgdw]  .salons-discovery-marquee-panel {
        padding: 1.15rem;
    }

    .salons-place-card[b-8ttrl1tgdw] {
        flex-basis: clamp(210px, 44%, 280px);
    }
}

@media (max-width: 600px) {
    .salons-page[b-8ttrl1tgdw]  .salons-discovery-marquee-panel {
        padding: 1rem;
    }

    .salons-place-card[b-8ttrl1tgdw] {
        flex-basis: 74vw;
    }
}


.salons-page[b-8ttrl1tgdw]  .salons-empty-market-state {
    position: relative;
    overflow: hidden;
    padding: 2rem;
    border-radius: 32px;
    background: radial-gradient(circle at 88% 12%, color-mix(in srgb, var(--salons-secondary) 12%, transparent), transparent 30%), radial-gradient(circle at 12% 92%, color-mix(in srgb, var(--salons-primary) 10%, transparent), transparent 32%), linear-gradient(135deg, var(--salons-surface), color-mix(in srgb, var(--salons-primary) 4%, var(--salons-surface)));
    border: 1px solid color-mix(in srgb, var(--salons-primary) 10%, var(--salons-divider));
    box-shadow: 0 22px 58px color-mix(in srgb, var(--salons-text-primary) 7%, transparent);
}

    .salons-page[b-8ttrl1tgdw]  .salons-empty-market-state::before {
        content: "";
        position: absolute;
        right: -90px;
        bottom: -120px;
        width: 290px;
        height: 290px;
        border-radius: 999px;
        background: color-mix(in srgb, var(--salons-primary) 8%, transparent);
        pointer-events: none;
    }

.salons-empty-market-grid[b-8ttrl1tgdw] {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(340px, 430px);
    gap: 1.5rem;
    align-items: stretch;
}

.salons-empty-market-main[b-8ttrl1tgdw] {
    min-width: 0;
    display: grid;
    align-content: center;
    gap: 1rem;
}

.salons-empty-market-kicker[b-8ttrl1tgdw] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.5rem 0.85rem;
    color: #ffffff;
    font-size: 0.74rem;
    font-weight: 950;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--salons-primary), var(--salons-secondary));
    box-shadow: 0 14px 30px color-mix(in srgb, var(--salons-primary) 22%, transparent);
}

.salons-page[b-8ttrl1tgdw]  .salons-empty-market-kicker .mud-icon-root {
    color: #ffffff !important;
}

.salons-page[b-8ttrl1tgdw]  .salons-empty-market-title {
    max-width: 640px;
    color: var(--salons-text-primary);
    font-weight: 950;
    line-height: 1.08;
    letter-spacing: -0.04em;
}

.salons-page[b-8ttrl1tgdw]  .salons-empty-market-text {
    max-width: 680px;
    color: var(--salons-text-secondary);
    line-height: 1.68;
    font-weight: 600;
}

.salons-empty-market-actions[b-8ttrl1tgdw] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    margin-top: 0.15rem;
}

.salons-page[b-8ttrl1tgdw]  .salons-empty-market-actions .mud-button-root {
    min-height: 48px;
    border-radius: 999px;
    font-weight: 950;
}

.salons-empty-market-side[b-8ttrl1tgdw] {
    min-width: 0;
    display: grid;
    gap: 1rem;
}

.salons-empty-suggestion-card[b-8ttrl1tgdw] {
    position: relative;
    overflow: hidden;
    display: grid;
    gap: 1rem;
    padding: 1rem;
    border-radius: 26px;
    background: radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--salons-secondary) 9%, transparent), transparent 32%), color-mix(in srgb, var(--salons-surface) 96%, transparent);
    border: 1px solid color-mix(in srgb, var(--salons-primary) 9%, var(--salons-divider));
    box-shadow: 0 14px 34px color-mix(in srgb, var(--salons-text-primary) 5%, transparent);
}

.salons-empty-suggestion-card-services[b-8ttrl1tgdw] {
    background: radial-gradient(circle at 86% 12%, color-mix(in srgb, var(--salons-primary) 10%, transparent), transparent 30%), radial-gradient(circle at 12% 92%, color-mix(in srgb, var(--salons-secondary) 8%, transparent), transparent 34%), color-mix(in srgb, var(--salons-surface) 96%, transparent);
}

.salons-empty-suggestion-card-launch[b-8ttrl1tgdw] {
    background: radial-gradient(circle at 86% 12%, color-mix(in srgb, var(--salons-secondary) 13%, transparent), transparent 30%), linear-gradient(135deg, color-mix(in srgb, var(--salons-primary) 5%, var(--salons-surface)), var(--salons-surface));
}

.salons-empty-suggestion-header[b-8ttrl1tgdw] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.8rem;
    align-items: center;
}

.salons-empty-suggestion-icon[b-8ttrl1tgdw] {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border-radius: 18px;
    background: color-mix(in srgb, var(--salons-primary) 9%, var(--salons-surface));
    box-shadow: 0 12px 24px color-mix(in srgb, var(--salons-primary) 10%, transparent);
}

.salons-page[b-8ttrl1tgdw]  .salons-empty-suggestion-icon .mud-icon-root {
    color: var(--salons-primary);
    font-size: 1.35rem;
}

.salons-empty-suggestion-header strong[b-8ttrl1tgdw] {
    display: block;
    color: var(--salons-text-primary);
    font-size: 1rem;
    font-weight: 950;
    line-height: 1.16;
    letter-spacing: -0.02em;
}

.salons-empty-suggestion-header small[b-8ttrl1tgdw] {
    display: block;
    margin-top: 0.12rem;
    color: var(--salons-text-secondary);
    font-size: 0.78rem;
    font-weight: 650;
    line-height: 1.35;
}

.salons-empty-service-grid[b-8ttrl1tgdw] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.salons-empty-service-chip[b-8ttrl1tgdw] {
    --empty-service-color: var(--salons-primary);
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    gap: 0.38rem;
    padding: 0.48rem 0.72rem;
    cursor: pointer;
    appearance: none;
    border-radius: 999px;
    color: var(--salons-text-primary);
    font-size: 0.78rem;
    font-weight: 900;
    background: radial-gradient(circle at 86% 14%, color-mix(in srgb, var(--empty-service-color) 13%, transparent), transparent 34%), var(--salons-surface);
    border: 1px solid color-mix(in srgb, var(--empty-service-color) 16%, var(--salons-divider));
    box-shadow: 0 8px 18px color-mix(in srgb, var(--salons-text-primary) 4%, transparent);
    transition: transform 150ms ease, border-color 150ms ease, box-shadow 150ms ease, color 150ms ease;
}

    .salons-empty-service-chip:hover[b-8ttrl1tgdw] {
        transform: translateY(-2px);
        color: var(--empty-service-color);
        border-color: color-mix(in srgb, var(--empty-service-color) 36%, var(--salons-divider));
        box-shadow: 0 14px 28px color-mix(in srgb, var(--empty-service-color) 10%, transparent);
    }

    .salons-empty-service-chip:focus-visible[b-8ttrl1tgdw] {
        outline: none;
        box-shadow: 0 0 0 4px color-mix(in srgb, var(--empty-service-color) 14%, transparent), 0 14px 28px color-mix(in srgb, var(--empty-service-color) 10%, transparent);
    }

.salons-page[b-8ttrl1tgdw]  .salons-empty-service-chip .mud-icon-root {
    color: var(--empty-service-color);
    font-size: 1rem;
}

.salons-empty-service-chip-primary[b-8ttrl1tgdw] {
    --empty-service-color: var(--salons-primary);
}

.salons-empty-service-chip-secondary[b-8ttrl1tgdw] {
    --empty-service-color: var(--salons-secondary);
}

.salons-empty-service-chip-pink[b-8ttrl1tgdw] {
    --empty-service-color: var(--salons-error);
}

.salons-empty-service-chip-gold[b-8ttrl1tgdw] {
    --empty-service-color: var(--salons-warning);
}

.salons-empty-service-chip-info[b-8ttrl1tgdw] {
    --empty-service-color: var(--salons-info);
}

.salons-empty-place-list[b-8ttrl1tgdw] {
    display: grid;
    gap: 0.55rem;
}

.salons-empty-place-button[b-8ttrl1tgdw] {
    width: 100%;
    min-height: 58px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.72rem 0.85rem;
    text-align: left;
    cursor: pointer;
    appearance: none;
    border-radius: 18px;
    background: color-mix(in srgb, var(--salons-primary) 5%, var(--salons-surface));
    border: 1px solid color-mix(in srgb, var(--salons-primary) 8%, var(--salons-divider));
    transition: transform 150ms ease, border-color 150ms ease, box-shadow 150ms ease, background 150ms ease;
}

    .salons-empty-place-button:hover[b-8ttrl1tgdw] {
        transform: translateY(-2px);
        border-color: color-mix(in srgb, var(--salons-primary) 26%, var(--salons-divider));
        background: color-mix(in srgb, var(--salons-primary) 7%, var(--salons-surface));
        box-shadow: 0 14px 28px color-mix(in srgb, var(--salons-primary) 9%, transparent);
    }

    .salons-empty-place-button:focus-visible[b-8ttrl1tgdw] {
        outline: none;
        box-shadow: 0 0 0 4px color-mix(in srgb, var(--salons-primary) 14%, transparent), 0 14px 28px color-mix(in srgb, var(--salons-primary) 9%, transparent);
    }

    .salons-empty-place-button span[b-8ttrl1tgdw] {
        min-width: 0;
        display: grid;
        gap: 0.12rem;
    }

    .salons-empty-place-button strong[b-8ttrl1tgdw] {
        color: var(--salons-text-primary);
        font-size: 0.9rem;
        font-weight: 950;
        line-height: 1.15;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .salons-empty-place-button small[b-8ttrl1tgdw] {
        color: var(--salons-text-secondary);
        font-size: 0.76rem;
        font-weight: 700;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .salons-empty-place-button em[b-8ttrl1tgdw] {
        flex: 0 0 auto;
        padding: 0.34rem 0.58rem;
        color: var(--salons-primary);
        font-style: normal;
        font-size: 0.72rem;
        font-weight: 950;
        white-space: nowrap;
        border-radius: 999px;
        background: color-mix(in srgb, var(--salons-primary) 8%, var(--salons-surface));
        border: 1px solid color-mix(in srgb, var(--salons-primary) 10%, var(--salons-divider));
    }

@media (max-width: 960px) {
    .salons-empty-market-grid[b-8ttrl1tgdw] {
        grid-template-columns: 1fr;
    }

    .salons-page[b-8ttrl1tgdw]  .salons-empty-market-state {
        padding: 1.35rem;
        border-radius: 28px;
    }
}

@media (max-width: 600px) {
    .salons-page[b-8ttrl1tgdw]  .salons-empty-market-state {
        padding: 1rem;
        border-radius: 22px;
    }

    .salons-empty-market-actions[b-8ttrl1tgdw] {
        display: grid;
    }

    .salons-page[b-8ttrl1tgdw]  .salons-empty-market-actions .mud-button-root {
        width: 100%;
    }

    .salons-empty-suggestion-card[b-8ttrl1tgdw] {
        padding: 0.9rem;
        border-radius: 22px;
    }

    .salons-empty-suggestion-header[b-8ttrl1tgdw] {
        grid-template-columns: 1fr;
    }

    .salons-empty-suggestion-icon[b-8ttrl1tgdw] {
        width: 44px;
        height: 44px;
        border-radius: 16px;
    }

    .salons-empty-place-button[b-8ttrl1tgdw] {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.45rem;
    }
}

.salons-page[b-8ttrl1tgdw]  .salon-card-media-with-image {
    isolation: isolate;
    --salon-shine-soft-opacity: 0.34;
    --salon-shine-peak-opacity: 0.52;
    --salon-sparkle-opacity: 0.72;
}

    .salons-page[b-8ttrl1tgdw]  .salon-card-media-with-image::after {
        content: "";
        position: absolute;
        top: -52%;
        left: -92%;
        width: 70%;
        height: 195%;
        z-index: 2;
        pointer-events: none;
        opacity: 0;
        transform: translateX(-25%) rotate(18deg);
        background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.00) 10%, rgba(255, 255, 255, 0.08) 24%, rgba(255, 255, 255, 0.17) 35%, rgba(245, 247, 255, 0.52) 50%, rgba(226, 232, 240, 0.30) 59%, rgba(203, 213, 225, 0.14) 70%, rgba(255, 255, 255, 0.04) 82%, transparent 100%);
        filter: blur(1.25px);
        mix-blend-mode: screen;
        animation: salon-card-two-way-shine-fresh-b-8ttrl1tgdw 9.2s ease-in-out infinite;
    }

.salons-page[b-8ttrl1tgdw]  .salon-card-image-overlay {
    overflow: hidden;
    transition: background 180ms ease;
}

    .salons-page[b-8ttrl1tgdw]  .salon-card-image-overlay::after {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 3;
        pointer-events: none;
        opacity: 0;
        background: radial-gradient(circle at 18% 25%, rgba(255, 255, 255, 1) 0 1px, rgba(255, 255, 255, 0.58) 2px, transparent 5px), radial-gradient(circle at 37% 17%, rgba(248, 250, 252, 0.92) 0 1px, rgba(226, 232, 240, 0.46) 2px, transparent 5px), radial-gradient(circle at 73% 24%, rgba(255, 255, 255, 0.96) 0 1px, rgba(255, 255, 255, 0.44) 2px, transparent 5px), radial-gradient(circle at 86% 56%, rgba(248, 250, 252, 0.88) 0 1px, rgba(226, 232, 240, 0.40) 2px, transparent 5px), radial-gradient(circle at 58% 43%, rgba(255, 255, 255, 0.82) 0 1px, rgba(255, 255, 255, 0.34) 2px, transparent 4px), radial-gradient(circle at 28% 72%, rgba(248, 250, 252, 0.86) 0 1px, rgba(226, 232, 240, 0.38) 2px, transparent 5px), radial-gradient(circle at 48% 78%, rgba(255, 255, 255, 0.76) 0 1px, rgba(255, 255, 255, 0.30) 2px, transparent 4px);
        filter: drop-shadow(0 0 5px rgba(255, 255, 255, 0.52)) drop-shadow(0 0 12px rgba(226, 232, 240, 0.26));
        mix-blend-mode: screen;
        transform: translate3d(0, 5px, 0) scale(0.98);
        animation: salon-card-visible-sparkles-fresh-b-8ttrl1tgdw 9.2s ease-in-out infinite;
    }

.salons-page[b-8ttrl1tgdw]  .salon-card:hover .salon-card-media-with-image,
.salons-page[b-8ttrl1tgdw]  .salon-card:focus-visible .salon-card-media-with-image {
    --salon-shine-soft-opacity: 0.42;
    --salon-shine-peak-opacity: 0.68;
    --salon-sparkle-opacity: 0.88;
}

    .salons-page[b-8ttrl1tgdw]  .salon-card:hover .salon-card-media-with-image::before,
    .salons-page[b-8ttrl1tgdw]  .salon-card:focus-visible .salon-card-media-with-image::before {
        opacity: 0.28;
    }

.salons-page[b-8ttrl1tgdw]  .salon-card:hover .salon-card-image,
.salons-page[b-8ttrl1tgdw]  .salon-card:focus-visible .salon-card-image {
    transform: scale(1.055);
    filter: brightness(1.12) saturate(1.08);
}

.salons-page[b-8ttrl1tgdw]  .salon-card:hover .salon-card-image-overlay,
.salons-page[b-8ttrl1tgdw]  .salon-card:focus-visible .salon-card-image-overlay {
    background: radial-gradient(circle at 18% 12%, rgba(255, 255, 255, 0.12), transparent 30%), linear-gradient(180deg, rgba(15, 23, 42, 0.02), rgba(15, 23, 42, 0.30));
}

    .salons-page[b-8ttrl1tgdw]  .salon-card:hover .salon-card-media-with-image::after,
    .salons-page[b-8ttrl1tgdw]  .salon-card:focus-visible .salon-card-media-with-image::after,
    .salons-page[b-8ttrl1tgdw]  .salon-card:hover .salon-card-image-overlay::after,
    .salons-page[b-8ttrl1tgdw]  .salon-card:focus-visible .salon-card-image-overlay::after {
        animation-duration: 5.4s;
    }

.salons-page[b-8ttrl1tgdw]  .salon-card-media-with-image .salon-card-image-overlay {
    z-index: 1;
}

.salons-page[b-8ttrl1tgdw]  .salon-card-media-with-image .salon-card-media-top,
.salons-page[b-8ttrl1tgdw]  .salon-card-media-with-image .salon-card-media-bottom {
    z-index: 4;
}

.salons-page[b-8ttrl1tgdw]  .salon-card-media-with-image .salon-card-initials,
.salons-page[b-8ttrl1tgdw]  .salon-card-media-with-image .salon-card-media-badges {
    position: relative;
    z-index: 5;
}

@keyframes salon-card-two-way-shine-fresh-b-8ttrl1tgdw {
    0% {
        left: -92%;
        top: -52%;
        opacity: 0;
        transform: translateX(-25%) rotate(18deg);
    }

    8% {
        opacity: var(--salon-shine-soft-opacity);
    }

    25% {
        opacity: var(--salon-shine-peak-opacity);
    }

    39% {
        left: 132%;
        top: 42%;
        opacity: 0;
        transform: translateX(25%) rotate(18deg);
    }

    50% {
        left: 132%;
        top: -52%;
        opacity: 0;
        transform: translateX(25%) rotate(-18deg);
    }

    58% {
        opacity: var(--salon-shine-soft-opacity);
    }

    75% {
        opacity: var(--salon-shine-peak-opacity);
    }

    89% {
        left: -92%;
        top: 42%;
        opacity: 0;
        transform: translateX(-25%) rotate(-18deg);
    }

    100% {
        left: -92%;
        top: 42%;
        opacity: 0;
        transform: translateX(-25%) rotate(-18deg);
    }
}

@keyframes salon-card-visible-sparkles-fresh-b-8ttrl1tgdw {
    0%, 15%, 43%, 64%, 100% {
        opacity: 0;
        transform: translate3d(0, 5px, 0) scale(0.98);
    }

    27% {
        opacity: var(--salon-sparkle-opacity);
        transform: translate3d(0, -2px, 0) scale(1);
    }

    32% {
        opacity: 0.24;
        transform: translate3d(0, -5px, 0) scale(1.025);
    }

    77% {
        opacity: calc(var(--salon-sparkle-opacity) - 0.04);
        transform: translate3d(0, -2px, 0) scale(1);
    }

    83% {
        opacity: 0.22;
        transform: translate3d(0, -5px, 0) scale(1.025);
    }
}

@media (prefers-reduced-motion: reduce) {
    .salons-page[b-8ttrl1tgdw]  .salon-card-media-with-image::after,
    .salons-page[b-8ttrl1tgdw]  .salon-card-image-overlay::after {
        animation: none;
        opacity: 0;
    }
}

/* BB-PUBLIC-SALON-MAP-DISTANCE-02 full results map preview */
.salons-page[b-8ttrl1tgdw]  .salons-map-panel {
    display: grid;
    gap: 1rem;
    padding: 1.1rem;
    border-radius: 28px;
    background: radial-gradient(circle at 92% 8%, color-mix(in srgb, var(--salons-secondary) 10%, transparent), transparent 30%), linear-gradient(135deg, color-mix(in srgb, var(--salons-surface) 98%, var(--salons-primary)), var(--salons-surface));
    border: 1px solid color-mix(in srgb, var(--salons-primary) 10%, var(--salons-divider));
    box-shadow: 0 18px 48px color-mix(in srgb, var(--salons-text-primary) 7%, transparent);
}

.salons-map-command[b-8ttrl1tgdw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.salons-map-command-copy[b-8ttrl1tgdw] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.85rem;
    align-items: center;
    min-width: 0;
}

.salons-map-command-icon[b-8ttrl1tgdw] {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    color: #ffffff;
    border-radius: 19px;
    background: linear-gradient(135deg, var(--salons-primary), var(--salons-secondary));
    box-shadow: 0 14px 30px color-mix(in srgb, var(--salons-primary) 18%, transparent);
}

.salons-page[b-8ttrl1tgdw]  .salons-map-command-icon .mud-icon-root {
    color: #ffffff !important;
    font-size: 1.45rem;
}

.salons-page[b-8ttrl1tgdw]  .salons-map-title {
    color: var(--salons-text-primary);
    font-weight: 950;
    letter-spacing: -0.03em;
}

.salons-page[b-8ttrl1tgdw]  .salons-map-subtitle {
    max-width: 720px;
    color: var(--salons-text-secondary);
    font-weight: 600;
    line-height: 1.5;
}

.salons-map-command-actions[b-8ttrl1tgdw] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.6rem;
    flex: 0 0 auto;
}

.salons-page[b-8ttrl1tgdw]  .salons-map-command-actions .mud-button-root {
    min-height: 42px;
    border-radius: 12px !important;
    font-family: inherit;
    font-size: 0.74rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.salons-page[b-8ttrl1tgdw]  .salons-map-command-actions .mud-button-filled-primary .mud-button-label,
.salons-page[b-8ttrl1tgdw]  .salons-map-command-actions .mud-button-filled-primary .mud-icon-root {
    color: #ffffff !important;
}

.salons-map-shell[b-8ttrl1tgdw] {
    position: relative;
    overflow: hidden;
    min-height: 520px;
    border-radius: 26px;
    background: radial-gradient(circle at 88% 14%, color-mix(in srgb, var(--salons-secondary) 12%, transparent), transparent 32%), color-mix(in srgb, var(--salons-primary) 5%, var(--salons-surface));
    border: 1px solid color-mix(in srgb, var(--salons-primary) 10%, var(--salons-divider));
    box-shadow: inset 0 1px 0 color-mix(in srgb, white 38%, transparent), 0 16px 34px color-mix(in srgb, var(--salons-primary) 8%, transparent);
}

.salons-map-canvas[b-8ttrl1tgdw] {
    position: relative;
    width: 100%;
    min-height: 520px;
    height: min(68vh, 640px);
    overflow: hidden;
    border-radius: inherit;
    isolation: isolate;
}

    .salons-map-placeholder[b-8ttrl1tgdw],
    .salons-map-canvas .salon-location-map-placeholder[b-8ttrl1tgdw],
    .salons-map-canvas .salon-location-map-unavailable[b-8ttrl1tgdw] {
        position: absolute;
        inset: 0;
        display: grid;
        place-items: center;
        align-content: center;
        gap: 0.65rem;
        padding: 1rem;
        color: var(--salons-text-secondary);
        font-size: 0.9rem;
        font-weight: 850;
        text-align: center;
        background: radial-gradient(circle at 50% 30%, color-mix(in srgb, var(--salons-secondary) 10%, transparent), transparent 34%), color-mix(in srgb, var(--salons-surface) 92%, transparent);
    }

    .salons-page[b-8ttrl1tgdw]  .salons-map-canvas .leaflet-container,
    .salons-map-canvas.leaflet-container[b-8ttrl1tgdw] {
        width: 100%;
        height: 100%;
        font-family: inherit;
        background: color-mix(in srgb, var(--salons-primary) 5%, var(--salons-surface));
    }

.salons-map-note[b-8ttrl1tgdw] {
    display: flex;
    align-items: flex-start;
    gap: 0.48rem;
    padding: 0.72rem 0.85rem;
    color: var(--salons-text-primary);
    font-size: 0.82rem;
    font-weight: 780;
    line-height: 1.42;
    border-radius: 16px;
    background: color-mix(in srgb, var(--salons-primary) 5%, var(--salons-surface));
    border: 1px solid color-mix(in srgb, var(--salons-primary) 9%, var(--salons-divider));
}

.salons-page[b-8ttrl1tgdw]  .salons-map-note .mud-icon-root {
    flex: 0 0 auto;
    color: var(--salons-secondary);
    margin-top: 0.08rem;
}

.salons-page[b-8ttrl1tgdw]  .salons-map-alert {
    border-radius: 16px;
}

@media (max-width: 960px) {
    .salons-map-command[b-8ttrl1tgdw] {
        align-items: flex-start;
        flex-direction: column;
    }

    .salons-map-command-actions[b-8ttrl1tgdw] {
        justify-content: flex-start;
        width: 100%;
    }

    .salons-map-shell[b-8ttrl1tgdw],
    .salons-map-canvas[b-8ttrl1tgdw] {
        min-height: 460px;
        height: 58vh;
    }
}

@media (max-width: 600px) {
    .salons-page[b-8ttrl1tgdw]  .salons-map-panel {
        padding: 0.9rem;
        border-radius: 22px;
    }

    .salons-map-command-copy[b-8ttrl1tgdw] {
        grid-template-columns: 1fr;
    }

    .salons-map-command-actions[b-8ttrl1tgdw],
    .salons-page[b-8ttrl1tgdw]  .salons-map-command-actions .mud-button-root {
        width: 100%;
    }

    .salons-map-shell[b-8ttrl1tgdw],
    .salons-map-canvas[b-8ttrl1tgdw] {
        min-height: 420px;
        height: 62vh;
        border-radius: 20px;
    }
}


/* BB-FOUNDING-50-01 */
.salons-page[b-8ttrl1tgdw]  .salon-card-founding-chip {
    color: #fffaf0 !important;
    font-weight: 950;
    border: 1px solid rgba(255,255,255,0.3) !important;
    background: linear-gradient(135deg, #8b6b2f, #c7a15a 58%, #8b6b2f) !important;
    box-shadow: 0 10px 24px rgba(99, 76, 31, 0.32);
}

/* BB-CUSTOMER-FAVORITES-01 */
.salon-card-favorite-button[b-8ttrl1tgdw] {
    position: absolute;
    top: 1rem;
    left: 5.75rem;
    z-index: 6;
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    padding: 0;
    color: #ffffff;
    border: 1px solid rgba(255,255,255,0.26);
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.56);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.22);
    backdrop-filter: blur(14px);
    cursor: pointer;
    transition: transform 150ms ease, background 150ms ease, box-shadow 150ms ease;
}

    .salon-card-favorite-button:hover[b-8ttrl1tgdw],
    .salon-card-favorite-button:focus-visible[b-8ttrl1tgdw] {
        transform: translateY(-1px) scale(1.04);
        background: color-mix(in srgb, var(--mud-palette-error) 82%, rgba(15, 23, 42, 0.64));
        box-shadow: 0 16px 34px color-mix(in srgb, var(--mud-palette-error) 22%, transparent);
        outline: none;
    }

.salon-card-favorite-button-active[b-8ttrl1tgdw] {
    color: #ffffff;
    background: var(--mud-palette-error);
    border-color: color-mix(in srgb, var(--mud-palette-error) 65%, #ffffff);
}

.salon-card-favorite-button:disabled[b-8ttrl1tgdw] {
    cursor: wait;
    opacity: 0.68;
}

.salons-page[b-8ttrl1tgdw]  .salon-card-favorite-button .mud-icon-root,
.salon-card-favorite-button[b-8ttrl1tgdw]  .mud-icon-root {
    color: inherit !important;
}

@media (max-width: 600px) {
    .salon-card-favorite-button[b-8ttrl1tgdw] {
        top: 0.85rem;
        left: 5.25rem;
        width: 38px;
        height: 38px;
    }
}
/* /Components/Salons/FoundingSalonBadge.razor.rz.scp.css */
.founding-salon-badge[b-vy25t71r6g] {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    width: fit-content;
    max-width: 100%;
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    gap: 0.42rem;
    padding: 0.34rem 0.58rem 0.34rem 0.4rem;
    color: #fff;
    font-size: 0.67rem;
    font-weight: 950;
    line-height: 1;
    letter-spacing: 0.055em;
    text-transform: uppercase;
    white-space: nowrap;
    border: 1px solid color-mix(in srgb, var(--mud-palette-secondary) 62%, transparent);
    border-radius: 999px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--mud-palette-primary) 92%, #07131d), var(--mud-palette-primary) 62%, color-mix(in srgb, var(--mud-palette-primary) 76%, var(--mud-palette-secondary)));
    box-shadow: 0 10px 24px color-mix(in srgb, var(--mud-palette-primary) 22%, transparent), inset 0 1px 0 rgba(255,255,255,0.16);
}

    .founding-salon-badge[b-vy25t71r6g]::after {
        content: "";
        position: absolute;
        inset: -60% auto -60% -34%;
        z-index: -1;
        width: 38%;
        opacity: 0.48;
        background: linear-gradient(90deg, transparent, rgba(255,255,255,0.42), transparent);
        transform: rotate(14deg);
    }

.founding-salon-badge-icon[b-vy25t71r6g] {
    width: 25px;
    height: 25px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    color: var(--mud-palette-primary);
    border-radius: 999px;
    background: linear-gradient(135deg, var(--mud-palette-secondary), color-mix(in srgb, var(--mud-palette-secondary) 72%, #fff));
    box-shadow: 0 6px 14px rgba(0,0,0,0.2);
}

.founding-salon-badge[b-vy25t71r6g]  .founding-salon-badge-icon .mud-icon-root {
    color: inherit;
    font-size: 0.92rem;
}

.founding-salon-badge-label[b-vy25t71r6g] {
    overflow: hidden;
    text-overflow: ellipsis;
}

.founding-salon-badge-number[b-vy25t71r6g] {
    min-width: 30px;
    padding: 0.28rem 0.38rem;
    color: var(--mud-palette-primary);
    text-align: center;
    border-radius: 999px;
    background: #fff;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.7);
}

.founding-salon-badge-compact[b-vy25t71r6g] {
    min-height: 29px;
    gap: 0.32rem;
    padding: 0.27rem 0.45rem 0.27rem 0.3rem;
    font-size: 0.6rem;
}

    .founding-salon-badge-compact .founding-salon-badge-icon[b-vy25t71r6g] {
        width: 21px;
        height: 21px;
    }

    .founding-salon-badge-compact .founding-salon-badge-number[b-vy25t71r6g] {
        min-width: 27px;
        padding: 0.24rem 0.32rem;
    }

@media (prefers-reduced-motion: no-preference) {
    .founding-salon-badge[b-vy25t71r6g]::after {
        animation: founding-salon-badge-shine-b-vy25t71r6g 5.8s ease-in-out infinite;
    }
}

@keyframes founding-salon-badge-shine-b-vy25t71r6g {
    0%, 72% {
        transform: translateX(0) rotate(14deg);
        opacity: 0;
    }

    80% {
        opacity: 0.48;
    }

    96%, 100% {
        transform: translateX(430%) rotate(14deg);
        opacity: 0;
    }
}


/* BB-FOUNDING-50-MOBILE-02 */
@media (max-width: 480px) {
    .founding-salon-badge[b-vy25t71r6g] {
        min-width: 0;
        max-width: 100%;
    }

    .founding-salon-badge-label[b-vy25t71r6g] {
        min-width: 0;
        max-width: 10.5rem;
    }

    .founding-salon-badge-compact[b-vy25t71r6g] {
        gap: 0.28rem;
        padding-right: 0.38rem;
        font-size: 0.57rem;
        letter-spacing: 0.04em;
    }
}