/* Shieldy Welcome Compact UI v2
   Presentation-only layer. Existing form fields, ids, names and network logic stay untouched. */
body[data-account-page="bots"] #sh-interaction-view-welcome #shieldy-welcome-builder{
  display:block!important;
  max-width:none!important;
}
body[data-account-page="bots"] #sh-interaction-view-welcome .welcome-settings-column{
  display:grid!important;
  gap:14px!important;
}

/* Scenario switch: Entry / Exit / Auto-role */
body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-scenario-tabs{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  padding:7px;
  border:1px solid var(--account-border,#d8dee4);
  border-radius:15px;
  background:color-mix(in srgb,var(--account-surface-soft,#f6f8fa) 88%,transparent);
}
body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-scenario-tab{
  appearance:none;
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  align-items:center;
  gap:10px;
  min-width:0;
  min-height:62px;
  padding:9px 11px;
  border:1px solid transparent;
  border-radius:11px;
  background:transparent;
  color:var(--account-text,#1f2328);
  text-align:left;
  cursor:pointer;
  transition:border-color .16s ease,background .16s ease,box-shadow .16s ease,transform .16s ease;
}
body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-scenario-tab:hover{
  border-color:color-mix(in srgb,var(--account-accent,#2da44e) 32%,var(--account-border,#d8dee4));
  background:var(--account-surface,#fff);
  transform:translateY(-1px);
}
body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-scenario-tab.is-active{
  border-color:color-mix(in srgb,var(--account-accent,#2da44e) 44%,var(--account-border,#d8dee4));
  background:var(--account-surface,#fff);
  box-shadow:0 5px 16px rgba(31,35,40,.08);
}
body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-scenario-icon{
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border:1px solid var(--account-border,#d8dee4);
  border-radius:11px;
  background:var(--account-surface,#fff);
  font-size:17px;
}
body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-scenario-tab.is-active .jj-welcome-scenario-icon{
  border-color:color-mix(in srgb,var(--account-accent,#2da44e) 36%,var(--account-border,#d8dee4));
  background:color-mix(in srgb,var(--account-accent,#2da44e) 10%,var(--account-surface,#fff));
}
body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-scenario-copy{
  display:grid;
  gap:2px;
  min-width:0;
}
body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-scenario-copy strong{
  font-size:13px;
  line-height:1.2;
}
body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-scenario-copy small{
  overflow:hidden;
  color:var(--account-muted,#656d76);
  font-size:10px;
  font-weight:700;
  line-height:1.3;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* Only one existing form is visually active at once. No form data is moved. */
body[data-account-page="bots"] #shieldy-welcome-builder[data-jj-welcome-scenario="welcome"] #shieldy-farewell-form,
body[data-account-page="bots"] #shieldy-welcome-builder[data-jj-welcome-scenario="role"] #shieldy-farewell-form,
body[data-account-page="bots"] #shieldy-welcome-builder[data-jj-welcome-scenario="farewell"] #shieldy-welcome-form{
  display:none!important;
}

/* Per-event simple navigation. */
body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-editor-tabs{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:5px;
  margin:12px 0 0;
  padding:5px;
  border:1px solid var(--account-border,#d8dee4);
  border-radius:12px;
  background:var(--account-surface-soft,#f6f8fa);
}
body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-editor-tab{
  min-width:0;
  min-height:38px;
  padding:7px 9px;
  border:0;
  border-radius:9px;
  background:transparent;
  color:var(--account-muted,#656d76);
  font:850 11px/1.15 Nunito,sans-serif;
  cursor:pointer;
}
body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-editor-tab:hover{
  color:var(--account-text,#1f2328);
}
body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-editor-tab.is-active{
  background:var(--account-surface,#fff);
  color:var(--account-text,#1f2328);
  box-shadow:0 2px 8px rgba(31,35,40,.08);
}

/* Existing dependent container remains governed by the original enabled-state logic. */
body[data-account-page="bots"] #sh-interaction-view-welcome .welcome-event-form[data-jj-welcome-section] .welcome-dependent.is-open{
  display:grid!important;
}
body[data-account-page="bots"] #sh-interaction-view-welcome .welcome-event-form[data-jj-welcome-section="free"] .welcome-dependent>.welcome-subsection:not([data-jj-welcome-category="free"]):not([data-jj-welcome-category="visual"]),
body[data-account-page="bots"] #sh-interaction-view-welcome .welcome-event-form[data-jj-welcome-section="premium"] .welcome-dependent>.welcome-subsection:not([data-jj-welcome-category="visual"]),
body[data-account-page="bots"] #sh-interaction-view-welcome .welcome-event-form[data-jj-welcome-section="more"] .welcome-dependent>.welcome-subsection:not([data-jj-welcome-category="more"]){
  display:none!important;
}

/* The card editor is one existing form surface shared by Free and Premium.
   We only switch which child group is visible; controls stay in place. */
body[data-account-page="bots"] #sh-interaction-view-welcome .welcome-event-form[data-jj-welcome-section="free"] .welcome-subsection[data-jj-welcome-category="visual"]>.welcome-card-customization{
  display:none!important;
}
body[data-account-page="bots"] #sh-interaction-view-welcome .welcome-event-form[data-jj-welcome-section="premium"] .welcome-subsection[data-jj-welcome-category="visual"]>.welcome-section-head,
body[data-account-page="bots"] #sh-interaction-view-welcome .welcome-event-form[data-jj-welcome-section="premium"] .welcome-subsection[data-jj-welcome-category="visual"]>.welcome-card-standard-note,
body[data-account-page="bots"] #sh-interaction-view-welcome .welcome-event-form[data-jj-welcome-section="premium"] .welcome-subsection[data-jj-welcome-category="visual"]>.welcome-free-banner-presets,
body[data-account-page="bots"] #sh-interaction-view-welcome .welcome-event-form[data-jj-welcome-section="premium"] .welcome-subsection[data-jj-welcome-category="visual"]>.shieldy-site-media-stack{
  display:none!important;
}
body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-customization-toggle{
  display:none!important;
}

/* Auto-role reuses the existing role field inside the welcome form. */
body[data-account-page="bots"] #shieldy-welcome-builder[data-jj-welcome-scenario="welcome"] #welcome-step-role{
  display:none!important;
}
body[data-account-page="bots"] #shieldy-welcome-builder[data-jj-welcome-scenario="role"] #shieldy-welcome-form>.welcome-event-card>.automod-rule-head,
body[data-account-page="bots"] #shieldy-welcome-builder[data-jj-welcome-scenario="role"] #shieldy-welcome-form .jj-welcome-editor-tabs,
body[data-account-page="bots"] #shieldy-welcome-builder[data-jj-welcome-scenario="role"] #shieldy-welcome-form>.welcome-inline-preview{
  display:none!important;
}
body[data-account-page="bots"] #shieldy-welcome-builder[data-jj-welcome-scenario="role"] #shieldy-welcome-form>.welcome-event-card{
  display:block!important;
}
body[data-account-page="bots"] #shieldy-welcome-builder[data-jj-welcome-scenario="role"] #shieldy-welcome-form .welcome-event-workspace{
  display:block!important;
  margin-top:0!important;
}
body[data-account-page="bots"] #shieldy-welcome-builder[data-jj-welcome-scenario="role"] #welcome-options{
  display:grid!important;
  gap:12px!important;
}
body[data-account-page="bots"] #shieldy-welcome-builder[data-jj-welcome-scenario="role"] #welcome-options>.welcome-subsection:not(#welcome-step-role){
  display:none!important;
}
body[data-account-page="bots"] #shieldy-welcome-builder[data-jj-welcome-scenario="role"] #welcome-step-role{
  display:block!important;
  margin:0!important;
}
body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-role-note{
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin:0 0 12px;
  padding:11px 13px;
  border:1px solid color-mix(in srgb,var(--account-accent,#2da44e) 25%,var(--account-border,#d8dee4));
  border-radius:11px;
  background:color-mix(in srgb,var(--account-accent,#2da44e) 5%,var(--account-surface,#fff));
  color:var(--account-muted,#656d76);
  font-size:11px;
  line-height:1.45;
}
body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-role-note strong{color:var(--account-text,#1f2328)}

/* Keep the most useful two-column editor + live preview on desktop. */
@media(min-width:1081px){
  body[data-account-page="bots"] #sh-interaction-view-welcome :is(#shieldy-welcome-form,#shieldy-farewell-form).b05cbcf65-welcome-preview-layout{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(330px,390px)!important;
    gap:16px!important;
    align-items:start!important;
  }
  body[data-account-page="bots"] #sh-interaction-view-welcome :is(#shieldy-welcome-form,#shieldy-farewell-form).b05cbcf65-welcome-preview-layout>.welcome-event-card{
    grid-column:1!important;
    min-width:0!important;
  }
  body[data-account-page="bots"] #sh-interaction-view-welcome :is(#shieldy-welcome-form,#shieldy-farewell-form).b05cbcf65-welcome-preview-layout>.welcome-inline-preview{
    display:block!important;
    grid-column:2!important;
    grid-row:1!important;
    position:sticky!important;
    top:14px!important;
    min-width:0!important;
  }
  body[data-account-page="bots"] #sh-interaction-view-welcome :is(#shieldy-welcome-form,#shieldy-farewell-form).b05cbcf65-welcome-preview-layout>.welcome-inline-preview[hidden]{
    display:none!important;
  }
  body[data-account-page="bots"] #sh-interaction-view-welcome :is(#shieldy-welcome-form,#shieldy-farewell-form).b05cbcf65-welcome-preview-layout>.welcome-event-card .welcome-event-workspace{
    display:block!important;
    margin-top:12px!important;
  }
  body[data-account-page="bots"] #sh-interaction-view-welcome :is(#shieldy-welcome-form,#shieldy-farewell-form).b05cbcf65-welcome-preview-layout>.welcome-event-card .welcome-event-workspace>.welcome-inline-preview{
    display:none!important;
  }
}

/* Reduce repeated visual noise while keeping feature labels available. */
body[data-account-page="bots"] #sh-interaction-view-welcome .welcome-event-card{
  padding:14px!important;
  border-radius:15px!important;
}
body[data-account-page="bots"] #sh-interaction-view-welcome .welcome-event-card>.automod-rule-head{
  margin:0!important;
  padding:12px 13px!important;
  border-radius:12px!important;
}
body[data-account-page="bots"] #sh-interaction-view-welcome .welcome-dependent{
  gap:11px!important;
  margin-top:11px!important;
}
body[data-account-page="bots"] #sh-interaction-view-welcome .welcome-subsection{
  padding:14px!important;
  border-radius:12px!important;
}
body[data-account-page="bots"] #sh-interaction-view-welcome .welcome-subsection .card-title h3,
body[data-account-page="bots"] #sh-interaction-view-welcome .welcome-section-head h3{
  font-size:14px!important;
}
body[data-account-page="bots"] #sh-interaction-view-welcome .welcome-subsection .card-title p,
body[data-account-page="bots"] #sh-interaction-view-welcome .welcome-section-head p{
  font-size:11px!important;
}
body[data-account-page="bots"] #sh-interaction-view-welcome .welcome-subsection .free-feature-badge{
  font-size:9px!important;
  padding:2px 6px!important;
}

/* Premium card editor is available on demand instead of occupying the whole page. */
body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-customization-toggle{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  width:100%;
  margin-top:12px;
  padding:11px 13px;
  border:1px solid var(--account-border,#d8dee4);
  border-radius:11px;
  background:var(--account-surface-soft,#f6f8fa);
  color:var(--account-text,#1f2328);
  font:850 12px/1.25 Nunito,sans-serif;
  text-align:left;
  cursor:pointer;
}
body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-customization-toggle:hover{
  border-color:color-mix(in srgb,var(--account-accent,#2da44e) 32%,var(--account-border,#d8dee4));
}
body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-customization-toggle span:last-child{
  color:var(--account-muted,#656d76);
  transition:transform .16s ease;
}
body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-customization-toggle[aria-expanded="true"] span:last-child{
  transform:rotate(180deg);
}

/* Role mode should not force a dead empty preview/grid. */
body[data-account-page="bots"] #shieldy-welcome-builder[data-jj-welcome-scenario="role"] #shieldy-welcome-form.b05cbcf65-welcome-preview-layout{
  display:block!important;
}

@media(max-width:1080px){
  body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-scenario-tabs{grid-template-columns:1fr 1fr 1fr}
  body[data-account-page="bots"] #sh-interaction-view-welcome :is(#shieldy-welcome-form,#shieldy-farewell-form).b05cbcf65-welcome-preview-layout{
    display:block!important;
  }
  body[data-account-page="bots"] #sh-interaction-view-welcome :is(#shieldy-welcome-form,#shieldy-farewell-form).b05cbcf65-welcome-preview-layout>.welcome-inline-preview{
    position:static!important;
    margin-top:12px!important;
  }
}
@media(max-width:720px){
  body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-scenario-tabs{grid-template-columns:1fr}
  body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-scenario-tab{min-height:54px}
  body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-scenario-copy small{white-space:normal}
  body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-editor-tabs{grid-template-columns:1fr}
  body[data-account-page="bots"] #sh-interaction-view-welcome .jj-welcome-editor-tab{min-height:34px}
}


/* --------------------------------------------------------------------------
   v2: hard scenario isolation.
   The older live-preview layer turns both forms into display:grid!important on
   desktop. These explicit classes are applied only by the compact UI layer and
   prevent an inactive form/preview from leaking into another scenario.
   -------------------------------------------------------------------------- */
body[data-account-page="bots"] #sh-interaction-view-welcome #shieldy-welcome-builder #shieldy-welcome-form.jj-welcome-scenario-hidden,
body[data-account-page="bots"] #sh-interaction-view-welcome #shieldy-welcome-builder #shieldy-farewell-form.jj-welcome-scenario-hidden,
body[data-account-page="bots"] #sh-interaction-view-welcome #shieldy-welcome-builder :is(#shieldy-welcome-form,#shieldy-farewell-form).b05cbcf65-welcome-preview-layout.jj-welcome-scenario-hidden{
  display:none!important;
}
body[data-account-page="bots"] #sh-interaction-view-welcome #shieldy-welcome-builder .welcome-inline-preview.jj-welcome-preview-scenario-hidden{
  display:none!important;
}

/* v2: preview should size to the actual message instead of reserving a 330px
   empty stage. No preview nodes are replaced and the authoritative preview JS
   remains untouched. */
body[data-account-page="bots"] #sh-interaction-view-welcome #shieldy-welcome-builder :is(#shieldy-welcome-form,#shieldy-farewell-form).b05cbcf65-welcome-preview-layout>.welcome-inline-preview:not(.jj-welcome-preview-scenario-hidden) .welcome-preview-card{
  min-height:0!important;
  height:auto!important;
}
body[data-account-page="bots"] #sh-interaction-view-welcome #shieldy-welcome-builder :is(#shieldy-welcome-form,#shieldy-farewell-form).b05cbcf65-welcome-preview-layout>.welcome-inline-preview:not(.jj-welcome-preview-scenario-hidden) .shieldy-direct-message-preview-b53abbb03{
  min-height:0!important;
  height:auto!important;
  padding:14px!important;
  overflow:visible!important;
}
body[data-account-page="bots"] #sh-interaction-view-welcome #shieldy-welcome-builder :is(#shieldy-welcome-form,#shieldy-farewell-form).b05cbcf65-welcome-preview-layout>.welcome-inline-preview:not(.jj-welcome-preview-scenario-hidden) .welcome-preview-message-stack{
  min-height:0!important;
}

@media(min-width:1081px){
  body[data-account-page="bots"] #sh-interaction-view-welcome #shieldy-welcome-builder :is(#shieldy-welcome-form,#shieldy-farewell-form).b05cbcf65-welcome-preview-layout:not(.jj-welcome-scenario-hidden){
    grid-template-columns:minmax(0,1fr) minmax(400px,470px)!important;
    gap:18px!important;
  }
  body[data-account-page="bots"] #sh-interaction-view-welcome #shieldy-welcome-builder :is(#shieldy-welcome-form,#shieldy-farewell-form).b05cbcf65-welcome-preview-layout:not(.jj-welcome-scenario-hidden)>.welcome-inline-preview:not(.jj-welcome-preview-scenario-hidden){
    position:sticky!important;
    top:14px!important;
    align-self:start!important;
    width:100%!important;
    max-width:none!important;
  }
}

@media(min-width:1450px){
  body[data-account-page="bots"] #sh-interaction-view-welcome #shieldy-welcome-builder :is(#shieldy-welcome-form,#shieldy-farewell-form).b05cbcf65-welcome-preview-layout:not(.jj-welcome-scenario-hidden){
    grid-template-columns:minmax(0,1fr) minmax(430px,500px)!important;
  }
}

@media(max-width:1080px){
  body[data-account-page="bots"] #sh-interaction-view-welcome #shieldy-welcome-builder :is(#shieldy-welcome-form,#shieldy-farewell-form).b05cbcf65-welcome-preview-layout:not(.jj-welcome-scenario-hidden)>.welcome-inline-preview:not(.jj-welcome-preview-scenario-hidden) .shieldy-direct-message-preview-b53abbb03{
    min-height:0!important;
  }
}

