/* Native tools retain their complete light scheme: some advanced forms still
   contain fixed light surfaces. The common inbox supports system dark mode;
   avoid applying only half a dark theme to a native form or top-layer dialog. */
body.workspace-native-shell {
  color-scheme: light;
  --w-ink: #18282e; --w-muted: #52646c; --w-faint: #62757e;
  --w-line: #dbe4e8; --w-quiet-line: #e8edef; --w-control: #81939b;
  --w-surface: #fff; --w-canvas: #f5f8f9; --w-sidebar: #f5f8f9;
  --w-hover: #eaf0f2; --w-soft: #eef3f5; --w-accent: #006f80;
  --w-accent-ink: #fff; --w-selected: #e8f4f6;
  --w-success: #257250; --w-success-bg: #eaf6ef;
  --w-attention: #925d0b; --w-attention-bg: #fff6e5;
  --w-danger: #ac3046; --w-danger-bg: #fff0f2;
}

      body.workspace-native-shell{display:block!important;height:auto!important;min-height:100vh;overflow:auto!important;background:var(--w-surface)!important;color:var(--w-ink)!important}
/* Studio saves and restores document.querySelector('main').scrollTop. Keep
   the shell's first main as the actual scroll container, including on mobile. */
body.workspace-native-shell:has(#workspace-native-host[data-native-product="ads"]) { height:100dvh!important;min-height:0!important;overflow:hidden!important; }
body.workspace-native-shell:has(#workspace-native-host[data-native-product="ads"]) .w-main-shell { display:flex;flex-direction:column;height:100dvh;min-height:0; }
body.workspace-native-shell:has(#workspace-native-host[data-native-product="ads"]) :is(.w-topbar,.w-contextbar) { flex-shrink:0; }
body.workspace-native-shell:has(#workspace-native-host[data-native-product="ads"]) #w-view-main { flex:1;min-height:0;width:100%;max-width:none;overflow:auto; }
      #workspace-native-host{min-width:0;max-width:100%;--fond:var(--w-surface);--carte:var(--w-surface);--bord:var(--w-line);--border:var(--w-line);--texte:var(--w-ink);--doux:var(--w-muted);--lien:var(--w-accent);--violet:var(--w-accent);--selection:var(--w-soft);--bg:var(--w-surface);--panel:var(--w-surface);--fg:var(--w-ink);--ink:var(--w-ink);--teal:var(--w-accent);--light:var(--w-soft);--cream:var(--w-surface);--muted:var(--w-muted);--line:var(--w-line);--blue:var(--w-accent);--tint:var(--w-soft);--green:var(--w-ink);--green-bg:var(--w-soft);--red:var(--w-ink);--red-bg:var(--w-soft);--amber:var(--w-muted);--amber-bg:var(--w-soft)}
      #workspace-native-host{--actif:var(--w-ink);--mort:var(--w-ink);--alerte:var(--w-muted);--studio-ink:var(--w-ink);--studio-muted:var(--w-muted);--studio-blue:var(--w-accent);--studio-canvas:var(--w-surface);--studio-line:var(--w-line);--studio-border:var(--w-line);--studio-surface:var(--w-surface);--studio-surface-subtle:var(--w-canvas);--studio-control-border:var(--w-line);--studio-radius:8px;--studio-radius-sm:6px;--studio-shadow:0 4px 16px #0000000d}
      #workspace-native-host>aside,#workspace-native-host>.skip-link,#workspace-native-host>.ct-skip,#workspace-native-host>main>.workspace-header,#workspace-native-host>.workspace-shell>.top{display:none!important}
      #workspace-native-host>main,#workspace-native-host>.workspace-shell{margin:0!important;padding:0!important;max-width:none!important;width:100%!important;min-width:0!important;overflow:visible!important}
      #workspace-native-host .ct-main{grid-column:auto!important;margin:0!important;padding:0!important}
      #workspace-native-host #main-content{max-width:none;padding:12px 0 0;margin:0}
      #workspace-native-host #vue{padding:12px 0 30px}
      #workspace-native-host #workspace-nav{margin:0;padding:0}
      #workspace-native-host .ct-primary,#workspace-native-host button.primaire,#workspace-native-host .primary{background:var(--w-accent)!important;border-color:var(--w-accent)!important;color:var(--w-accent-ink)!important}
      #workspace-native-host .ct-global-status,#workspace-native-host .notice,#workspace-native-host .launch-error{color:var(--w-muted)!important;background:var(--w-canvas)!important;border-color:var(--w-line)!important}
      #workspace-native-host .ct-automation-nav button.active,#workspace-native-host .so-feedback[role=alert]{color:var(--w-ink)!important;background:var(--w-soft)!important;border-color:var(--w-line)!important}
      #workspace-native-host #parc-status{color:var(--w-ink)!important;background:var(--w-canvas)!important;border-color:var(--w-line)!important;border-left-color:var(--w-muted)!important}
      #workspace-native-host :is(.avis,.sc-notice,.sc-warning,.sn-enable,.sn-connected,.sn-notice,.manage-account-chip.is-unverified,.campaign-diagnostic-trigger,.preview-notice){color:var(--w-ink)!important;background:var(--w-canvas)!important;border-color:var(--w-line)!important}
      #workspace-native-host :is(.manage-missing-summary,.manage-connection-issues,.manage-account-errors)>summary{color:var(--w-ink)!important;background:var(--w-canvas)!important;border-color:var(--w-line)!important}
      #workspace-native-host :is(.ACTIVE,.DISABLED,.CLOSED,.UNSETTLED,.RISK_REVIEW,.RESTRICTED,.gagnant,.ecarte,.epuise,.test,.sc-positive,.sc-negative,.sc-neutral,.sc-needs_review){color:var(--w-ink)!important;background:var(--w-soft)!important;border-color:var(--w-line)!important}
      #workspace-native-host :is(.sc-sentiments button[aria-pressed=true],.sc-row.is-selected,.ct-network-icon,.ct-channel-icon){color:var(--w-ink)!important;background:var(--w-soft)!important}
      #workspace-native-host :is(.sc-danger,.form-error,.launch-error,.studio-dsa-error,[role=alert]){color:var(--w-ink)!important}
      #workspace-native-host :is(.primary,.sc-primary,.ct-primary):hover:enabled{background:var(--w-accent)!important;border-color:var(--w-accent)!important;color:var(--w-accent-ink)!important}
      #workspace-native-host :is(button,input,select,textarea,a,summary){accent-color:var(--w-accent);outline-color:var(--w-accent)}
      #workspace-native-host dialog::backdrop{background:#00000055}
      #workspace-native-host a{color:var(--w-ink)}
      #workspace-native-host button,#workspace-native-host input,#workspace-native-host select,#workspace-native-host textarea{border-radius:6px}
      #workspace-native-host .panel,#workspace-native-host .etape,#workspace-native-host .summary,#workspace-native-host .table-wrap,#workspace-native-host .ct-workspace-panel,#workspace-native-host .ct-dialog{border-radius:8px;box-shadow:none}
      
      .native-preview-note{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 16px;padding:10px 12px;border:1px solid var(--w-line);border-radius:6px;background:var(--w-canvas);color:var(--w-muted);font:12px/1.5 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
      .native-preview-note strong{color:var(--w-ink);font-weight:600}.native-preview-note p{margin:0}.native-preview-note a{color:var(--w-ink);margin-left:auto}
      @media(max-width:700px){#workspace-native-host .ct-page-heading{flex-wrap:wrap;gap:12px}#workspace-native-host .ct-page-actions{flex-wrap:wrap}}
    
/* Real native toolbars remain available: refresh, density, filters and data. */
body.workspace-federated #workspace-native-host>main>.workspace-header,
body.workspace-federated #workspace-native-host>.workspace-shell>.top{
 display:flex!important;position:static!important;margin:0 0 16px!important;padding:8px 0 16px!important;
 min-height:0!important;background:var(--w-surface)!important;border:0!important;border-bottom:1px solid var(--w-line)!important;
}
body.workspace-federated #workspace-native-host .workspace-header .page-heading{min-width:0;flex-wrap:wrap}
body.workspace-federated #workspace-native-host>#mb-session-state{margin:0 0 16px;padding:10px 12px;border:1px solid var(--w-line);border-radius:6px;color:var(--w-ink);background:var(--w-canvas)}
body.workspace-federated #workspace-native-host>#mb-session-state:empty{display:none}
/* The social page already hides its duplicate owner name and role. Keep the
   recovery box available whenever it contains a notice, link or action. */
body.workspace-federated #workspace-native-host[data-native-product="comments"]>#mb-session-state:has(>.mb-session-name):has(>.mb-session-role):not(:has(>:not(.mb-session-name,.mb-session-role))){display:none}

/* Native pages and dialogs appended to body share the same functional tokens. */
body.workspace-native-shell.workspace-federated,
#workspace-native-host {
  --accent: var(--w-accent);
  --surface: var(--w-surface);
  --survol: var(--w-canvas);
  --fond: var(--w-surface);
  --carte: var(--w-surface);
  --bord: var(--w-line);
  --texte: var(--w-ink);
  --doux: var(--w-muted);
  --lien: var(--w-accent);
  --selection: var(--w-soft);
  --vert: var(--w-ink);
  --danger: var(--w-ink);
  --studio-accent-fill: var(--w-accent);
  --studio-accent-ink: var(--w-accent-ink);
  --studio-blue: var(--w-accent);
  --studio-ink: var(--w-ink);
  --blue: var(--w-accent);
  --tint: var(--w-soft);
}

/* Give native content the same breathing room as the common dashboard.
   No overflow clipping: native scroll tables and top-layer dialogs stay intact. */
body.workspace-federated #workspace-native-host {
  box-sizing: border-box;
  padding: 20px 24px 28px;
  margin: 4px 16px 16px 8px;
  background: var(--w-surface);
  border: 1px solid var(--w-quiet-line);
  border-radius: 12px;
}
@media (max-width: 760px) {
  body.workspace-federated #workspace-native-host { padding: 18px 14px 24px; margin: 0 8px 8px; }
}

/* The common shell has an inherited button color. Pair the foreground and
   background explicitly so selected controls never become black on black,
   even when a native stylesheet is added after this theme. */
#workspace-native-host :is(
  button[aria-pressed="true"], button[aria-selected="true"], button[aria-current="page"],
  button[aria-current="step"], button.puce.on,
  .studio-step-nav button.active, .ct-automation-nav button.active,
  .studio-select-option[aria-selected="true"], .studio-select-option[data-active="true"]
) {
  color: var(--w-ink) !important;
  background: var(--w-soft) !important;
  border-color: var(--w-line) !important;
  box-shadow: none !important;
}
#workspace-native-host :is(
  .manage-levels button[aria-current="page"],
  .manage-levels button.on,
  .sn-navigation button[aria-current="page"],
  button.primaire, button.primary, button.ct-primary, button.sc-primary
) {
  color: var(--w-accent-ink) !important;
  background: var(--w-accent) !important;
  border-color: var(--w-accent) !important;
  box-shadow: none !important;
}
#workspace-native-host :is(
  .manage-levels button[aria-current="page"],
  .manage-levels button.on,
  .sn-navigation button[aria-current="page"],
  button.primaire, button.primary, button.ct-primary, button.sc-primary
):hover:not(:disabled) {
  color: var(--w-accent-ink) !important;
  background: var(--w-accent) !important;
  border-color: var(--w-accent) !important;
}
#workspace-native-host :is(
  .manage-levels button[aria-current="page"], .manage-levels button.on,
  .sn-navigation button[aria-current="page"],
  button.primaire, button.primary, button.ct-primary, button.sc-primary
) :is(span, small, svg) { color: inherit !important; }
#workspace-native-host :is(
  .sc-tabs button[aria-current="page"],
  .sc-status-tabs button[aria-pressed="true"],
  .view-tabs .puce.on
) {
  color: var(--w-ink) !important;
  background: var(--w-canvas) !important;
  border-bottom-color: var(--w-ink) !important;
}
#workspace-native-host .studio-step-nav button:is([aria-current="step"], .active) > span {
  color: var(--w-ink) !important;
  background: transparent !important;
  border-color: var(--w-line) !important;
}

