/* AI Top Summary */
body .ats-top-summary {
    --ats-primary: var(--wp--preset--color--primary, var(--e-global-color-primary, var(--ast-global-color-0, var(--global-palette1, #3b1068))));
    --ats-secondary: var(--wp--preset--color--secondary, var(--e-global-color-secondary, var(--ast-global-color-1, var(--global-palette2, #7040c4))));
    --ats-accent: var(--wp--preset--color--accent, var(--e-global-color-accent, var(--ast-global-color-2, var(--global-palette3, #8b5cf6))));
    --ats-surface: color-mix(in srgb, var(--ats-primary) 6%, #ffffff);
    --ats-border: color-mix(in srgb, var(--ats-primary) 24%, transparent);

    position: relative !important;
    overflow: hidden !important;
    max-width: 760px !important;
    margin: 0 auto 26px !important;
    padding: 18px 22px !important;
    border: 1px solid var(--ats-border) !important;
    border-radius: 18px !important;
    background:
        radial-gradient(circle at 18% 0%, color-mix(in srgb, var(--ats-accent) 16%, transparent), transparent 34%),
        radial-gradient(circle at 86% 15%, color-mix(in srgb, var(--ats-secondary) 12%, transparent), transparent 32%),
        linear-gradient(135deg, color-mix(in srgb, var(--ats-primary) 7%, #ffffff), rgba(255, 255, 255, 0.96)) !important;
    box-shadow: 0 12px 34px rgba(0, 0, 0, 0.06) !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    text-align: center !important;
    box-sizing: border-box !important;
}

body .ats-top-summary::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    padding: 1px !important;
    border-radius: inherit !important;
    background: linear-gradient(120deg, color-mix(in srgb, var(--ats-primary) 45%, transparent), color-mix(in srgb, var(--ats-accent) 24%, transparent), transparent 62%) !important;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0) !important;
    -webkit-mask-composite: xor !important;
    mask-composite: exclude !important;
    pointer-events: none !important;
}

body .ats-top-summary,
body .ats-top-summary * {
    box-sizing: border-box !important;
}

body .ats-top-summary__heading {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    margin: 0 auto 8px !important;
    color: var(--ats-primary) !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    letter-spacing: 0.02em !important;
    text-align: center !important;
}

body .ats-top-summary__icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    width: 24px !important;
    height: 24px !important;
    border-radius: 999px !important;
    background:
        radial-gradient(circle at 35% 25%, rgba(255, 255, 255, 0.95), transparent 38%),
        linear-gradient(135deg, var(--ats-primary), var(--ats-accent)) !important;
    color: #ffffff !important;
    box-shadow: 0 6px 16px color-mix(in srgb, var(--ats-primary) 24%, transparent) !important;
}

body .ats-top-summary__icon svg {
    width: 14px !important;
    height: 14px !important;
    fill: currentColor !important;
    display: block !important;
}

body .ats-top-summary__text {
    max-width: 680px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    color: color-mix(in srgb, var(--ats-primary) 72%, #1f2937) !important;
    font-size: 14px !important;
    line-height: 1.56 !important;
    text-align: center !important;
}

@supports not (color: color-mix(in srgb, red, white)) {
    body .ats-top-summary {
        border-color: rgba(59, 16, 104, 0.16) !important;
        background: linear-gradient(135deg, rgba(59, 16, 104, 0.06), rgba(255, 255, 255, 0.96)) !important;
    }

    body .ats-top-summary__heading {
        color: #3b1068 !important;
    }

    body .ats-top-summary__icon {
        background: linear-gradient(135deg, #3b1068, #8b5cf6) !important;
    }

    body .ats-top-summary__text {
        color: #253047 !important;
    }
}

@media (max-width: 760px) {
    body .ats-top-summary {
        max-width: 100% !important;
        padding: 16px 15px !important;
        margin-bottom: 22px !important;
    }

    body .ats-top-summary__text {
        font-size: 13.5px !important;
        line-height: 1.52 !important;
    }
}
