/*==========================================================
  Laura Bassi Scholarship application form (bassi.php)
  ep-site-v6, 16 September 2026; ep-site-v7, 16 September
  2026. Uses the colour and font variables defined in
  custom-refined.css.
==========================================================*/

/* custom.css turns off scrolling in open modals; this form is long. */
.modal-open .modal.bsa-modal {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
}
.bsa-modal .modal-dialog {
  width: auto;
  max-width: 760px;
  margin: 40px auto;
  padding: 0 16px;
}
.bsa-content {
  overflow: hidden;
  border: 0;
  border-radius: 18px;
  background: var(--ep-paper);
  box-shadow: 0 30px 80px rgba(16, 24, 46, 0.25);
  color: var(--ep-ink);
  font-family: var(--ep-font-body);
  text-align: left;
}

/* Heading */
.bsa-head {
  position: relative;
  padding: 32px 56px 24px;
  border-bottom: 1px solid var(--ep-line);
  background: var(--ep-paper-alt);
  text-align: center;
}
.bsa-avatar {
  display: block;
  width: 72px;
  height: 72px;
  margin: 0 auto 14px;
  border-radius: 50%;
  object-fit: cover;
}
.bsa-head .bsa-title {
  margin: 0;
  color: var(--ep-ink);
  font-family: var(--ep-font-display);
  font-size: 28px;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: 0;
  text-transform: none;
}
.bsa-subtitle {
  margin: 6px 0 0;
  color: var(--ep-ink-soft);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.bsa-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--ep-ink-soft);
  font-size: 30px;
  line-height: 40px;
  cursor: pointer;
}
.bsa-close:hover,
.bsa-close:focus {
  outline: none;
  background: rgba(28, 40, 86, 0.08);
  color: var(--ep-ink);
}

/* Body and sections */
.bsa-body {
  padding: 6px 40px 36px;
}
.bsa-intro {
  margin: 20px 0 0;
  color: var(--ep-ink-soft);
  font-size: 13px;
}
.bsa-form .bsa-section {
  min-width: 0;
  margin: 28px 0 0;
  padding: 0;
  border: 0;
}
.bsa-form .bsa-legend {
  display: block;
  width: 100%;
  margin: 0 0 18px;
  padding: 0 0 8px;
  border: 0;
  border-bottom: 1px solid var(--ep-line);
  color: var(--ep-ink);
  font-family: var(--ep-font-display);
  font-size: 21px;
  font-weight: 500;
  line-height: 1.3;
}
.bsa-row {
  display: flex;
  gap: 18px;
}
.bsa-row > .bsa-field {
  flex: 1 1 0;
  min-width: 0;
}
.bsa-row > .bsa-field-narrow {
  flex: 0 0 190px;
}
.bsa-field {
  margin: 0 0 18px;
}
.bsa-form .bsa-field label,
.bsa-form .bsa-label {
  display: block;
  margin: 0 0 8px;
  color: var(--ep-ink);
  font-family: var(--ep-font-body);
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.45;
  letter-spacing: 0;
  text-transform: none;
}
.bsa-hint {
  margin: -2px 0 10px;
  color: var(--ep-ink-soft);
  font-size: 13px;
  line-height: 1.5;
}

/* Text inputs */
.bsa-form input[type="text"],
.bsa-form input[type="email"],
.bsa-form textarea {
  display: block;
  width: 100%;
  height: 46px;
  margin: 0;
  padding: 0 14px;
  border: 1px solid #c9cad2;
  border-radius: 10px;
  background: var(--ep-paper);
  box-shadow: none;
  color: var(--ep-ink);
  font-family: var(--ep-font-body);
  font-size: 15px;
  -webkit-appearance: none;
  appearance: none;
}
.bsa-form textarea {
  height: auto;
  min-height: 176px;
  padding: 12px 14px;
  line-height: 1.55;
  resize: vertical;
}
.bsa-form input[type="text"]:focus,
.bsa-form input[type="email"]:focus,
.bsa-form textarea:focus {
  outline: none;
  border-color: var(--ep-ink);
  box-shadow: 0 0 0 3px rgba(28, 40, 86, 0.14);
}
.bsa-form .bsa-field.has-error input[type="text"],
.bsa-form .bsa-field.has-error input[type="email"],
.bsa-form .bsa-field.has-error textarea,
.bsa-form .bsa-field.has-error input[type="file"],
.bsa-form .bsa-field.has-error .bsa-choice {
  border-color: #b3261e;
}
.bsa-error {
  margin: 6px 0 0;
  color: #b3261e;
  font-size: 13px;
  line-height: 1.45;
}
.bsa-error:empty {
  display: none;
}
.bsa-count {
  margin: 6px 0 0;
  color: var(--ep-ink-soft);
  font-size: 12.5px;
  text-align: right;
}
.bsa-count.is-over {
  color: #b3261e;
  font-weight: 600;
}

