.pickup-dossier-section,
.pickup-control {
  min-width: 0;
}

.security-module,
.security-content,
#securityModeContent,
.pickup-control > *,
.pickup-selector,
.pickup-choices,
.pickup-choice > span {
  min-width: 0;
  max-width: 100%;
}

.pickup-section-intro,
.pickup-control__header,
.pickup-boundary,
.pickup-scan-sim,
.pickup-student,
.pickup-person,
.pickup-person__heading,
.pickup-choice,
.pickup-decision,
.pickup-record header {
  display: flex;
  align-items: center;
}

.pickup-section-intro,
.pickup-control__header,
.pickup-person__heading {
  justify-content: space-between;
  gap: var(--ss-space-3);
}

.pickup-section-intro > p {
  max-width: 72ch;
  margin: 0;
  color: var(--ss-text-secondary);
  font-size: var(--ss-text-sm);
  line-height: 1.6;
}

.pickup-people {
  display: grid;
  gap: var(--ss-space-3);
  margin-top: var(--ss-space-4);
}

.pickup-person {
  gap: var(--ss-space-4);
  min-width: 0;
  padding: var(--ss-space-3);
  border-radius: var(--ss-radius-lg);
  background: var(--ss-bg-primary);
  box-shadow: var(--ss-shadow-md);
}

.pickup-photo {
  flex: 0 0 92px;
  width: 92px;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border-radius: var(--ss-radius);
  background: var(--ss-bg-secondary);
}

.pickup-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 20%;
}

.pickup-photo__placeholder {
  display: grid;
  width: 100%;
  height: 100%;
  place-content: center;
  place-items: center;
  gap: var(--ss-space-1);
  background: var(--ss-info-bg);
  color: var(--ss-info-text);
  text-align: center;
}

.pickup-photo__placeholder span {
  font-size: var(--ss-text-xl);
  font-weight: var(--ss-font-extrabold);
}

.pickup-photo__placeholder small {
  font-size: 10px;
  font-weight: var(--ss-font-bold);
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.pickup-person__content {
  flex: 1;
  min-width: 0;
}

.pickup-person__heading {
  align-items: flex-start;
}

.pickup-person h3,
.pickup-control h2,
.pickup-control h3 {
  margin: 0;
  color: var(--ss-text-primary);
}

.pickup-person__heading p,
.pickup-person__content > small,
.pickup-person__action small,
.pickup-control__header p,
.pickup-scan-sim p,
.pickup-student p,
.pickup-selector header p,
.pickup-decision__content p,
.pickup-decision__content > small,
.pickup-record header p {
  margin: var(--ss-space-1) 0 0;
  color: var(--ss-text-secondary);
  font-size: var(--ss-text-xs);
  line-height: 1.5;
}

.pickup-person dl,
.pickup-record dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--ss-space-3);
  margin: var(--ss-space-3) 0 var(--ss-space-2);
}

.pickup-person dt,
.pickup-record dt {
  color: var(--ss-text-secondary);
  font-size: var(--ss-text-xs);
  font-weight: var(--ss-font-bold);
}

.pickup-person dd,
.pickup-record dd {
  margin: var(--ss-space-1) 0 0;
  overflow-wrap: anywhere;
  color: var(--ss-text-primary);
  font-size: var(--ss-text-sm);
  font-weight: var(--ss-font-bold);
}

.pickup-person__action {
  display: grid;
  flex: 0 0 145px;
  gap: var(--ss-space-1);
  justify-items: stretch;
  text-align: center;
}

.pickup-scope-note,
.pickup-access-denied {
  display: flex;
  align-items: center;
  gap: var(--ss-space-2);
  margin: var(--ss-space-3) 0 0;
  padding: var(--ss-space-3);
  border-radius: var(--ss-radius);
  background: var(--ss-info-bg);
  color: var(--ss-info-text);
  font-size: var(--ss-text-sm);
}

.pickup-scope-note svg,
.pickup-access-denied svg {
  flex: 0 0 19px;
  width: 19px;
}

.pickup-access-denied p {
  margin: 0;
}

.security-mode-tabs {
  display: flex;
  gap: var(--ss-space-2);
  width: min(760px, 100%);
  margin: 0 auto var(--ss-space-4);
  padding: var(--ss-space-1);
  border-radius: var(--ss-radius);
  background: var(--ss-bg-secondary);
}

.security-module-header h2 {
  color: #fff;
}

.security-module-header p {
  color: rgba(255, 255, 255, 0.8);
}

.security-module-header > div > span {
  color: #bfdbfe;
}

.security-module-header .local-draft {
  color: #fff;
}

.security-mode-tabs button {
  display: inline-flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  gap: var(--ss-space-2);
  min-height: 46px;
  padding: 0 var(--ss-space-3);
  border: 0;
  border-radius: var(--ss-radius-sm);
  background: transparent;
  color: var(--ss-text-secondary);
  font: inherit;
  font-size: var(--ss-text-sm);
  font-weight: var(--ss-font-bold);
  cursor: pointer;
}

