/* Container-width-safe builder layout. Keep every field in one content column. */
.simple-dashboard.sd-builder { container-type: inline-size; }
.simple-dashboard .sd-heading-editor { margin: 0 0 1.25rem; padding: 1.25rem; border: 1px solid oklch(var(--totalform-border-color)); border-radius: 12px; background: oklch(var(--totalform-nearwhite)); }
.simple-dashboard .sd-heading-editor h2, .simple-dashboard .sd-heading-editor p { margin: 0 0 .75rem; }
.simple-dashboard .sd-heading-fields { display: grid; grid-template-columns: minmax(160px,.7fr) minmax(220px,1fr) minmax(260px,1.4fr); gap: 1rem; }
.simple-dashboard .sd-heading-fields label { display: grid; gap: .3rem; font-size: .8rem; font-weight: 700; color: oklch(var(--totalform-label-color)); }
.simple-dashboard .sd-heading-fields input { width: 100%; min-width: 0; min-height: 40px; padding: .5rem; border: 1px solid oklch(var(--totalform-border-color)); border-radius: 7px; background: oklch(var(--totalform-background)); color: oklch(var(--totalform-text-color)); }
.simple-dashboard .sd-heading-editor h3 { margin: 1.25rem 0 .75rem; }
.simple-dashboard .sd-logo-fields { display: grid; grid-template-columns: minmax(260px,1.5fr) minmax(200px,1fr) minmax(120px,.45fr) 120px; gap: 1rem; align-items: end; }
.simple-dashboard .sd-logo-fields label { display: grid; gap: .3rem; font-size: .8rem; font-weight: 700; color: oklch(var(--totalform-label-color)); }
.simple-dashboard .sd-logo-fields input, .simple-dashboard .sd-logo-fields select { width: 100%; min-width: 0; min-height: 40px; padding: .5rem; border: 1px solid oklch(var(--totalform-border-color)); border-radius: 7px; background: oklch(var(--totalform-background)); color: oklch(var(--totalform-text-color)); }
.simple-dashboard .sd-logo-preview { display: grid; gap: .3rem; font-size: .8rem; font-weight: 700; color: oklch(var(--totalform-label-color)); }
.simple-dashboard .sd-logo-preview img { width: auto; max-width: 110px; height: 56px; object-fit: contain; object-position: left center; }
.simple-dashboard .sd-builder-list { grid-template-columns: minmax(0, 1fr); gap: .75rem; }
.simple-dashboard .sd-edit-card {
  grid-template-columns: 55px minmax(180px, .9fr) minmax(220px, 1.2fr) minmax(130px, .45fr);
  grid-template-areas:
    "order title description icon"
    ". type target remove";
  gap: .75rem 1rem;
  padding: .9rem 1rem;
  align-items: end;
  overflow: hidden;
}

@container (max-width: 1050px) {
  .simple-dashboard .sd-heading-fields { grid-template-columns: minmax(0, 1fr); }
  .simple-dashboard .sd-logo-fields { grid-template-columns: minmax(0, 1fr); }
  .simple-dashboard .sd-edit-card {
    grid-template-columns: 55px minmax(0, 1fr) minmax(0, 1fr);
    grid-template-areas:
      "order title icon"
      ". description description"
      ". type target"
      ". remove remove";
  }
}

/* Also place fields from a previously cached builder template. */
.simple-dashboard .sd-edit-card > label:nth-of-type(1) { grid-area: title; }
.simple-dashboard .sd-edit-card > label:nth-of-type(2) { grid-area: description; }
.simple-dashboard .sd-edit-card > label:nth-of-type(3) { grid-area: icon; }
.simple-dashboard .sd-edit-card > label:nth-of-type(4) { grid-area: type; }
.simple-dashboard .sd-edit-card > label:nth-of-type(5) { grid-area: target; }

@media (max-width: 700px) {
  .simple-dashboard .sd-edit-card {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "title"
      "description"
      "icon"
      "type"
      "target"
      "order"
      "remove";
  }
}