/* Status wording and icons remain unchanged; remove inherited purple/pastel
   fills from all delivery badges, including the neutral/paused state. */
#workspace-native-host :is(
  .p, .neuf, .NEUTRAL, .campaign-inspector-badge, .sc-badge,
  .pq-state, .campaign-row-filter-number
) {
  color: var(--w-ink) !important;
  background: var(--w-soft) !important;
  border-color: var(--w-line) !important;
}
#workspace-native-host .workspace-header .kpi::after { background: var(--w-line) !important; }
#workspace-native-host :is(.puce, .studio-select-trigger):hover:not(:disabled):not(.on):not([aria-current="page"]):not([aria-pressed="true"]):not([aria-selected="true"]) {
  color: var(--w-ink) !important;
  background: var(--w-canvas) !important;
  border-color: var(--w-line) !important;
}
#workspace-native-host :is(.campaign-row-filter, .recap, .pied) {
  background: var(--w-canvas) !important;
  border-color: var(--w-line) !important;
}
#workspace-native-host th { background: var(--w-canvas) !important; }
#workspace-native-host tr:hover td { background: var(--w-canvas) !important; }
#workspace-native-host .manage-table th.is-revealed {
  color: var(--w-ink) !important;
  background: var(--w-line) !important;
}

/* Tonal boundaries carry hierarchy; operational states retain their meaning. */
body.workspace-native-shell { background: var(--w-canvas) !important; }
body.workspace-federated #workspace-native-host>main>.workspace-header,
body.workspace-federated #workspace-native-host>.workspace-shell>.top { border-bottom: 0 !important; padding-bottom: 8px !important; }
body.workspace-native-shell.workspace-federated, #workspace-native-host {
  --danger: var(--w-danger); --red: var(--w-danger); --red-bg: var(--w-danger-bg);
  --green: var(--w-success); --green-bg: var(--w-success-bg); --vert: var(--w-success);
  --amber: var(--w-attention); --amber-bg: var(--w-attention-bg); --alerte: var(--w-attention);
  --actif: var(--w-success); --mort: var(--w-danger); --selection: var(--w-selected);
}
#workspace-native-host :is(button[aria-pressed="true"], button[aria-selected="true"], .ct-automation-nav button.active, .sc-sentiments button[aria-pressed="true"], .sc-row.is-selected) {
  color: var(--w-accent) !important; background: var(--w-selected) !important; border-color: var(--w-line) !important;
}
#workspace-native-host :is(.sc-danger, .form-error, .launch-error, .studio-dsa-error, .ct-global-status.error, .so-feedback.error) { color: var(--w-danger) !important; }
#workspace-native-host .launch-error { background: var(--w-danger-bg) !important; }
#workspace-native-host :is(.RISK_REVIEW, .UNSETTLED, .RESTRICTED, .sc-warning, .sc-needs_review, .manage-account-chip.is-unverified) {
  color: var(--w-attention) !important; background: var(--w-attention-bg) !important; border-color: var(--w-line) !important;
}
#workspace-native-host :is(.ACTIVE, .gagnant, .sc-positive, .sn-connected) {
  color: var(--w-success) !important; background: var(--w-success-bg) !important; border-color: var(--w-line) !important;
}
#workspace-native-host :is(a,button,input,select,textarea,summary):focus-visible { outline-color: var(--w-accent); }
#workspace-native-host .sc-negative { color: var(--w-attention) !important; background: var(--w-attention-bg) !important; }
#workspace-native-host :is(.primary,.sc-primary,.ct-primary,button.primaire):hover:enabled {
  background: var(--w-accent) !important; border-color: var(--w-accent) !important; color: var(--w-accent-ink) !important; filter: brightness(.94);
}