.security-mode-tabs button.active {
  background: var(--ss-bg-primary);
  color: var(--ss-text-link);
  box-shadow: var(--ss-shadow-sm);
}

.security-mode-tabs button:focus-visible,
.pickup-choice:focus-visible,
.pickup-emergency button:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--ss-text-link) 28%, transparent);
  outline-offset: 2px;
}

.security-mode-tabs svg {
  width: 18px;
}

.pickup-control {
  display: grid;
  gap: var(--ss-space-4);
  width: min(1040px, 100%);
  margin: 0 auto;
  padding: var(--ss-space-3);
  color: var(--ss-text-primary);
  caret-color: var(--ss-text-link);
}

.pickup-control ::selection {
  background: var(--ss-info-bg);
  color: var(--ss-info-text);
}

.pickup-control__header h2 {
  font-size: clamp(var(--ss-text-xl), 3vw, var(--ss-text-3xl));
  letter-spacing: -0.025em;
}

.pickup-boundary {
  gap: var(--ss-space-3);
  padding: var(--ss-space-3) var(--ss-space-4);
  border-radius: var(--ss-radius);
  background: var(--ss-warning-bg);
  color: var(--ss-warning-text);
}

.pickup-boundary svg {
  flex: 0 0 22px;
}

.pickup-boundary p {
  max-width: 72ch;
  margin: 0;
  font-size: var(--ss-text-sm);
  line-height: 1.55;
}

.pickup-preparation-note,
.pickup-inactive-state {
  display: flex;
  align-items: flex-start;
  gap: var(--ss-space-3);
  min-width: 0;
  border-radius: var(--ss-radius-lg);
  background: var(--ss-error-bg);
  color: var(--ss-error-text);
}

.pickup-preparation-note {
  margin: var(--ss-space-4) 0 0;
  padding: var(--ss-space-3) var(--ss-space-4);
  font-size: var(--ss-text-sm);
  font-weight: var(--ss-font-bold);
  line-height: 1.55;
}

.pickup-preparation-note svg,
.pickup-inactive-state > svg {
  flex: 0 0 24px;
}

.pickup-inactive-state {
  min-height: 210px;
  padding: var(--ss-space-6);
  box-shadow: var(--ss-shadow-md);
}

.pickup-inactive-state > svg {
  width: 36px;
  height: 36px;
}

.pickup-inactive-state > div {
  min-width: 0;
}

.pickup-inactive-state h3 {
  margin: 0 0 var(--ss-space-2);
  color: inherit;
  font-size: clamp(var(--ss-text-lg), 2.5vw, var(--ss-text-2xl));
  letter-spacing: -0.02em;
}

.pickup-inactive-state p {
  max-width: 72ch;
  margin: 0;
  color: inherit;
  line-height: 1.65;
  overflow-wrap: anywhere;
}

.pickup-scan-sim {
  justify-content: center;
  gap: var(--ss-space-4);
  min-height: 210px;
  padding: var(--ss-space-6);
  border-radius: var(--ss-radius-lg);
  background: var(--ss-bg-primary);
  box-shadow: var(--ss-shadow-md);
}

.pickup-scan-sim > svg {
  width: 44px;
  height: 44px;
  color: var(--ss-text-link);
}

.pickup-scan-sim .ss-button {
  margin-left: var(--ss-space-4);
}

.pickup-student {
  gap: var(--ss-space-3);
  padding: var(--ss-space-3) var(--ss-space-4);
  border-radius: var(--ss-radius-lg);
  background: var(--ss-bg-brand);
  color: var(--ss-text-inverse);
  box-shadow: var(--ss-shadow-lg);
}

.pickup-student > span {
  display: grid;
  flex: 0 0 54px;
  width: 54px;
  height: 54px;
  place-items: center;
  border-radius: var(--ss-radius);
  background: #fff;
  color: var(--ss-blue-900);
  font-weight: var(--ss-font-extrabold);
}

.pickup-student > div {
  flex: 1;
  min-width: 0;
}

.pickup-student h3 {
  color: #fff;
}

.pickup-student p {
  color: rgba(255, 255, 255, 0.82);
}

.pickup-selector > header {
  margin-bottom: var(--ss-space-3);
}

.pickup-choices {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--ss-space-2);
}