/* Give the generated 2:1 card enough room inside the larger live preview. */
body[data-account-page="bots"] #sh-interaction-view-welcome #shieldy-welcome-builder :is(#shieldy-welcome-form,#shieldy-farewell-form).b05cbcf65-welcome-preview-layout:not(.jj-welcome-scenario-hidden)>.welcome-inline-preview:not(.jj-welcome-preview-scenario-hidden) [data-preview-primary-card-slot] .shieldy-welcome-image-card,
body[data-account-page="bots"] #sh-interaction-view-welcome #shieldy-welcome-builder :is(#shieldy-welcome-form,#shieldy-farewell-form).b05cbcf65-welcome-preview-layout:not(.jj-welcome-scenario-hidden)>.welcome-inline-preview:not(.jj-welcome-preview-scenario-hidden) [data-preview-secondary-card-slot] .shieldy-welcome-image-card{
  width:100%!important;
  max-width:100%!important;
  margin:0!important;
  min-height:180px!important;
  aspect-ratio:2 / 1!important;
}
@media(max-width:700px){
  body[data-account-page="bots"] #sh-interaction-view-welcome #shieldy-welcome-builder :is(#shieldy-welcome-form,#shieldy-farewell-form).b05cbcf65-welcome-preview-layout:not(.jj-welcome-scenario-hidden)>.welcome-inline-preview:not(.jj-welcome-preview-scenario-hidden) [data-preview-primary-card-slot] .shieldy-welcome-image-card,
  body[data-account-page="bots"] #sh-interaction-view-welcome #shieldy-welcome-builder :is(#shieldy-welcome-form,#shieldy-farewell-form).b05cbcf65-welcome-preview-layout:not(.jj-welcome-scenario-hidden)>.welcome-inline-preview:not(.jj-welcome-preview-scenario-hidden) [data-preview-secondary-card-slot] .shieldy-welcome-image-card{
    min-height:160px!important;
  }
}

