/* Surface V2: public palette. Resolve at each Surface/context owner and V4
 * container, not only at :root: inherited custom properties are already computed.
 * These are derived output tokens; existing --ts-color-* inputs remain inputs.
 * No paint or typography changes occur merely by exporting this palette. */
:root,
:where(.sf-page, .sf-subtle, .sf-card, .sf-elev, .sf-strong, .sf-inverse, .sf-primary-soft, .sf-secondary-soft, .tsds-surface-context),
.elementor :where(.e-con, .e-con-inner, .elementor-container) {
  --tsds-surface-page: var(--ts-color-background, var(--c-surface-page, var(--c-bg, #fff)));
  --tsds-surface-text: var(--ts-color-text, var(--c-text, var(--e-global-color-text, #121417)));
  --tsds-surface-primary: var(--ts-color-primary, var(--c-accent, var(--e-global-color-primary, #000)));
  --tsds-surface-secondary: var(--ts-color-secondary, var(--c-accent-2, var(--e-global-color-secondary, #000)));
  --tsds-surface-bg-page: var(--tsds-surface-page);
  --tsds-surface-bg-subtle: color-mix(in srgb, var(--tsds-surface-page) 94%, var(--tsds-surface-neutral-contrast));
  --tsds-surface-bg-card: color-mix(in srgb, var(--tsds-surface-page) 86%, var(--tsds-surface-neutral-contrast));
  --tsds-surface-bg-elev: color-mix(in srgb, var(--tsds-surface-page) 75%, var(--tsds-surface-neutral-contrast));
  --tsds-surface-bg-strong: color-mix(in srgb, var(--tsds-surface-page) 60%, var(--tsds-surface-neutral-contrast));
  --tsds-surface-bg-inverse: var(--ts-color-inverse-bg, var(--ts-color-surface-inverse, var(--c-surface-inverse, color-mix(in srgb, var(--tsds-surface-text) 92%, transparent))));
  --tsds-surface-bg-primary-soft: var(--ts-color-surface-primary-soft, color-mix(in srgb, var(--tsds-surface-primary) var(--surface-brand-soft-mix), var(--tsds-surface-brand-soft-base)));
  --tsds-surface-bg-secondary-soft: var(--ts-color-surface-secondary-soft, color-mix(in srgb, var(--tsds-surface-secondary) var(--surface-brand-soft-mix), var(--tsds-surface-brand-soft-base)));
  --tsds-surface-fg-page: var(--ts-color-on-surface-page, var(--tsds-surface-text));
  --tsds-surface-fg-subtle: var(--ts-color-on-surface-subtle, var(--tsds-surface-text));
  --tsds-surface-fg-card: var(--ts-color-on-surface-card, var(--tsds-surface-text));
  --tsds-surface-fg-elev: var(--ts-color-on-surface-elev, var(--tsds-surface-text));
  --tsds-surface-fg-strong: var(--ts-color-on-surface-strong, var(--tsds-surface-text));
  --tsds-surface-fg-inverse: var(--ts-color-on-surface-inverse, var(--ts-color-inverse-text, var(--ts-color-on-inverse, var(--c-bg, var(--tsds-surface-page)))));
  --tsds-surface-fg-primary-soft: var(--ts-color-on-surface-primary-soft, var(--tsds-surface-text));
  --tsds-surface-fg-secondary-soft: var(--ts-color-on-surface-secondary-soft, var(--tsds-surface-text));
}

/* Strong's darker background can fail with the normal Text role. Relative
 * linear-sRGB channels let older engines choose black/white from the actual
 * mixed/local background. L = .2126r + .7152g + .0722b; the equal-contrast
 * crossover is sqrt(.05 * 1.05) - .05 = .1791287847 (minimum ~4.58:1).
 * sign(), rather than an amplified clamp, avoids unsafe intermediate grays.
 * This only changes the V2 Strong FG; authored On-Surface inputs still win.
 * Native contrast-color(), when available, remains authoritative below. */
@supports (color: color(from white srgb-linear clamp(0, sign(1 - r), 1) 0 0)) {
  :root,
  :where(.sf-page, .sf-subtle, .sf-card, .sf-elev, .sf-strong, .sf-inverse, .sf-primary-soft, .sf-secondary-soft, .tsds-surface-context),
  .elementor :where(.e-con, .e-con-inner, .elementor-container) {
    --tsds-surface-fg-strong: var(--ts-color-on-surface-strong, color(from var(--tsds-surface-bg-strong) srgb-linear
      clamp(0, sign(0.1791287847 - (0.2126 * r + 0.7152 * g + 0.0722 * b)), 1)
      clamp(0, sign(0.1791287847 - (0.2126 * r + 0.7152 * g + 0.0722 * b)), 1)
      clamp(0, sign(0.1791287847 - (0.2126 * r + 0.7152 * g + 0.0722 * b)), 1) / 1));
  }
}

/* Native contrast selection tracks runtime CSS colors, local overrides and mix
 * intensity without frontend JavaScript. Other legacy foreground fallbacks
 * above are unchanged. Existing sf-* paint retains its previous contract. */
@supports (color: contrast-color(white)) {
  :root,
  :where(.sf-page, .sf-subtle, .sf-card, .sf-elev, .sf-strong, .sf-inverse, .sf-primary-soft, .sf-secondary-soft, .tsds-surface-context),
  .elementor :where(.e-con, .e-con-inner, .elementor-container) {
    --tsds-surface-fg-page: var(--ts-color-on-surface-page, contrast-color(var(--tsds-surface-bg-page)));
    --tsds-surface-fg-subtle: var(--ts-color-on-surface-subtle, contrast-color(var(--tsds-surface-bg-subtle)));
    --tsds-surface-fg-card: var(--ts-color-on-surface-card, contrast-color(var(--tsds-surface-bg-card)));
    --tsds-surface-fg-elev: var(--ts-color-on-surface-elev, contrast-color(var(--tsds-surface-bg-elev)));
    --tsds-surface-fg-strong: var(--ts-color-on-surface-strong, contrast-color(var(--tsds-surface-bg-strong)));
    --tsds-surface-fg-inverse: var(--ts-color-on-surface-inverse, contrast-color(var(--tsds-surface-bg-inverse)));
    --tsds-surface-fg-primary-soft: var(--ts-color-on-surface-primary-soft, contrast-color(var(--tsds-surface-bg-primary-soft)));
    --tsds-surface-fg-secondary-soft: var(--ts-color-on-surface-secondary-soft, contrast-color(var(--tsds-surface-bg-secondary-soft)));
  }
}

/** TS Design System: recommended Surface, Outline and Radius utilities. */

/* Public utilities paint the classed HTML element directly. Elementor hosts
 * whose visible renderer lives deeper in the widget remain adapter-owned. */
:where(.sf-page, .sf-subtle, .sf-card, .sf-elev, .sf-strong, .sf-inverse, .sf-primary-soft, .sf-secondary-soft) {
  --tsds-surface-page: var(--ts-color-background, var(--c-surface-page, var(--c-bg, #fff)));
  --tsds-surface-text: var(--ts-color-text, var(--c-text, var(--e-global-color-text, #121417)));
  --tsds-surface-primary: var(--ts-color-primary, var(--c-accent, var(--e-global-color-primary, #000)));
  --tsds-surface-secondary: var(--ts-color-secondary, var(--c-accent-2, var(--e-global-color-secondary, #000)));
}

.sf-page { --tsds-surface-background: var(--tsds-surface-bg-page); --tsds-surface-color: var(--tsds-surface-text); }
.sf-subtle { --tsds-surface-background: var(--tsds-surface-bg-subtle); --tsds-surface-color: var(--tsds-surface-text); }
.sf-card { --tsds-surface-background: var(--tsds-surface-bg-card); --tsds-surface-color: var(--tsds-surface-text); }
.sf-elev { --tsds-surface-background: var(--tsds-surface-bg-elev); --tsds-surface-color: var(--tsds-surface-text); }
.sf-strong { --tsds-surface-background: var(--tsds-surface-bg-strong); --tsds-surface-color: var(--tsds-surface-text); }
.sf-inverse { --tsds-surface-background: var(--tsds-surface-bg-inverse); --tsds-surface-color: var(--ts-color-inverse-text, var(--ts-color-on-inverse, var(--c-bg, var(--tsds-surface-page)))); }
.sf-primary-soft { --tsds-surface-background: var(--tsds-surface-bg-primary-soft); --tsds-surface-color: var(--tsds-surface-text); }
.sf-secondary-soft { --tsds-surface-background: var(--tsds-surface-bg-secondary-soft); --tsds-surface-color: var(--tsds-surface-text); }

/* The class plus one neutral attribute weight beats ordinary one-class host
 * defaults without blocking later two-class or inline overrides. Widget
 * wrappers with deeper visible renderers stay adapter-owned. */
:is(.sf-page, .sf-subtle, .sf-card, .sf-elev, .sf-strong, .sf-inverse, .sf-primary-soft, .sf-secondary-soft)[class]:not(:where(.elementor-widget-accordion, .elementor-widget-n-accordion, .elementor-widget-tabs, .elementor-widget-n-tabs)) {
  background: var(--tsds-surface-background);
  color: var(--tsds-surface-color);
}

:where(.ol, .ol-primary, .ol-secondary) {
  --tsds-outline-color: var(--ts-color-border, var(--c-border, rgba(18, 20, 23, 0.1)));
}

.ol-primary { --tsds-outline-color: var(--ts-color-primary, var(--c-accent, var(--e-global-color-primary, #000))); }
.ol-secondary { --tsds-outline-color: var(--ts-color-secondary, var(--c-accent-2, var(--e-global-color-secondary, #000))); }

:is(.ol, .ol-primary, .ol-secondary)[class]:not(:where(.elementor-widget-image, .elementor-widget-accordion, .elementor-widget-n-accordion, hr.e-divider-base)) {
  border: var(--outline-width) solid var(--tsds-outline-color);
}

/* Atomic Dividers paint their line with background-color, not a border.
 * Preserve native height/width and beat the later two-class V4 base rule. */
.elementor hr.e-divider-base:where(.ol, .ol-primary, .ol-secondary) {
  background-color: var(--tsds-outline-color);
}

/* Photos use the image setting unless an explicit ro-* follows. */
img {
  border-radius: var(--tsds-image-radius, var(--ts-radius-standard, var(--radius-l, 24px)));
}

/* Elementor paints the visible image below the Widget wrapper. Keep this
 * default non-important so deliberate Elementor image styling can still win. */
.elementor .elementor-widget-image img,
.elementor :where(img).e-image-base:not(:where(.card-media, .ro-0, .ro-xxs, .ro-xs, .ro-s, .ro-m, .ro-l, .ro-xl, .ro-xxl)) {
  border-radius: var(--tsds-image-radius, var(--ts-radius-standard, var(--radius-l, 24px)));
}

.ro-xxs { --tsds-radius: var(--radius-xxs); }
.ro-xs { --tsds-radius: var(--radius-xs); }
.ro-s { --tsds-radius: var(--radius-s); }
.ro-m { --tsds-radius: var(--radius-m); }
.ro-l { --tsds-radius: var(--radius-l); }
.ro-xl { --tsds-radius: var(--radius-xl); }
.ro-xxl { --tsds-radius: var(--radius-xxl); }
.ro-0 { --tsds-radius: var(--radius-0); }

:is(.ro-0, .ro-xxs, .ro-xs, .ro-s, .ro-m, .ro-l, .ro-xl, .ro-xxl)[class]:not(:where(.elementor-widget-image, .elementor-widget-button, .elementor-widget-accordion, .elementor-widget-n-accordion)) {
  border-radius: var(--tsds-radius);
}

/* Match native control specificity so the later explicit ro-* utility keeps
 * its documented priority over Button radius and btn-pill. */
:is(a, button):is(.ro-0, .ro-xxs, .ro-xs, .ro-s, .ro-m, .ro-l, .ro-xl, .ro-xxl) {
  border-radius: var(--tsds-radius);
}

/* Atomic Forms put public classes on the visible control, not the editor's
 * display:contents host. Beat later Atomic defaults and the Pill adapter only
 * when an explicit ro-* is present; unclassed fields remain Elementor-owned. */
.elementor :is(input.e-form-input-base, textarea.e-form-textarea-base, select.e-form-select-base, button.e-form-submit-button-base):is(.ro-0, .ro-xxs, .ro-xs, .ro-s, .ro-m, .ro-l, .ro-xl, .ro-xxl) {
  border-radius: var(--tsds-radius);
}

/* Known surfaces receive local values so nested surfaces resolve independently. */
.elementor :is(
  .e-con,
  .e-con-inner,
  .elementor-container,
  .elementor-widget-accordion,
  .elementor-widget-n-accordion,
  .elementor-widget-tabs,
  .elementor-widget-n-tabs
):is(.sf-page, .sf-subtle, .sf-card, .sf-elev, .sf-strong, .sf-inverse, .sf-primary-soft, .sf-secondary-soft) {
  --tsds-surface-page: var(--ts-color-background, var(--c-surface-page, var(--c-bg, #fff)));
  --tsds-surface-text: var(--ts-color-text, var(--c-text, var(--e-global-color-text, #121417)));
  --tsds-surface-primary: var(--ts-color-primary, var(--c-accent, var(--e-global-color-primary, #000)));
  --tsds-surface-secondary: var(--ts-color-secondary, var(--c-accent-2, var(--e-global-color-secondary, #000)));
}

.elementor :is(.e-con, .e-con-inner, .elementor-container, .elementor-widget-accordion, .elementor-widget-n-accordion, .elementor-widget-tabs, .elementor-widget-n-tabs).sf-page {
  --tsds-surface-background: var(--tsds-surface-bg-page);
  --tsds-surface-color: var(--tsds-surface-text);
}

.elementor :is(.e-con, .e-con-inner, .elementor-container, .elementor-widget-accordion, .elementor-widget-n-accordion, .elementor-widget-tabs, .elementor-widget-n-tabs).sf-subtle {
  --tsds-surface-background: var(--tsds-surface-bg-subtle);
  --tsds-surface-color: var(--tsds-surface-text);
}

.elementor :is(.e-con, .e-con-inner, .elementor-container, .elementor-widget-accordion, .elementor-widget-n-accordion, .elementor-widget-tabs, .elementor-widget-n-tabs).sf-card {
  --tsds-surface-background: var(--tsds-surface-bg-card);
  --tsds-surface-color: var(--tsds-surface-text);
}

.elementor :is(.e-con, .e-con-inner, .elementor-container, .elementor-widget-accordion, .elementor-widget-n-accordion, .elementor-widget-tabs, .elementor-widget-n-tabs).sf-elev {
  --tsds-surface-background: var(--tsds-surface-bg-elev);
  --tsds-surface-color: var(--tsds-surface-text);
}

.elementor :is(.e-con, .e-con-inner, .elementor-container, .elementor-widget-accordion, .elementor-widget-n-accordion, .elementor-widget-tabs, .elementor-widget-n-tabs).sf-strong {
  --tsds-surface-background: var(--tsds-surface-bg-strong);
  --tsds-surface-color: var(--tsds-surface-text);
}

.elementor :is(.e-con, .e-con-inner, .elementor-container, .elementor-widget-accordion, .elementor-widget-n-accordion, .elementor-widget-tabs, .elementor-widget-n-tabs).sf-inverse {
  --tsds-surface-background: var(--tsds-surface-bg-inverse);
  --tsds-surface-color: var(--ts-color-inverse-text, var(--ts-color-on-inverse, var(--c-bg, var(--tsds-surface-page))));
}

.elementor :is(.e-con, .e-con-inner, .elementor-container, .elementor-widget-accordion, .elementor-widget-n-accordion, .elementor-widget-tabs, .elementor-widget-n-tabs).sf-primary-soft {
  --tsds-surface-background: var(--tsds-surface-bg-primary-soft);
  --tsds-surface-color: var(--tsds-surface-text);
}

.elementor :is(.e-con, .e-con-inner, .elementor-container, .elementor-widget-accordion, .elementor-widget-n-accordion, .elementor-widget-tabs, .elementor-widget-n-tabs).sf-secondary-soft {
  --tsds-surface-background: var(--tsds-surface-bg-secondary-soft);
  --tsds-surface-color: var(--tsds-surface-text);
}

/* General surfaces only paint the real container carrying the class. */
.elementor :is(.e-con, .e-con-inner, .elementor-container):is(.sf-page, .sf-subtle, .sf-card, .sf-elev, .sf-strong, .sf-inverse, .sf-primary-soft, .sf-secondary-soft) {
  background: var(--tsds-surface-background) !important;
  color: var(--tsds-surface-color) !important;
}

/* Atomic paragraphs receive V4 default colors directly. Restore the Surface
 * body foreground from its owner, not an intermediate wrapper's color.
 * Cards reset the context, including size-only Cards. An explicit Surface on
 * the same owner follows its Surface contract. No Classic targets change. */
.elementor :where(.card-xxs, .card-xs, .card-s, .card-m, .card-l, .card-xl, .card-xxl, .card-soft, .card-primary, .card-secondary) {
  --tsds-surface-context-color: var(--tsds-card-color);
}

.elementor :where(.sf-page, .sf-subtle, .sf-card, .sf-elev, .sf-strong, .sf-inverse, .sf-primary-soft, .sf-secondary-soft) {
  --tsds-surface-context-color: var(--tsds-surface-color);
}

@scope (.elementor :is(.sf-page, .sf-subtle, .sf-card, .sf-elev, .sf-strong, .sf-inverse, .sf-primary-soft, .sf-secondary-soft, .card-xxs, .card-xs, .card-s, .card-m, .card-l, .card-xl, .card-xxl, .card-soft, .card-primary, .card-secondary)) to (:scope :is(.tsds-surface-context, .sf-page, .sf-subtle, .sf-card, .sf-elev, .sf-strong, .sf-inverse, .sf-primary-soft, .sf-secondary-soft, .card-xxs, .card-xs, .card-s, .card-m, .card-l, .card-xl, .card-xxl, .card-soft, .card-primary, .card-secondary)) {
  .e-paragraph-base[class]:not(:where(.e-button-base, .e-button-base *, .elementor-button, .elementor-button *, .elementor-widget-button *)) {
    color: var(--tsds-surface-context-color);
  }
}

/* Only inverse Surfaces own inherited Heading contrast. Stop at the next
 * Surface: a nested neutral Surface resumes Elementor's own Heading colors,
 * and a nested inverse Surface starts its own scope. No V4 variable names or
 * brand values are duplicated. Two-class weight beats V4 defaults by scope
 * proximity, while more specific explicit Heading classes remain possible. */
@scope (.elementor .sf-inverse) to (:scope :is(.tsds-surface-context, .sf-page, .sf-subtle, .sf-card, .sf-elev, .sf-strong, .sf-inverse, .sf-primary-soft, .sf-secondary-soft, .card-xxs, .card-xs, .card-s, .card-m, .card-l, .card-xl, .card-xxl, .card-soft, .card-primary, .card-secondary)) {
  .e-heading-base[class]:not(:where(.e-button-base, .e-button-base *, .elementor-button, .elementor-button *, .elementor-widget-button *)) {
    color: var(--tsds-surface-context-color);
  }
}

/* A Surface explicitly placed on Atomic text owns that element's foreground
 * too. Keep the same specificity as the inherited bridge, without important. */
.elementor :is(.sf-page, .sf-subtle, .sf-card, .sf-elev, .sf-strong, .sf-inverse, .sf-primary-soft, .sf-secondary-soft):is(.e-heading-base, .e-paragraph-base):not(:where(.e-button-base, .e-button-base *, .elementor-button, .elementor-button *, .elementor-widget-button *)) {
  color: var(--tsds-surface-color);
}

/* Surface V2 context is opt-in, independent of a particular sf-* level.
 * A global Elementor class selects --tsds-surface-background and
 * --tsds-surface-color. Keep this marker when changing that selection.
 * It never changes font family, size, weight, spacing or Elementor defaults. */
:where(.tsds-surface-context) {
  --tsds-surface-background: var(--tsds-surface-bg-page);
  --tsds-surface-color: var(--tsds-surface-fg-page);
  --tsds-surface-context-color: var(--tsds-surface-color);
  --tsds-accent-text: var(--tsds-surface-context-color);
  --tsds-link-color: var(--tsds-surface-context-color);
  --tsds-link-hover-color: var(--tsds-link-color);
  --tsds-link-focus-color: var(--tsds-link-color);
  --tsds-link-active-color: var(--tsds-link-color);
  background-color: var(--tsds-surface-background);
  color: var(--tsds-surface-color);
}

/* Scope proximity beats equal-weight native Atomic defaults, while explicit
 * higher-weight classes and inline colors remain authored. Components, opted
 * out content and nested Surface/Card owners form hard scope boundaries. */
@scope (.tsds-surface-context) to (:scope :is(.tsds-surface-context, .sf-page, .sf-subtle, .sf-card, .sf-elev, .sf-strong, .sf-inverse, .sf-primary-soft, .sf-secondary-soft, .card-xxs, .card-xs, .card-s, .card-m, .card-l, .card-xl, .card-xxl, .card-soft, .card-primary, .card-secondary, .elementor-button, .e-button-base, .e-form-submit-button-base, .e-image-link-base, a:has(> :is(img,picture,svg)), [role="button"], .btn-primary, .btn-secondary, .btn-outline, .btn-outline-primary, .btn-outline-secondary, .btn-ghost, [data-tsds-text-colors="off"])) {
  :scope[class] {
    background-color: var(--tsds-surface-background);
    color: var(--tsds-surface-color);
  }

  :where(p, h1, h2, h3, h4, h5, h6, ul, ol, li, dd, dt, blockquote, figcaption, label, legend) {
    color: var(--tsds-surface-context-color);
  }

  :is(.e-paragraph-base, .e-heading-base, .e-icon-base, .e-svg-base, .e-form-label-base, .e-default-li, .e-list-item__marker)[class] {
    color: var(--tsds-surface-context-color);
  }

  a:where(:not(.e-image-link-base))[href][href] {
    color: var(--tsds-link-color);
    text-decoration-line: underline;
    text-underline-offset: 0.15em;
  }

  a:where(:not(.e-image-link-base))[href][href]:hover {
    color: var(--tsds-link-hover-color);
    text-decoration-thickness: 2px;
  }

  a:where(:not(.e-image-link-base))[href][href]:active {
    color: var(--tsds-link-active-color);
    text-decoration-thickness: 2px;
  }

  a:where(:not(.e-image-link-base))[href][href]:focus-visible {
    color: var(--tsds-link-focus-color);
    outline: 2px solid currentColor;
    outline-offset: 3px;
    text-decoration-thickness: 2px;
  }
}

/* Outline is a border utility and deliberately does not alter box-shadow. */
.elementor :is(.e-con, .e-con-inner, .elementor-container, .elementor-widget-image, .elementor-widget-accordion, .elementor-widget-n-accordion):is(.ol, .ol-primary, .ol-secondary) {
  --tsds-outline-color: var(--ts-color-border, var(--c-border, rgba(18, 20, 23, 0.1)));
}

.elementor :is(.e-con, .e-con-inner, .elementor-container, .elementor-widget-image, .elementor-widget-accordion, .elementor-widget-n-accordion).ol-primary {
  --tsds-outline-color: var(--ts-color-primary, var(--c-accent, var(--e-global-color-primary, #000)));
}

.elementor :is(.e-con, .e-con-inner, .elementor-container, .elementor-widget-image, .elementor-widget-accordion, .elementor-widget-n-accordion).ol-secondary {
  --tsds-outline-color: var(--ts-color-secondary, var(--c-accent-2, var(--e-global-color-secondary, #000)));
}

.elementor :is(.e-con, .e-con-inner, .elementor-container):is(.ol, .ol-primary, .ol-secondary) {
  border: var(--outline-width) solid var(--tsds-outline-color) !important;
}

/* Radius mapping is shared by containers and the explicit component bridges. */
.elementor :is(.e-con, .e-con-inner, .elementor-container, .elementor-widget-image, .elementor-widget-button, .elementor-button, .elementor-widget-accordion, .elementor-widget-n-accordion).ro-xxs { --tsds-radius: var(--radius-xxs); }
.elementor :is(.e-con, .e-con-inner, .elementor-container, .elementor-widget-image, .elementor-widget-button, .elementor-button, .elementor-widget-accordion, .elementor-widget-n-accordion).ro-xs { --tsds-radius: var(--radius-xs); }
.elementor :is(.e-con, .e-con-inner, .elementor-container, .elementor-widget-image, .elementor-widget-button, .elementor-button, .elementor-widget-accordion, .elementor-widget-n-accordion).ro-s { --tsds-radius: var(--radius-s); }
.elementor :is(.e-con, .e-con-inner, .elementor-container, .elementor-widget-image, .elementor-widget-button, .elementor-button, .elementor-widget-accordion, .elementor-widget-n-accordion).ro-m { --tsds-radius: var(--radius-m); }
.elementor :is(.e-con, .e-con-inner, .elementor-container, .elementor-widget-image, .elementor-widget-button, .elementor-button, .elementor-widget-accordion, .elementor-widget-n-accordion).ro-l { --tsds-radius: var(--radius-l); }
.elementor :is(.e-con, .e-con-inner, .elementor-container, .elementor-widget-image, .elementor-widget-button, .elementor-button, .elementor-widget-accordion, .elementor-widget-n-accordion).ro-xl { --tsds-radius: var(--radius-xl); }
.elementor :is(.e-con, .e-con-inner, .elementor-container, .elementor-widget-image, .elementor-widget-button, .elementor-button, .elementor-widget-accordion, .elementor-widget-n-accordion).ro-xxl { --tsds-radius: var(--radius-xxl); }
.elementor :is(.e-con, .e-con-inner, .elementor-container, .elementor-widget-image, .elementor-widget-button, .elementor-button, .elementor-widget-accordion, .elementor-widget-n-accordion).ro-0 { --tsds-radius: var(--radius-0); }

.elementor :is(.e-con, .e-con-inner, .elementor-container):is(.ro-0, .ro-xxs, .ro-xs, .ro-s, .ro-m, .ro-l, .ro-xl, .ro-xxl) {
  border-radius: var(--tsds-radius) !important;
}

/* An explicit ro-* wins over the earlier btn-pill modifier. */
.elementor :is(.elementor-widget-button, .elementor-button):is(.ro-0, .ro-xxs, .ro-xs, .ro-s, .ro-m, .ro-l, .ro-xl, .ro-xxl) {
  --tsds-button-radius-override: var(--tsds-radius);
}

/* Image Widgets paint Appearance on the visible image, never on the wrapper. */
.elementor .elementor-widget-image:is(.ro-0, .ro-xxs, .ro-xs, .ro-s, .ro-m, .ro-l, .ro-xl, .ro-xxl) img {
  border-radius: var(--tsds-radius) !important;
}

.elementor .elementor-widget-image:is(.ol, .ol-primary, .ol-secondary) img {
  box-sizing: border-box;
  border: var(--outline-width) solid var(--tsds-outline-color) !important;
}

/* Accordion utilities paint each direct visible item, not nested Accordions. */
.elementor .elementor-widget-accordion:is(.acc-s, .acc-m, .acc-l):is(.sf-page, .sf-subtle, .sf-card, .sf-elev, .sf-strong, .sf-inverse, .sf-primary-soft, .sf-secondary-soft) > .elementor-widget-container > .elementor-accordion > .elementor-accordion-item,
.elementor .elementor-widget-accordion:is(.acc-s, .acc-m, .acc-l):is(.sf-page, .sf-subtle, .sf-card, .sf-elev, .sf-strong, .sf-inverse, .sf-primary-soft, .sf-secondary-soft) > .elementor-accordion > .elementor-accordion-item,
.elementor .elementor-widget-n-accordion:is(.acc-s, .acc-m, .acc-l):is(.sf-page, .sf-subtle, .sf-card, .sf-elev, .sf-strong, .sf-inverse, .sf-primary-soft, .sf-secondary-soft) > .elementor-widget-container > .e-n-accordion > details.e-n-accordion-item,
.elementor .elementor-widget-n-accordion:is(.acc-s, .acc-m, .acc-l):is(.sf-page, .sf-subtle, .sf-card, .sf-elev, .sf-strong, .sf-inverse, .sf-primary-soft, .sf-secondary-soft) > .e-n-accordion > details.e-n-accordion-item {
  background: var(--tsds-surface-background) !important;
}

.elementor :is(.elementor-widget-accordion, .elementor-widget-n-accordion):is(.acc-s, .acc-m, .acc-l):is(.sf-page, .sf-subtle, .sf-card, .sf-elev, .sf-strong, .sf-inverse, .sf-primary-soft, .sf-secondary-soft) {
  --tsds-acc-text: var(--tsds-surface-color);
}

.elementor .elementor-widget-accordion:is(.acc-s, .acc-m, .acc-l):is(.ol, .ol-primary, .ol-secondary) > .elementor-widget-container > .elementor-accordion > .elementor-accordion-item,
.elementor .elementor-widget-accordion:is(.acc-s, .acc-m, .acc-l):is(.ol, .ol-primary, .ol-secondary) > .elementor-accordion > .elementor-accordion-item,
.elementor .elementor-widget-n-accordion:is(.acc-s, .acc-m, .acc-l):is(.ol, .ol-primary, .ol-secondary) > .elementor-widget-container > .e-n-accordion > details.e-n-accordion-item,
.elementor .elementor-widget-n-accordion:is(.acc-s, .acc-m, .acc-l):is(.ol, .ol-primary, .ol-secondary) > .e-n-accordion > details.e-n-accordion-item {
  border: var(--outline-width) solid var(--tsds-outline-color) !important;
}

.elementor .elementor-widget-accordion:is(.acc-s, .acc-m, .acc-l):is(.ro-0, .ro-xxs, .ro-xs, .ro-s, .ro-m, .ro-l, .ro-xl, .ro-xxl) > .elementor-widget-container > .elementor-accordion > .elementor-accordion-item,
.elementor .elementor-widget-accordion:is(.acc-s, .acc-m, .acc-l):is(.ro-0, .ro-xxs, .ro-xs, .ro-s, .ro-m, .ro-l, .ro-xl, .ro-xxl) > .elementor-accordion > .elementor-accordion-item,
.elementor .elementor-widget-n-accordion:is(.acc-s, .acc-m, .acc-l):is(.ro-0, .ro-xxs, .ro-xs, .ro-s, .ro-m, .ro-l, .ro-xl, .ro-xxl) > .elementor-widget-container > .e-n-accordion > details.e-n-accordion-item,
.elementor .elementor-widget-n-accordion:is(.acc-s, .acc-m, .acc-l):is(.ro-0, .ro-xxs, .ro-xs, .ro-s, .ro-m, .ro-l, .ro-xl, .ro-xxl) > .e-n-accordion > details.e-n-accordion-item {
  border-radius: var(--tsds-radius) !important;
}

/* Tabs receive one surface on their direct root; panels and nested content stay untouched. */
.elementor .elementor-widget-tabs:is(.tab-s, .tab-m, .tab-l):is(.sf-page, .sf-subtle, .sf-card, .sf-elev, .sf-strong, .sf-inverse, .sf-primary-soft, .sf-secondary-soft) > .elementor-widget-container > .elementor-tabs,
.elementor .elementor-widget-tabs:is(.tab-s, .tab-m, .tab-l):is(.sf-page, .sf-subtle, .sf-card, .sf-elev, .sf-strong, .sf-inverse, .sf-primary-soft, .sf-secondary-soft) > .elementor-tabs,
.elementor .elementor-widget-n-tabs:is(.tab-s, .tab-m, .tab-l):is(.sf-page, .sf-subtle, .sf-card, .sf-elev, .sf-strong, .sf-inverse, .sf-primary-soft, .sf-secondary-soft) > .elementor-widget-container > .e-n-tabs,
.elementor .elementor-widget-n-tabs:is(.tab-s, .tab-m, .tab-l):is(.sf-page, .sf-subtle, .sf-card, .sf-elev, .sf-strong, .sf-inverse, .sf-primary-soft, .sf-secondary-soft) > .e-n-tabs {
  background: var(--tsds-surface-background) !important;
  color: var(--tsds-surface-color) !important;
}

.elementor :is(.elementor-widget-tabs, .elementor-widget-n-tabs):is(.tab-s, .tab-m, .tab-l):is(.sf-page, .sf-subtle, .sf-card, .sf-elev, .sf-strong, .sf-inverse, .sf-primary-soft, .sf-secondary-soft) {
  --tsds-tabs-text: var(--tsds-surface-color);
}

/* Resets are intentionally last and match the same visible targets. */
.elementor hr.e-divider-base:where(.ol, .ol-primary, .ol-secondary).no-border,
.elementor hr.e-divider-base:where(.ol, .ol-primary, .ol-secondary).no-bg {
  background-color: transparent;
}

.elementor :is(.e-con, .e-con-inner, .elementor-container).no-bg {
  background: transparent !important;
  background-image: none !important;
}

.elementor .elementor-widget-accordion:is(.acc-s, .acc-m, .acc-l).no-bg > .elementor-widget-container > .elementor-accordion > .elementor-accordion-item,
.elementor .elementor-widget-accordion:is(.acc-s, .acc-m, .acc-l).no-bg > .elementor-accordion > .elementor-accordion-item,
.elementor .elementor-widget-n-accordion:is(.acc-s, .acc-m, .acc-l).no-bg > .elementor-widget-container > .e-n-accordion > details.e-n-accordion-item,
.elementor .elementor-widget-n-accordion:is(.acc-s, .acc-m, .acc-l).no-bg > .e-n-accordion > details.e-n-accordion-item,
.elementor .elementor-widget-tabs:is(.tab-s, .tab-m, .tab-l).no-bg > .elementor-widget-container > .elementor-tabs,
.elementor .elementor-widget-tabs:is(.tab-s, .tab-m, .tab-l).no-bg > .elementor-tabs,
.elementor .elementor-widget-n-tabs:is(.tab-s, .tab-m, .tab-l).no-bg > .elementor-widget-container > .e-n-tabs,
.elementor .elementor-widget-n-tabs:is(.tab-s, .tab-m, .tab-l).no-bg > .e-n-tabs {
  background: transparent !important;
  background-image: none !important;
}

.elementor :is(.e-con, .e-con-inner, .elementor-container).no-border {
  border: 0 !important;
}

.elementor .elementor-widget-image.no-border img {
  border: 0 !important;
}

.elementor .elementor-widget-accordion:is(.acc-s, .acc-m, .acc-l).no-border > .elementor-widget-container > .elementor-accordion > .elementor-accordion-item,
.elementor .elementor-widget-accordion:is(.acc-s, .acc-m, .acc-l).no-border > .elementor-accordion > .elementor-accordion-item,
.elementor .elementor-widget-n-accordion:is(.acc-s, .acc-m, .acc-l).no-border > .elementor-widget-container > .e-n-accordion > details.e-n-accordion-item,
.elementor .elementor-widget-n-accordion:is(.acc-s, .acc-m, .acc-l).no-border > .e-n-accordion > details.e-n-accordion-item {
  border: 0 !important;
}

/* Opt-in orientation bridge for the existing ELF tablet stacking contract. */
@media (max-width: 1024px) {
  .elementor hr.e-divider-base.divider-stack-tab {
    position: static;
    width: 100%;
    height: 1px;
  }
}
