/* 勉強会ページのCF7用補助CSS。functions.phpから条件付きで読み込みます。
   CF7本体のレイヤー外CSSに対応するため、この補助CSSもレイヤー外で、
   #seminar-form内の専用クラスだけへ適用します。 */
#seminar-form .seminar-form__cf7-control {
  grid-column: 3;
  min-width: 0;
}

/* Advertising form annotations; keep the label columns and field sizes intact. */
#seminar-form .seminar-form__required-note {
  margin: 0 0 1.2rem;
  text-align: right;
  color: #b52b38;
  font-size: 1.4rem;
  line-height: 1.6;
}
#seminar-form .seminar-form__required { color: #b52b38; }
#seminar-form .seminar-form__label { position: relative; }
#seminar-form .seminar-form__label > .seminar-form__required {
  position: absolute;
  top: 0;
  left: calc(100% + .5rem);
}
#seminar-form .seminar-form__control::placeholder {
  color: #777;
  opacity: 1;
}
/* CF7 first_as_label uses an empty option; selection/reset updates :checked. */
#seminar-form select.seminar-form__control:has(option[value=""]:checked) {
  color: #777;
}
#seminar-form select.seminar-form__control option {
  color: #000;
}
#seminar-form select.seminar-form__control option[value=""] {
  color: #777;
}
@media (max-width: 600px) {
  #seminar-form .seminar-form__label > .seminar-form__required {
    position: static;
    margin-left: .3em;
  }
}

/* Keep the select arrow 16px inside the field on desktop and mobile. */
#seminar-form select.seminar-form__control {
  -webkit-appearance: none;
  appearance: none;
  padding-right: 44px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='m1 1 4 4 4-4' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  background-size: 10px 6px;
}

@media (forced-colors: active) {
  #seminar-form select.seminar-form__control {
    -webkit-appearance: auto;
    appearance: auto;
    background-image: none;
  }
}

/* CF7の自動段落がラベルを包む場合も、既存のグリッド列と縦位置を保つ。 */
#seminar-form .wpcf7 .seminar-form__row > p {
  grid-column: 1;
  margin: 0;
}

#seminar-form .wpcf7 .seminar-form__label {
  display: block;
}

#seminar-form .seminar-form__cf7-control > p {
  margin: 0;
}

#seminar-form .seminar-form__cf7-control .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
}

#seminar-form .seminar-form__cf7-consent .wpcf7-list-item {
  margin: 0;
}

#seminar-form .seminar-form__cf7-consent .wpcf7-list-item label {
  display: inline-flex;
  align-items: center;
  gap: 0.754rem;
  font-family: var(--font-family-base);
  font-size: 1.6rem;
  line-height: 3rem;
  letter-spacing: 0.1em;
  cursor: pointer;
}

#seminar-form .seminar-form__cf7-submit {
  position: relative;
}

/* Native CF7 Turnstile tag is placed between consent and the submit button. */
#seminar-form .seminar-form__turnstile {
  display: flex;
  justify-content: center;
  margin-top: 2.4rem;
}
#seminar-form .seminar-form__turnstile > p {
  flex-shrink: 0;
  margin: 0;
}
#seminar-form .seminar-form__turnstile .wpcf7-turnstile {
  flex-shrink: 0;
}
#seminar-form .seminar-form__turnstile + .seminar-form__submit {
  margin-top: 2.4rem;
}

#seminar-form .seminar-form__cf7-submit > p {
  margin: 0;
}

#seminar-form .seminar-form__cf7-submit .wpcf7-spinner {
  position: absolute;
  top: calc(100% + 1rem);
  left: calc(50% - 12px);
  margin: 0;
}

#seminar-form .seminar-form__cf7-submit input[type="submit"]:not(:disabled) {
  cursor: pointer;
}

#seminar-form .wpcf7-response-output {
  max-width: min(83.67rem, calc(100% - 4rem));
  margin: 4rem auto 0;
  font-size: 1.6rem;
  line-height: 1.7;
}

@media (max-width: 600px) {
  #seminar-form .seminar-form__cf7-control {
    grid-column: 1;
  }
}