/* Tracking cards follow the available table width inside the common shell. */
#workspace-native-host[data-native-product="join"] #links-view > .table-wrap {
  container-name: join-links;
  container-type: inline-size;
}
@container join-links (max-width: 720px) {
  #workspace-native-host[data-native-product="join"] #links-view > .table-wrap .links-table thead{display:none}
  #workspace-native-host[data-native-product="join"] #links-view > .table-wrap .links-table,#workspace-native-host[data-native-product="join"] #links-view > .table-wrap .links-table tbody{display:block}
  #workspace-native-host[data-native-product="join"] #links-view > .table-wrap .links-table tr{display:grid;grid-template-columns:1fr 1fr;gap:13px 18px;padding:19px;border-bottom:1px solid var(--line)}
  #workspace-native-host[data-native-product="join"] #links-view > .table-wrap .links-table tr:last-child{border:0}
  #workspace-native-host[data-native-product="join"] #links-view > .table-wrap .links-table td{display:block;padding:0;border:0}
  #workspace-native-host[data-native-product="join"] #links-view > .table-wrap .links-table td:first-child{grid-column:1/-1}
  #workspace-native-host[data-native-product="join"] #links-view > .table-wrap .links-table .num{text-align:left}
  #workspace-native-host[data-native-product="join"] #links-view > .table-wrap .cell-label{display:block;color:var(--muted);font-size:11px;margin-bottom:2px}
  #workspace-native-host[data-native-product="join"] #links-view > .table-wrap .links-table .linkname{font-size:14px;min-height:28px}
}
