/* NextSure v63 — targeted fixes requested after v62.
   1) Agency Directory remains vertically scrollable on desktop.
   2) Passport-first Travel flow is clear, editable and responsive.
   3) Smart date hint styling.
*/

/* Agency Directory: keep the search bar fixed inside the view and allow every
   agency card to be reached with a normal vertical scroll. */
@media (min-width: 769px) {
  #peopleView {
    overflow: hidden !important;
    min-height: 0 !important;
  }
  #peopleGrid.ns-people-grid {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: 100% !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    align-content: start !important;
    padding: 4px 12px 26px 4px !important;
    scrollbar-gutter: stable;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }
}
@media (max-width: 768px) {
  #peopleView,
  #peopleGrid.ns-people-grid {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }
}

/* Smart date entry helper. */
.ns-smart-date-hint {
  display: block;
  margin-top: -2px;
  color: #718096;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.45;
}
.ns-date-text::placeholder { color: #94a3b8; font-weight: 700; }

/* Passport-first Travel step. */
.ns-passport-first-card {
  grid-column: 1 / -1;
  padding: 20px !important;
  border: 1px solid #cfe2e7 !important;
  border-radius: 22px !important;
  background: linear-gradient(180deg,#ffffff 0%,#f8fcfd 100%) !important;
  box-shadow: 0 10px 28px rgba(16,48,72,.06);
}
.ns-passport-first-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}
.ns-passport-first-head > div { min-width: 0; }
.ns-passport-first-head span:first-child {
  display: block;
  margin-bottom: 3px;
  color: #07816d;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .12em;
}
.ns-passport-first-head h3 { margin: 0; color: #10213d; font-size: 19px; }
.ns-passport-first-head p { margin: 6px 0 0; color: #65788c; font-size: 12px; line-height: 1.55; }
.ns-passport-privacy {
  flex: 0 0 auto;
  border: 1px solid #bfe6dc;
  border-radius: 999px;
  background: #edfbf7;
  color: #08745f !important;
  padding: 7px 10px;
  font-size: 10px !important;
  letter-spacing: .02em !important;
  white-space: nowrap;
}
.ns-passport-first-upload {
  display: block !important;
  padding: 14px;
  border: 1px dashed #91c8bd;
  border-radius: 16px;
  background: #f4fbf9;
}
.ns-passport-first-upload > span { display: block; color: #25415d; font-size: 12px; font-weight: 900; }
.ns-passport-first-upload input {
  margin-top: 9px !important;
  min-height: 46px;
  padding: 9px !important;
  border: 1px solid #cbdde3;
  border-radius: 12px;
  background: #fff;
}
.ns-passport-scan-row {
  display: grid;
  grid-template-columns: auto minmax(0,1fr);
  gap: 12px;
  align-items: center;
  margin: 12px 0 17px;
}
.ns-passport-scan-btn {
  min-height: 44px;
  border: 0;
  border-radius: 12px;
  padding: 10px 15px;
  background: linear-gradient(135deg,#0b4661,#087e70);
  color: #fff;
  font-weight: 900;
  cursor: pointer;
}
.ns-passport-scan-btn:disabled { opacity: .6; cursor: wait; }
.ns-passport-scan-status {
  min-width: 0;
  border-radius: 12px;
  padding: 10px 12px;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.45;
}
.ns-passport-scan-status.is-info { background: #eef5fa; color: #526c84; }
.ns-passport-scan-status.is-loading { background: #fff7df; color: #835d0c; }
.ns-passport-scan-status.is-success { background: #eafaf4; color: #087258; }
.ns-passport-scan-status.is-error { background: #fff0f0; color: #b83232; }
.ns-passport-manual-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 12px;
}
.ns-passport-manual-grid label { min-width: 0; }
.ns-passport-manual-grid label > span {
  display: block;
  margin-bottom: 7px;
  color: #29405b;
  font-size: 12px;
  font-weight: 900;
}
.ns-passport-manual-grid input:not(.ns-original-date-input) {
  width: 100%;
  min-height: 48px;
  margin-top: 0 !important;
  padding: 11px 13px;
  border: 1px solid #ccd9e3;
  border-radius: 13px;
  background: #fff;
  color: #10213d;
  font: inherit;
}
.ns-passport-manual-grid .ns-date-picker-wrap { margin-top: 0; }
.ns-passport-review-note {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: -4px 0 15px;
  padding: 10px 12px;
  border: 1px solid #d8e8e3;
  border-radius: 13px;
  background: #f4fbf8;
  color: #4b6572;
  font-size: 11px;
  font-weight: 750;
}
.ns-passport-review-note button {
  flex: 0 0 auto;
  border: 0;
  background: transparent;
  color: #087764;
  font-weight: 900;
  cursor: pointer;
  text-decoration: underline;
}

@media (max-width: 820px) {
  .ns-passport-manual-grid { grid-template-columns: 1fr; }
  .ns-passport-scan-row { grid-template-columns: 1fr; }
  .ns-passport-first-head { flex-direction: column; }
  .ns-passport-privacy { align-self: flex-start; }
  .ns-passport-review-note { align-items: flex-start; flex-direction: column; }
}