/* Choices (editorial stream, round, first application, partial
   award, fee) */
.bsa-choices {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.bsa-form .bsa-field .bsa-choice {
  display: flex;
  flex: 1 1 200px;
  align-items: flex-start;
  gap: 10px;
  margin: 0;
  padding: 12px 14px;
  border: 1px solid #c9cad2;
  border-radius: 10px;
  background: var(--ep-paper);
  color: var(--ep-ink);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.4;
  cursor: pointer;
}
.bsa-form .bsa-field .bsa-choice:hover,
.bsa-form .bsa-field .bsa-choice.is-checked {
  border-color: var(--ep-ink);
}
.bsa-form .bsa-field .bsa-choice.is-checked {
  background: rgba(28, 40, 86, 0.05);
}
.bsa-form .bsa-choice input {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  margin: 1px 0 0;
  accent-color: var(--ep-ink);
}
.bsa-form .bsa-field .bsa-choice[hidden] {
  display: none !important;
}
.bsa-form .bsa-field .bsa-rounds .bsa-choice,
.bsa-form .bsa-field .bsa-stack .bsa-choice {
  flex-basis: 100%;
}
.bsa-round-name {
  display: block;
  font-weight: 600;
}
.bsa-rounds .bsa-hint {
  margin: 0;
}

/* CV */
.bsa-form input[type="file"]::file-selector-button {
  margin-right: 14px;
  padding: 8px 16px;
  border: 1px solid var(--ep-ink);
  border-radius: 999px;
  background: var(--ep-paper);
  color: var(--ep-ink);
  font-family: var(--ep-font-body);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}
.bsa-form input[type="file"] {
  display: block;
  width: 100%;
  padding: 14px;
  border: 1px dashed #b3b5bf;
  border-radius: 10px;
  background: var(--ep-paper-alt);
  color: var(--ep-ink);
  font-size: 14px;
}
.bsa-files {
  margin: 10px 0 0;
  padding: 0;
  list-style: none;
  font-size: 13.5px;
}
.bsa-files li {
  padding: 3px 0;
}
.bsa-files .bsa-size {
  color: var(--ep-ink-soft);
}

/* Fee */
.bsa-note {
  margin: 0 0 14px;
  font-size: 14.5px;
  line-height: 1.6;
}
.bsa-waiver-note {
  margin: 10px 0 0;
}
.bsa-waiver-note[hidden] {
  display: none;
}

/* Signature date */
.bsa-field-narrow .bsa-hint {
  visibility: hidden;
}
.bsa-date {
  height: 46px;
  margin: 0;
  color: var(--ep-ink);
  font-size: 15px;
  line-height: 46px;
}

/* Hidden field for automated senders */
.bsa-trap {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* Status, progress and submit */
.bsa-status {
  margin: 26px 0 0;
  padding: 12px 14px;
  border-radius: 10px;
  background: #fbeceb;
  color: #8c1d18;
  font-size: 14px;
  line-height: 1.5;
}
.bsa-status:empty {
  display: none;
}
.bsa-progress {
  height: 4px;
  margin: 18px 0 0;
  overflow: hidden;
  border-radius: 2px;
  background: var(--ep-line);
}
.bsa-progress[hidden] {
  display: none;
}
.bsa-progress span {
  display: block;
  width: 0;
  height: 100%;
  background: var(--ep-ink);
  transition: width 0.2s linear;
}
.bsa-form .bsa-submit {
  position: relative;
  display: block;
  width: 100%;
  height: 50px;
  margin: 26px 0 0;
  padding: 0;
  overflow: hidden;
  isolation: isolate;
  border: 0;
  border-radius: 999px;
  background: var(--ep-coral);
  color: #ffffff;
  font-family: var(--ep-font-body);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.03em;
  cursor: pointer;
}
.bsa-submit::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -20%;
  left: -79%;
  width: 70%;
  height: 140%;
  background: var(--ep-ink);
  transform: skewX(50deg);
  transition: width 0.55s cubic-bezier(0.76, 0, 0.24, 1);
}
.bsa-submit:hover::before,
.bsa-submit:focus::before {
  width: 250%;
}
.bsa-submit:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(28, 40, 86, 0.25);
}
.bsa-submit[disabled] {
  cursor: progress;
  opacity: 0.7;
}
.bsa-submit[disabled]::before {
  width: 0;
}
.bsa-after {
  margin: 12px 0 0;
  color: var(--ep-ink-soft);
  font-size: 13px;
  text-align: center;
}
.bsa-after[hidden] {
  display: none;
}

