/* Shared presentation cards: a quiet surface and a clipped decorative corner. */
:is(#smpls-editor-content, .sc-page, .wnm-page) {
    --marketing-card-surface: hsl(var(--smplsColorGray50-hsl));
    --marketing-card-ink: hsl(var(--smplsColorGray900-hsl));
    --marketing-card-muted: hsl(var(--smplsColorGray600-hsl));
    --marketing-card-line: hsl(var(--smplsColorGray200-hsl));
    --marketing-card-corner: hsla(var(--smplsColorGray200-hsl), .35);
    --marketing-card-hover: hsl(var(--smplsColorGray400-hsl));
}

.dark :is(#smpls-editor-content, .sc-page, .wnm-page) {
    --marketing-card-surface: hsl(var(--smplsColorGray800-hsl));
    --marketing-card-ink: hsl(var(--smplsColorGray50-hsl));
    --marketing-card-muted: hsl(var(--smplsColorGray300-hsl));
    --marketing-card-line: hsl(var(--smplsColorGray700-hsl));
    --marketing-card-corner: hsla(var(--smplsColorGray700-hsl), .35);
    --marketing-card-hover: hsl(var(--smplsColorGray500-hsl));
}

#smpls-editor-content :is(
    .smpls-card,
    .smpls-column.rounded-3xl[data-element_type="column"],
    [data-element_type="box"].rounded-smplsRadiusBase,
    .sc-salon-choice, .sc-salon-price-card, .sc-feature, .sc-module,
    .sc-solution-card, .sc-contact, .sc-fulfillment article,
    .sc-fulfillment > .smpls-box-content > .smpls-box,
    .wnm-feature, .wnm-final-card, .wnm-specialty-price,
    .industry-feature, .industry-integration
) {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    border: 1px solid var(--marketing-card-line);
    border-radius: 28px;
    background-color: var(--marketing-card-surface) !important;
    background-image: none !important;
    color: var(--marketing-card-ink);
    transition: border-color .18s ease;
}

#smpls-editor-content :is(
    .smpls-card,
    .smpls-column.rounded-3xl[data-element_type="column"],
    [data-element_type="box"].rounded-smplsRadiusBase,
    .sc-salon-choice, .sc-salon-price-card, .sc-feature, .sc-module,
    .sc-solution-card, .sc-contact, .sc-fulfillment article,
    .sc-fulfillment > .smpls-box-content > .smpls-box,
    .wnm-feature, .wnm-final-card, .wnm-specialty-price,
    .industry-feature, .industry-integration
)::after {
    content: '';
    display: block;
    position: absolute;
    z-index: -1;
    width: 210px;
    height: 320px;
    top: -125px;
    right: -170px;
    left: auto;
    bottom: auto;
    transform: none;
    border: 0;
    border-radius: 50%;
    background: var(--marketing-card-corner);
    opacity: 1;
    pointer-events: none;
}

#smpls-editor-content :is(.sc-salon-choice-primary, .sc-contact) {
    border-color: hsl(var(--smplsColorPrimary-hsl)) !important;
}

#smpls-editor-content :is(a.sc-module, a.sc-solution-card):hover {
    border-color: hsl(var(--smplsColorPrimary-hsl)) !important;
}

/* Former solid-blue cards inherit readable text on the shared neutral surface. */
#smpls-editor-content :is(.sc-contact, .sc-module-dark) :is(
    h2, h3, [data-widget_type="heading"], .sc-contact-link,
    .sc-contact-symbol, .sc-module-arrow
) {
    color: var(--marketing-card-ink) !important;
}

#smpls-editor-content :is(.sc-contact, .sc-module-dark) p {
    color: var(--marketing-card-muted) !important;
}

#smpls-editor-content .sc-contact .smpls-button:not(.-underlined) {
    background: hsl(var(--smplsColorPrimary-hsl)) !important;
    border-color: hsl(var(--smplsColorPrimary-hsl)) !important;
    color: #fff !important;
}

#smpls-editor-content .sc-contact .smpls-button :is(.smpls-button-content, .smpls-button-icon) {
    color: inherit !important;
}

/* Native rich-text lists must not add a vertical rail to checklists. */
#smpls-editor-content :is(.sc-salon-choice, .sc-salon-price-card, .sc-checklist) .smpls-widget-content > ul {
    border: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

#smpls-editor-content :is(.sc-salon-choice, .sc-salon-price-card) li {
    position: relative;
    display: block !important;
    border: 0 !important;
    padding: 0 0 0 28px !important;
    margin: 0 !important;
    line-height: 1.65;
}

#smpls-editor-content :is(.sc-salon-choice, .sc-salon-price-card) li::before {
    content: '✓' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 18px !important;
    height: auto !important;
    margin: 0 !important;
    background: none !important;
    color: var(--sc-accent-ink);
    font-weight: 600;
    line-height: inherit;
}

#smpls-editor-content :is(.sc-salon-choice, .sc-salon-price-card) li::after {
    content: none !important;
}

/* Legacy CMS cards may intentionally stay dark in the light page scheme. */
#smpls-editor-content .smpls-card:is(.-dark, .dark) {
    --marketing-card-surface: hsl(var(--smplsColorGray800-hsl));
    --marketing-card-ink: hsl(var(--smplsColorGray50-hsl));
    --marketing-card-muted: hsl(var(--smplsColorGray300-hsl));
    --marketing-card-line: hsl(var(--smplsColorGray700-hsl));
    --marketing-card-corner: hsla(var(--smplsColorGray700-hsl), .35);
}

#smpls-editor-content .smpls-card > .smpls-card-content {
    background: transparent !important;
}

#smpls-editor-content :is(
    .smpls-card,
    .smpls-column.rounded-3xl[data-element_type="column"],
    [data-element_type="box"].rounded-smplsRadiusBase,
    .sc-salon-choice:not(.sc-salon-choice-primary),
    .sc-salon-price-card, .sc-feature, .sc-module,
    .sc-solution-card, .sc-fulfillment article,
    .sc-fulfillment > .smpls-box-content > .smpls-box,
    .wnm-feature, .wnm-final-card, .wnm-specialty-price,
    .industry-feature, .industry-integration
):focus-within {
    border-color: var(--marketing-card-hover) !important;
}

@media (hover: hover) {
    #smpls-editor-content :is(
        .smpls-card,
        .smpls-column.rounded-3xl[data-element_type="column"],
        [data-element_type="box"].rounded-smplsRadiusBase,
        .sc-salon-choice:not(.sc-salon-choice-primary),
        .sc-salon-price-card, .sc-feature, .sc-module,
        .sc-solution-card, .sc-fulfillment article,
        .sc-fulfillment > .smpls-box-content > .smpls-box,
        .wnm-feature, .wnm-final-card, .wnm-specialty-price,
        .industry-feature, .industry-integration
    ):hover {
        border-color: var(--marketing-card-hover) !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    #smpls-editor-content :is(.smpls-card, .smpls-column.rounded-3xl) {
        transition: none;
    }
}

#smpls-editor-content .smpls-card.circles::before,
#smpls-editor-content .smpls-card > .circles,
#smpls-editor-content .smpls-column.rounded-3xl > .circles {
    display: none;
}