.applicant-signup-shell{
  padding:3.5rem 0 4.5rem;
  align-items:flex-start;
  min-height:0;
}
.applicant-signup-card{ max-width:none; }

/* .auth-submit-full now lives in auth.css (shared with the verify-email page) */

/* ---------- Note callout ---------- */
.signup-notice{
  background:var(--paper-2);
  border-left:3px solid var(--gold-500);
  border-radius:4px 10px 10px 4px;
  padding:1.2rem 1.4rem;
  margin-bottom:1.6rem;
}
.signup-notice-label{
  font-family:'IBM Plex Mono', monospace;
  font-size:.75rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--gold-600);
  margin-bottom:.6rem;
  display:flex; align-items:center; gap:.4rem;
}
.signup-notice ul{
  margin:0; padding-left:1.2rem;
  font-size:.88rem; line-height:1.6; color:#3A3550;
}
.signup-notice li{ margin-bottom:.4rem; }
.signup-notice li::marker{ color:var(--gold-600); }
.signup-notice ul ul{ margin-top:.4rem; }

.signup-terms-row{ margin:.4rem 0 1.2rem; }
.signup-terms-row .form-check-label a{ color:var(--indigo-800); font-weight:600; }
.signup-terms-row .form-check-label a:hover{ color:var(--gold-600); }

/* ---------- Phone fields ---------- */
.signup-tel-label{
  font-family:'IBM Plex Mono', monospace;
  font-size:.72rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#6A6480;
  margin-bottom:.4rem;
  display:block;
}
.signup-tel-feedback{
  font-size:.8rem;
  margin-top:.35rem;
  min-height:1.1rem;
}
.signup-tel-feedback.ok{ color:var(--emerald-700); }
.signup-tel-feedback.bad{ color:#B3453E; }

/* ---------- intl-tel-input theming (v29 documented CSS variables only —
   internal .iti__* class names are not a stable API across versions) ---------- */
.applicant-signup-card{
  --iti-border-color: var(--line);
  --iti-border-width: 1px;
  --iti-hover-color: var(--paper-2);
  --iti-country-selector-bg: #fff;
  --iti-icon-color: #8A8499;
}
.iti{ width:100%; }
/* Note: the library manages the input's own padding-left as an inline style
   to make room for the selected-country button — do not override it here. */

/* ---------- Custom file upload dropzone ---------- */
.file-upload-wrap{
  position:relative;
  min-height:5rem;
  border:1.5px dashed var(--line);
  border-radius:12px;
  padding:.9rem 1rem;
  background:var(--paper);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  overflow:hidden;
  transition:border-color .15s ease, background .15s ease;
}
.file-upload-wrap:hover{ border-color:var(--gold-500); background:var(--paper-2); }
.file-upload-wrap.dragover{
  border-color:var(--gold-500);
  background:var(--paper-2);
  box-shadow:0 0 0 3px rgba(214,160,63,.14);
}
.file-upload-wrap.has-file{
  border-style:solid;
  border-color:var(--emerald-700);
  background:#fff;
}

/* The native <input type="file"> is moved inside this wrapper by JS and
   stretched invisibly over it, so the whole styled box is clickable and
   still supports native drag-and-drop. */
.file-upload-wrap input[type="file"]{
  position:absolute;
  inset:0;
  width:100%; height:100%;
  opacity:0;
  cursor:pointer;
  z-index:1;
  margin:0 !important;
}

.file-upload-empty{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:.4rem;
  color:#8A8499;
  font-size:.8rem;
  line-height:1.4;
  pointer-events:none;
}
.file-upload-empty i{
  font-size:1.5rem;
  color:var(--gold-600);
}
.file-upload-wrap.has-file .file-upload-empty{ display:none; }

.file-upload-filename-row{
  display:none;
  align-items:center;
  gap:.6rem;
  width:100%;
  position:relative;
  z-index:2;
}
.file-upload-wrap.has-file .file-upload-filename-row{ display:flex; }

.file-upload-icon-chip{
  flex:none;
  width:2.1rem; height:2.1rem;
  border-radius:8px;
  background:rgba(31,107,79,.1);
  color:var(--emerald-700);
  display:flex; align-items:center; justify-content:center;
  font-size:1rem;
}

/* This is the key fix: the filename is constrained to the available space
   and truncated with an ellipsis instead of overflowing the card/column. */
.file-upload-name{
  flex:1 1 auto;
  min-width:0;
  font-size:.85rem;
  font-weight:500;
  color:var(--ink);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.file-upload-remove{
  flex:none;
  background:none;
  border:none;
  color:#8A8499;
  font-size:1.1rem;
  line-height:1;
  padding:.15rem;
  cursor:pointer;
  transition:color .15s ease;
}
.file-upload-remove:hover{ color:#B3453E; }

@media (max-width: 575px){
  .applicant-signup-card{ padding:2rem 1.4rem 1.8rem; }
}