@media (max-width: 640px) {
  .bsa-modal .modal-dialog {
    max-width: none;
    margin: 0;
    padding: 0;
  }
  .bsa-content {
    min-height: 100vh;
    border-radius: 0;
  }
  .bsa-head {
    padding: 26px 52px 20px;
  }
  .bsa-head .bsa-title {
    font-size: 24px;
  }
  .bsa-body {
    padding: 2px 20px 32px;
  }
  .bsa-row {
    flex-direction: column;
    gap: 0;
  }
  .bsa-row > .bsa-field-narrow {
    flex-basis: auto;
  }
  .bsa-field-narrow .bsa-hint {
    display: none;
  }
  .bsa-date {
    height: auto;
    line-height: 1.5;
  }
}

/* Bassi Foundation Press award (ep-site-v18, 1 October 2026): the box and,
   once it is ticked, the field for the book proposal. */
.bsa-form .bsa-field[hidden] {
  display: none !important;
}
.bsa-hint a {
  color: var(--ep-ink);
  text-decoration: underline;
}
.bsa-hint a:hover,
.bsa-hint a:focus {
  color: var(--ep-ink);
  text-decoration: none;
}

/* The Award Amounts table above the form, on the same page: the Bassi
   Foundation Press row stands at the foot of the table and is set slightly
   apart from the three editorial awards, with a heavier rule and a warm
   tint (client, 1 October 2026). ep-site-v21: the tint is about a fifth of
   the site's coral (#f8a993) on white. The first, about a tenth (#fdf6f2),
   could not be seen on the client's screen. */
.ep-fee-box .ep-fee-table tbody tr.ep-fee-row-press td {
  border-top: 2px solid #eadbd2;
  background: #feeee9;
}

/* An application for the Bassi Foundation Press award alone (ep-site-v19):
   whatever the form hides is hidden, whatever display it otherwise has. */
.bsa-form [hidden] {
  display: none !important;
}

/* Creative Writing (ep-site-v20): an optional section, closed when the form
   opens and opened by a click on its heading. The heading keeps the look of
   the other section headings and carries the + and minus sign of the Bassi
   Scholars list on the same page. */
.bsa-form .bsa-optional > summary.bsa-legend {
  position: relative;
  padding-right: 32px;
  list-style: none;
  cursor: pointer;
}
.bsa-form .bsa-optional > summary.bsa-legend::-webkit-details-marker {
  display: none;
}
.bsa-form .bsa-optional > summary.bsa-legend::after {
  content: "+";
  position: absolute;
  top: 4px;
  right: 4px;
  width: 18px;
  color: var(--ep-coral-dark);
  font-family: var(--ep-font-body);
  font-size: 20px;
  line-height: 1;
  text-align: center;
}
.bsa-form .bsa-optional[open] > summary.bsa-legend::after {
  content: "\2212";
}
.bsa-form .bsa-optional > summary.bsa-legend:focus-visible {
  outline: 2px solid var(--ep-ink);
  outline-offset: 2px;
}
/* A details element lets the bottom margin of its last field run out
   through its foot, which a fieldset does not; the space under the section
   is set by padding instead, so that it matches the other sections whether
   the section is open or closed. */
.bsa-form .bsa-optional {
  padding-bottom: 18px;
}
.bsa-form .bsa-optional > .bsa-field {
  margin-bottom: 0;
}
.bsa-form .bsa-optional:not([open]) > summary.bsa-legend {
  margin-bottom: 0;
}

/* The Bassi Foundation Press award (ep-site-v21) is an optional section of
   the same kind for an applicant for the scholarship. Its two fields keep
   the space between them that the rule above takes from the first. For an
   applicant for the Press award alone the section is required: it stays
   open, and its heading is an ordinary heading, without the sign. */
.bsa-form .bsa-optional > .bsa-field:not([hidden]) + .bsa-field:not([hidden]) {
  margin-top: 18px;
}
.bsa-form .bsa-optional.is-required > summary.bsa-legend {
  cursor: default;
}
.bsa-form .bsa-optional.is-required > summary.bsa-legend::after {
  content: none;
}
