/* Download Job Summary drawer — Figma 6036 (shell / slot / footer) + 6037 (toast). */

/* Panel radius (same pattern as RCM drawers on ODSDrawer). */
.arch-djs-drawer.ods-drawer .dialog-panel .content-wrapper {
  border-radius: 12px 0 0 12px;
}

/* Figma 6036:60033 — header */
.arch-djs-drawer.ods-drawer .drawer-header-container {
  display: flex;
  align-items: flex-start;
  box-sizing: border-box;
  gap: var(--components-gap-large, 24px);
  padding: var(--components-container-padding-large, 24px);
  border-bottom: 1px solid var(--components-border-brand-neutral-light, #d9d8d8);
  background: #fff;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.09);
}

.arch-djs-drawer.ods-drawer .drawer-header-container .title-container {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--components-gap-small, 8px);
  min-width: 0;
}

.arch-djs-drawer.ods-drawer .drawer-header-container .title-content,
.arch-djs-drawer.ods-drawer .drawer-header-container .description-content {
  margin: 0;
  width: 100%;
}

.arch-djs-drawer.ods-drawer .drawer-header-container .title-content {
  font-family: var(--font-family-1, Gotham), sans-serif;
  font-size: 26px;
  font-weight: var(--font-weight-semibold, 600);
  line-height: 40px;
  letter-spacing: 0;
  color: var(--components-text-brand-neutral-default, #1d1d1d);
}

.arch-djs-drawer.ods-drawer .drawer-header-container .description-content {
  font-family: var(--font-family-2, 'Open Sans'), sans-serif;
  font-size: var(--font-size-2, 14px);
  font-weight: 400;
  line-height: 24px;
  letter-spacing: var(--text-tracking, 0);
  font-variation-settings: 'wdth' 100;
  color: var(--components-text-brand-neutral-light, #747373);
}

.arch-djs-drawer.ods-drawer .body-container {
  padding: 0;
}

/* Figma 6036:60038 — footer chrome */
.arch-djs-drawer.ods-drawer .footer-container {
  box-sizing: border-box;
  padding: 16px;
  border-top: 1px solid var(--components-border-brand-neutral-light, #d9d8d8);
  background: #fff;
  box-shadow: 0 0 9px rgba(0, 0, 0, 0.12);
}

/* Body + column stack: shared flex column (Figma 59984–59987). */
.arch-djs-drawer-body,
.arch-djs-slot {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
}

.arch-djs-drawer-body {
  align-items: stretch;
  padding: 16px 0 24px;
}

.arch-djs-slot {
  align-items: flex-start;
  gap: 8px;
  max-width: 100%;
}

/* Figma 6036:59986 — select-all row */
.arch-djs-select-all {
  margin: 0;
  padding-left: 6px;
  width: 100%;
}

.arch-djs-select-all > * {
  margin-block: 0;
}

/* Checkbox / text-default (6036:59986, 59994) + footer checkbox (60040–60042). */
.arch-djs-option-list label,
.arch-djs-select-all label,
.arch-djs-drawer.ods-drawer .footer-container label {
  font-family: var(--font-family-2, 'Open Sans'), sans-serif;
  font-size: var(--font-size-2, 14px);
  font-weight: 400;
  line-height: var(--line-height-16, 16px);
  letter-spacing: var(--text-tracking, 0);
  font-variation-settings: 'wdth' 100;
  color: var(--components-text-brand-neutral-default, #1d1d1d);
}

.arch-djs-card-stack {
  display: grid;
  grid-template-columns: repeat(2, 316px);
  gap: 24px;
  align-items: stretch;
  justify-content: start;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
}

.arch-djs-option-list {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
  min-height: 0;
  box-sizing: border-box;
  overflow: visible;
  /* Room for focus-visible ring inside the card */
  padding: 4px;
}

.arch-djs-option-list-item {
  display: contents;
}

/* Flatten pair wrappers so every section card shares one equal-height grid. */
.arch-djs-card-row {
  display: contents;
}

@media (max-width: 719px) {
  .arch-djs-card-stack {
    grid-template-columns: 1fr;
  }

  .arch-djs-section-card.arch-djs-section-card {
    max-width: none;
    width: 100%;
  }
}

/* Height = tallest card’s content (no fixed 336px empty space). */
.arch-djs-section-card.arch-djs-section-card {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  width: 100%;
  max-width: 316px;
  height: auto;
  min-height: 0;
  padding: 23px !important;
  border-radius: var(--components-border-radius-medium, 8px) !important;
  border-color: var(--components-border-brand-neutral-light, #d9d8d8);
  background: var(--white, #fff);
  box-shadow: none;
  overflow: hidden;
}

/* Figma 6036:59990 — heading xsmall */
.arch-djs-section-title {
  flex-shrink: 0;
  margin: 0 0 12px;
  padding: 0;
  font-family: var(--font-family-1, Gotham), sans-serif;
  font-size: 18px;
  font-weight: var(--font-weight-semibold, 600);
  line-height: 24px;
  letter-spacing: 0;
  color: var(--components-text-brand-neutral-default, #1d1d1d);
}

/* Figma 6037:64176 — success toast copy */
.arch-djs-download-toast-desc {
  font-family: var(--font-family-2, 'Open Sans'), sans-serif;
  font-size: var(--font-size-2, 14px);
  font-weight: 400;
  line-height: var(--line-height-24, 24px);
  letter-spacing: var(--text-tracking, 0);
}

.arch-djs-download-toast-action {
  display: inline;
  margin: 0;
  padding: 0;
  border: none;
  font: inherit;
  font-weight: 600;
  line-height: var(--line-height-24, 24px);
  letter-spacing: var(--text-tracking, 0);
  text-decoration: underline;
  cursor: pointer;
  color: inherit;
  background: transparent;
  vertical-align: baseline;
}

/* Figma 6036:60038–60040 — footer row */
.arch-djs-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 16px;
  width: 100%;
  min-height: 32px;
  padding: 0;
  border: none;
  background: transparent;
  box-shadow: none;
}

/* Figma 6036:60039 — Cancel tertiary / button small */
.arch-djs-drawer.ods-drawer .footer-container .arch-djs-footer-cancel,
.arch-djs-drawer.ods-drawer .footer-container .arch-djs-footer-cancel button {
  font-family: var(--font-family-2, 'Open Sans'), sans-serif;
  font-size: var(--font-size-2, 14px);
  font-weight: var(--font-weight-medium, 600);
  line-height: var(--line-height-24, 24px);
  letter-spacing: var(--body-tracking, var(--text-tracking, 0));
  font-variation-settings: 'wdth' 100;
  text-decoration: underline;
  text-underline-offset: 2px;
  -webkit-text-decoration-skip: ink;
          text-decoration-skip-ink: auto;
}

.arch-djs-footer-actions {
  display: flex;
  flex-wrap: wrap;
  flex-shrink: 0;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

/* Figma 6037:64176 — toast action label (inline “Download Manually”) */
.arch-djs-export-toast-link {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font-family: var(--font-family-2, 'Open Sans'), sans-serif;
  font-size: var(--font-size-2, 14px);
  font-weight: var(--font-weight-medium, 600);
  line-height: var(--line-height-24, 24px);
  letter-spacing: var(--body-tracking, var(--text-tracking, 0));
  text-decoration: underline;
  text-underline-offset: 2px;
  -webkit-text-decoration-skip: ink;
          text-decoration-skip-ink: auto;
}

.arch-djs-export-toast-link:hover {
  text-decoration-thickness: 2px;
}