.pickup-choice {
  gap: var(--ss-space-3);
  min-width: 0;
  min-height: 84px;
  padding: var(--ss-space-2);
  border: 0;
  border-radius: var(--ss-radius);
  background: var(--ss-bg-primary);
  color: var(--ss-text-primary);
  box-shadow: var(--ss-shadow-sm);
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.pickup-choice:hover {
  color: var(--ss-text-link);
  box-shadow: var(--ss-shadow-md);
}

.pickup-choice .pickup-photo {
  flex-basis: 58px;
  width: 58px;
}

.pickup-choice > span:not(.ss-badge) {
  display: grid;
  flex: 1;
  min-width: 0;
}

.pickup-choice small {
  margin-top: 2px;
  color: var(--ss-text-secondary);
}

.pickup-decision {
  align-items: stretch;
  gap: var(--ss-space-5);
  padding: var(--ss-space-4);
  border-radius: var(--ss-radius-lg);
  background: var(--ss-bg-primary);
  box-shadow: var(--ss-shadow-lg);
}

.pickup-decision--authorized {
  background: var(--ss-success-bg);
}

.pickup-decision--suspended,
.pickup-decision--unknown {
  background: var(--ss-error-bg);
}

.pickup-decision--verification {
  background: var(--ss-warning-bg);
}

.pickup-photo--large {
  width: min(250px, 34vw);
  min-width: 170px;
}

.pickup-decision__content {
  display: grid;
  align-content: center;
  justify-items: start;
  min-width: 0;
}

.pickup-decision__content > span {
  margin-bottom: var(--ss-space-2);
  color: var(--ss-text-primary);
  font-size: var(--ss-text-sm);
  font-weight: var(--ss-font-extrabold);
  letter-spacing: 0.04em;
}

.pickup-decision__content h3 {
  font-size: var(--ss-text-2xl);
  letter-spacing: -0.02em;
}

.pickup-decision__content .ss-button {
  margin-top: var(--ss-space-4);
}

.pickup-emergency,
.pickup-record,
.pickup-notification {
  padding: var(--ss-space-4);
  border-radius: var(--ss-radius-lg);
  background: var(--ss-bg-primary);
  box-shadow: var(--ss-shadow-md);
}

.pickup-emergency > p {
  margin: var(--ss-space-1) 0 var(--ss-space-3);
  color: var(--ss-text-secondary);
  font-size: var(--ss-text-sm);
}

.pickup-emergency ol {
  display: grid;
  gap: var(--ss-space-2);
  margin: 0;
  padding: 0;
  list-style: none;
}

.pickup-emergency li {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  gap: var(--ss-space-3);
  align-items: center;
  min-height: 52px;
  padding: var(--ss-space-2);
  border-radius: var(--ss-radius-sm);
  background: var(--ss-error-bg);
}

.pickup-emergency li > span {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: var(--ss-radius-full);
  background: var(--ss-error-border);
  color: #fff;
  font-weight: var(--ss-font-extrabold);
}

.pickup-emergency button {
  min-height: 42px;
  padding: 0 var(--ss-space-3);
  border: 1px solid var(--ss-error-border);
  border-radius: var(--ss-radius-sm);
  background: transparent;
  color: var(--ss-error-text);
  font: inherit;
  font-size: var(--ss-text-xs);
  font-weight: var(--ss-font-bold);
  cursor: default;
}

.pickup-record header {
  gap: var(--ss-space-3);
}

.pickup-record header svg {
  color: var(--ss-success-text);
}

.pickup-notification {
  background: var(--ss-info-bg);
  color: var(--ss-info-text);
}

.pickup-notification > span {
  font-size: var(--ss-text-xs);
  font-weight: var(--ss-font-extrabold);
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.pickup-notification h3 {
  margin: var(--ss-space-2) 0 var(--ss-space-1);
}

.pickup-notification p {
  max-width: 70ch;
  margin: 0;
  line-height: 1.55;
}

@media (max-width: 760px) {
  .pickup-section-intro,
  .pickup-control__header,
  .pickup-person,
  .pickup-person__heading,
  .pickup-scan-sim,
  .pickup-inactive-state,
  .pickup-decision {
    align-items: stretch;
    flex-direction: column;
  }

  .pickup-person__action {
    flex-basis: auto;
  }

  .pickup-scan-sim {
    justify-content: flex-start;
    min-height: 0;
    padding: var(--ss-space-4);
  }

  .pickup-inactive-state {
    min-height: 0;
    padding: var(--ss-space-4);
  }

  .pickup-scan-sim .ss-button {
    margin: var(--ss-space-2) 0 0;
  }

  .pickup-choices {
    grid-template-columns: 1fr;
  }

  .pickup-photo--large {
    width: min(100%, 360px);
    min-width: 0;
    max-height: 360px;
  }
}

@media (max-width: 1024px) {
  .pickup-choices {
    grid-template-columns: 1fr;
  }

  .pickup-choice {
    overflow: hidden;
  }
}

@media (max-width: 480px) {
  .security-mode-tabs,
  .pickup-person dl,
  .pickup-record dl {
    grid-template-columns: 1fr;
  }

  .security-mode-tabs {
    display: grid;
  }

  .pickup-control {
    padding: 0;
  }

  .pickup-student {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .pickup-student > div {
    min-width: calc(100% - 70px);
  }

  .pickup-choice {
    align-items: center;
  }

  .pickup-choice .ss-badge {
    flex-basis: 100%;
    margin-left: 70px;
  }

  .pickup-emergency li {
    grid-template-columns: 34px minmax(0, 1fr);
  }

  .pickup-emergency button {
    grid-column: 1 / -1;
  }
}