/* --------------------------------------------------------------------------
   v5: Premium editor is a real configuration surface again.
   The base Shieldy editor stylesheet owns the field grids. Do not hide
   .welcome-native-embed-field-row here: the Premium tab is already the
   disclosure boundary, so a second global hiding layer made Premium look
   empty and removed legitimate settings from the UI.
   -------------------------------------------------------------------------- */

body[data-account-page="bots"] #sh-interaction-view-welcome
.welcome-event-form[data-jj-welcome-section="premium"]
.welcome-subsection[data-jj-welcome-category="visual"]>.welcome-card-customization{
  display:grid!important;
}
body[data-account-page="bots"] #sh-interaction-view-welcome
.welcome-event-form[data-jj-welcome-section="premium"]
.welcome-native-embed-field-row{
  display:grid!important;
}
body[data-account-page="bots"] #sh-interaction-view-welcome
.welcome-event-form[data-jj-welcome-section="premium"]
.welcome-native-embed-option-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
body[data-account-page="bots"] #sh-interaction-view-welcome
.welcome-card-editor[data-card-enabled="false"]>.welcome-section-head::after{
  content:"Компонент сейчас выключен — настройки сохранены";
  display:inline-flex;
  margin-top:8px;
  padding:4px 8px;
  border:1px solid var(--account-border,#d8dee4);
  border-radius:999px;
  background:var(--account-surface-soft,#f6f8fa);
  color:var(--account-muted,#656d76);
  font-size:10px;
  font-weight:800;
}
@media(max-width:760px){
  body[data-account-page="bots"] #sh-interaction-view-welcome
  .welcome-event-form[data-jj-welcome-section="premium"]
  .welcome-native-embed-option-grid{
    grid-template-columns:1fr!important;
  }
}