/* Category-only tokens: leave the shared section/control spacing definitions intact.
 * A direct native breadcrumb identifies the actual hero, including boxed and
 * nested templates. Never select the first wrapper of an inherited archive.
 * Explicit document attributes keep these overrides above the existing
 * no-intro !important cascade without editing legacy styles or saved templates. */

html body.cie-category-hero-spacing .elementor[data-elementor-id][data-elementor-type][class] > .e-con.e-parent:has(> .elementor-widget-woocommerce-breadcrumb, > .e-con-inner > .elementor-widget-woocommerce-breadcrumb) {
    --cie-category-hero-padding: clamp(20px, 2.083333vw, 32px);
    --cie-category-hero-breadcrumb-gap: clamp(16px, 1.25vw, 24px);
    --cie-category-hero-copy-gap: 12px;
}

html body.cie-category-hero-spacing .elementor[data-elementor-id][data-elementor-type][class] > .e-con.e-parent:has(> .elementor-widget-woocommerce-breadcrumb, > .e-con-inner > .elementor-widget-woocommerce-breadcrumb),
html body.cie-category-hero-spacing .elementor[data-elementor-id][data-elementor-type][class] > .e-con.e-parent:has(> .elementor-widget-woocommerce-breadcrumb, > .e-con-inner > .elementor-widget-woocommerce-breadcrumb) > .e-con-inner {
    --min-height: 0px !important;
    min-height: 0 !important;
    height: auto !important;
    --padding-top: var(--cie-category-hero-padding) !important;
    --padding-bottom: var(--cie-category-hero-padding) !important;
    padding-block: var(--cie-category-hero-padding) !important;
    --justify-content: flex-start !important;
    justify-content: flex-start !important;
    --gap: 0px !important;
    --row-gap: 0px !important;
    row-gap: 0 !important;
}

/* Boxed heroes own their padding on the inner container only. */

html body.cie-category-hero-spacing .elementor[data-elementor-id][data-elementor-type][class] > .e-con.e-parent:has(> .elementor-widget-woocommerce-breadcrumb, > .e-con-inner > .elementor-widget-woocommerce-breadcrumb):has(> .e-con-inner) {
    --padding-top: 0px !important;
    --padding-bottom: 0px !important;
    padding-block: 0 !important;
}

html body.cie-category-hero-spacing .elementor[data-elementor-id][data-elementor-type][class] > .e-con.e-parent:has(> .elementor-widget-woocommerce-breadcrumb, > .e-con-inner > .elementor-widget-woocommerce-breadcrumb) > .elementor-widget-woocommerce-breadcrumb,
html body.cie-category-hero-spacing .elementor[data-elementor-id][data-elementor-type][class] > .e-con.e-parent:has(> .elementor-widget-woocommerce-breadcrumb, > .e-con-inner > .elementor-widget-woocommerce-breadcrumb) > .e-con-inner > .elementor-widget-woocommerce-breadcrumb {
    position: static !important;
    inset: auto !important;
    margin-block: 0 var(--cie-category-hero-breadcrumb-gap) !important;
}

html body.cie-category-hero-spacing .elementor[data-elementor-id][data-elementor-type][class] > .e-con.e-parent:has(> .elementor-widget-woocommerce-breadcrumb, > .e-con-inner > .elementor-widget-woocommerce-breadcrumb) .woocommerce-breadcrumb {
    margin-block: 0 !important;
}

html body.cie-category-hero-spacing .elementor[data-elementor-id][data-elementor-type][class] > .e-con.e-parent:has(> .elementor-widget-woocommerce-breadcrumb, > .e-con-inner > .elementor-widget-woocommerce-breadcrumb) .cie-category-parent-intro__content,
html body.cie-category-hero-spacing .elementor[data-elementor-id][data-elementor-type][class] > .e-con.e-parent:has(> .elementor-widget-woocommerce-breadcrumb, > .e-con-inner > .elementor-widget-woocommerce-breadcrumb) .cie-category-parent-intro__content > .e-con-inner {
    margin-block: 0 !important;
    --padding-top: 0px !important;
    --padding-bottom: 0px !important;
    padding-block: 0 !important;
    --min-height: 0px !important;
    min-height: 0 !important;
    height: auto !important;
    --justify-content: flex-start !important;
    justify-content: flex-start !important;
    --gap: 0px !important;
    --row-gap: 0px !important;
    row-gap: 0 !important;
}

html body.cie-category-hero-spacing .elementor[data-elementor-id][data-elementor-type][class] > .e-con.e-parent:has(> .elementor-widget-woocommerce-breadcrumb, > .e-con-inner > .elementor-widget-woocommerce-breadcrumb) .elementor-element-9747eec,
html body.cie-category-hero-spacing .elementor[data-elementor-id][data-elementor-type][class] > .e-con.e-parent:has(> .elementor-widget-woocommerce-breadcrumb, > .e-con-inner > .elementor-widget-woocommerce-breadcrumb) .elementor-element-1f461a9 {
    margin-block: 0 !important;
}

html body.cie-category-hero-spacing .elementor[data-elementor-id][data-elementor-type][class] > .e-con.e-parent:has(> .elementor-widget-woocommerce-breadcrumb, > .e-con-inner > .elementor-widget-woocommerce-breadcrumb) .elementor-element-1f461a9 {
    margin-top: var(--cie-category-hero-copy-gap) !important;
}

/* Exactly one gap owner: the pills container in parent heroes, or the
 * direct native widget in shared/boxed heroes. The parent's display:contents
 * widget must not add a second gap. Preserve the pills' own internal spacing. */

html body.cie-category-hero-spacing .elementor[data-elementor-id][data-elementor-type][class] > .e-con.e-parent:has(> .elementor-widget-woocommerce-breadcrumb, > .e-con-inner > .elementor-widget-woocommerce-breadcrumb) .cie-category-parent-intro__pills,
html body.cie-category-hero-spacing .elementor[data-elementor-id][data-elementor-type][class] > .e-con.e-parent:has(> .elementor-widget-woocommerce-breadcrumb, > .e-con-inner > .elementor-widget-woocommerce-breadcrumb) > .elementor-widget-cie-woo-child-categories,
html body.cie-category-hero-spacing .elementor[data-elementor-id][data-elementor-type][class] > .e-con.e-parent:has(> .elementor-widget-woocommerce-breadcrumb, > .e-con-inner > .elementor-widget-woocommerce-breadcrumb) > .e-con-inner > .elementor-widget-cie-woo-child-categories {
    margin-block: var(--cie-category-hero-breadcrumb-gap) 0 !important;
}

html body.cie-category-hero-spacing .elementor[data-elementor-id][data-elementor-type][class] > .e-con.e-parent:has(> .elementor-widget-woocommerce-breadcrumb, > .e-con-inner > .elementor-widget-woocommerce-breadcrumb) .cie-category-parent-intro__pills > .elementor-widget-cie-woo-child-categories,
html body.cie-category-hero-spacing .elementor[data-elementor-id][data-elementor-type][class] > .e-con.e-parent:has(> .elementor-widget-woocommerce-breadcrumb, > .e-con-inner > .elementor-widget-woocommerce-breadcrumb) .cie-category-parent-intro__pills > .e-con-inner > .elementor-widget-cie-woo-child-categories {
    margin-block: 0 !important;
}
