/* 演題登録フォーム スタイル（テーマとの衝突を避けるため .ar- を接頭辞にしています） */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@500;700&family=Noto+Sans+JP:wght@400;500;700&display=swap');

.ar-wrapper {
  --ar-color-indigo: #1C2B4A;
  --ar-color-indigo-dark: #121D33;
  --ar-color-indigo-tint: #EEF1F6;
  --ar-color-vermillion: #B7472A;
  --ar-color-vermillion-dark: #8F3620;
  --ar-color-vermillion-tint: #FBEDE8;
  --ar-color-surface: #FFFFFF;
  --ar-color-line: #E2DED2;
  --ar-color-text: #22242B;
  --ar-color-text-muted: #5E6270;
  --ar-font-display: 'Noto Serif JP', serif;
  --ar-font-body: 'Noto Sans JP', 'Hiragino Sans', 'Yu Gothic', sans-serif;
  --ar-radius: 6px;
  --ar-max-width: 760px;

  max-width: var(--ar-max-width);
  margin: 0 auto;
  font-family: var(--ar-font-body);
  color: var(--ar-color-text);
  line-height: 1.7;
  font-size: 15px;
  -webkit-font-smoothing: antialiased;
}
.ar-wrapper * { box-sizing: border-box; }
.ar-wrapper button, .ar-wrapper input, .ar-wrapper select, .ar-wrapper textarea { font-family: inherit; }

/* ---------- ヘッダー ---------- */
.ar-site-header { margin-bottom: 28px; }
.ar-conference-name { font-size: 13px; color: var(--ar-color-text-muted); margin: 0 0 10px; }
.ar-page-title {
  font-family: var(--ar-font-display); font-size: 30px; font-weight: 700;
  color: var(--ar-color-indigo); margin: 0 0 14px; line-height: 1.5;
}
.ar-lead { color: var(--ar-color-text-muted); font-size: 15px; margin: 0; max-width: 58ch; }

/* ---------- honeypot ---------- */
.ar-honeypot-wrap { position: absolute; left: -9999px; top: -9999px; height: 0; overflow: hidden; }

/* ---------- step indicator ---------- */
.ar-step-indicator { display: flex; align-items: center; margin: 0 0 26px; }
.ar-step { display: flex; align-items: center; gap: 8px; color: var(--ar-color-text-muted); }
.ar-step-num {
  width: 26px; height: 26px; border-radius: 50%; border: 1.5px solid var(--ar-color-line);
  display: flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 600; flex-shrink: 0; background: var(--ar-color-surface);
}
.ar-step.ar-active .ar-step-num { border-color: var(--ar-color-vermillion); color: var(--ar-color-vermillion); }
.ar-step.ar-done .ar-step-num { background: var(--ar-color-indigo); border-color: var(--ar-color-indigo); color: #fff; }
.ar-step-label { font-size: 13px; white-space: nowrap; }
.ar-step.ar-active .ar-step-label { color: var(--ar-color-indigo); font-weight: 600; }
.ar-step-line { flex: 1; height: 1px; background: var(--ar-color-line); margin: 0 12px; }

/* ---------- card ---------- */
.ar-card {
  background: var(--ar-color-surface); border: 1px solid var(--ar-color-line);
  border-radius: var(--ar-radius); padding: 36px; position: relative; overflow: hidden;
}
.ar-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--ar-color-vermillion); }

.ar-view { display: none; }
.ar-view.ar-active { display: block; animation: ar-fade-in .25s ease; }
@keyframes ar-fade-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }

.ar-view-heading { font-family: var(--ar-font-display); font-size: 21px; font-weight: 700; color: var(--ar-color-indigo); margin: 0 0 14px; }

/* ---------- error summary ---------- */
.ar-error-summary {
  background: var(--ar-color-vermillion-tint); border: 1px solid var(--ar-color-vermillion);
  color: var(--ar-color-vermillion-dark); border-radius: 4px; padding: 14px 16px; margin-bottom: 26px;
  font-size: 14px; display: none;
}
.ar-error-summary.ar-show { display: block; }

/* ---------- fields ---------- */
.ar-field { margin-bottom: 26px; }
.ar-field > label { display: block; font-weight: 600; font-size: 14px; margin-bottom: 9px; color: var(--ar-color-text); }
.ar-checkbox-label { display: flex !important; align-items: center; gap: 8px; cursor: pointer; }
.ar-checkbox-label input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--ar-color-indigo); }

.ar-field-group { margin-bottom: 26px; }
.ar-field-group-heading { font-weight: 600; font-size: 14px; margin: 0 0 6px; color: var(--ar-color-text); }
.ar-field-group > .ar-field-hint { margin: 0 0 18px; }

.ar-required {
  display: inline-block; font-size: 11px; font-weight: 600; color: var(--ar-color-vermillion);
  background: var(--ar-color-vermillion-tint); padding: 2px 7px; border-radius: 3px; margin-left: 7px; vertical-align: middle;
}
.ar-optional { display: inline-block; font-size: 11px; color: var(--ar-color-text-muted); margin-left: 7px; vertical-align: middle; }

.ar-wrapper input[type="text"], .ar-wrapper input[type="email"], .ar-wrapper select, .ar-wrapper textarea {
  width: 100%; padding: 11px 13px; border: 1px solid var(--ar-color-line); border-radius: 4px;
  font-size: 15px; color: var(--ar-color-text); background: var(--ar-color-surface);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.ar-wrapper select {
  appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='9'><path d='M1 1l6 6 6-6' stroke='%235E6270' stroke-width='1.6' fill='none' fill-rule='evenodd'/></svg>");
  background-repeat: no-repeat; background-position: right 14px center; padding-right: 36px;
}
.ar-wrapper input:focus, .ar-wrapper select:focus, .ar-wrapper textarea:focus {
  outline: none; border-color: var(--ar-color-indigo); box-shadow: 0 0 0 3px rgba(28,43,74,0.08);
}
.ar-wrapper input.ar-invalid, .ar-wrapper select.ar-invalid, .ar-wrapper textarea.ar-invalid { border-color: var(--ar-color-vermillion); }
.ar-wrapper textarea { min-height: 170px; resize: vertical; line-height: 1.75; }

.ar-error-text { color: var(--ar-color-vermillion-dark); font-size: 13px; margin: 7px 0 0; display: none; }
.ar-error-text.ar-show { display: block; }
.ar-field-hint { font-size: 13px; color: var(--ar-color-text-muted); margin: 8px 0 0; }

/* ---------- 所属リスト ---------- */
.ar-affiliation-row { display: grid; grid-template-columns: auto 1fr auto; gap: 10px; margin-bottom: 10px; align-items: center; }
.ar-affiliation-number { font-weight: 600; color: var(--ar-color-text-muted); min-width: 20px; text-align: right; }
.ar-btn-remove {
  background: none; border: none; color: var(--ar-color-text-muted); font-size: 20px; line-height: 1;
  cursor: pointer; width: 40px; height: 40px; border-radius: 4px;
}
.ar-btn-remove:hover { color: var(--ar-color-vermillion-dark); background: var(--ar-color-vermillion-tint); }

.ar-btn-add {
  background: none; border: 1px dashed var(--ar-color-line); color: var(--ar-color-indigo);
  padding: 9px 16px; border-radius: 4px; font-size: 13px; font-weight: 600; cursor: pointer;
}
.ar-btn-add:hover { border-color: var(--ar-color-indigo); background: var(--ar-color-indigo-tint); }
.ar-btn-add:disabled { opacity: .5; cursor: not-allowed; border-style: solid; }
.ar-btn-add:disabled:hover { background: none; }

/* ---------- 演者・共同演者リスト ---------- */
.ar-presenter-row { border: 1px solid var(--ar-color-line); border-radius: 4px; padding: 14px 16px; margin-bottom: 12px; }
.ar-presenter-row-header { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.ar-presenter-badge {
  flex-shrink: 0; font-size: 12px; font-weight: 600; color: var(--ar-color-indigo);
  background: var(--ar-color-indigo-tint); padding: 4px 10px; border-radius: 3px;
}
.ar-presenter-row-header .ar-presenter-name { flex: 1; }
.ar-affiliation-checks { display: flex; flex-wrap: wrap; gap: 6px 16px; padding-left: 2px; }
.ar-affiliation-check { display: flex; align-items: center; gap: 5px; font-size: 14px; font-weight: 400; cursor: pointer; }
.ar-affiliation-check input[type="checkbox"] { accent-color: var(--ar-color-indigo); width: 16px; height: 16px; }
.ar-no-affiliations { font-size: 13px; color: var(--ar-color-text-muted); margin: 0; }

/* ---------- abstract input ---------- */
.ar-char-counter { text-align: right; font-size: 13px; color: var(--ar-color-text-muted); margin: 7px 0 0; }
.ar-char-counter.ar-over-limit { color: var(--ar-color-vermillion-dark); font-weight: 600; }

/* ---------- 印刷イメージプレビュー ---------- */
.ar-print-preview {
  border: 1px solid var(--ar-color-line); border-radius: 4px; padding: 32px 36px; margin-bottom: 8px;
  background: #fff; font-family: var(--ar-font-display);
}
.ar-print-meta { font-size: 12px; color: var(--ar-color-vermillion-dark); margin: 0 0 14px; font-family: var(--ar-font-body); }
.ar-print-title-row { display: flex; align-items: flex-start; gap: 16px; margin: 0 0 18px; }
.ar-print-number-box {
  flex-shrink: 0;
  font-family: var(--ar-font-body); font-size: 14px; font-weight: 600; color: var(--ar-color-text-muted);
  min-width: 70px; text-align: center; line-height: 1.4;
}
.ar-print-title {
  font-size: 19px !important; font-weight: 700 !important; text-align: center !important;
  color: #FFFFFF !important; line-height: 1.6 !important;
  background-color: var(--ar-color-indigo) !important;
  flex: 1; margin: 6px 0 !important; position: relative;
  border: none !important; border-radius: 0 !important;
  padding: 14px 20px !important; box-sizing: border-box !important;
  display: flex !important; align-items: center; justify-content: center; min-height: 62px;
}
.ar-print-title::before, .ar-print-title::after {
  content: ''; position: absolute; left: 0; right: 0; height: 1.5px;
  background-color: var(--ar-color-indigo);
}
.ar-print-title::before { top: -6px; }
.ar-print-title::after { bottom: -6px; }
.ar-print-authors { text-align: center; font-size: 15px; margin: 0 0 6px; }
.ar-print-authors sup { color: var(--ar-color-vermillion-dark); font-weight: 600; }
.ar-print-affiliations { text-align: center; font-size: 12px; color: var(--ar-color-text-muted); margin: 0 0 20px; font-family: var(--ar-font-body); }
.ar-nowrap-unit { white-space: nowrap; } /* 氏名+所属番号、各所属の1件が途中で改行されないようにする */
.ar-print-preview hr { border: none; border-top: 1px solid var(--ar-color-line); margin: 0 0 20px; }
.ar-print-body { font-family: var(--ar-font-body); font-size: 14px; line-height: 1.9; white-space: pre-wrap; word-break: break-word; color: var(--ar-color-text); }

/* ---------- buttons ---------- */
.ar-btn-primary, .ar-btn-secondary {
  font-size: 15px; font-weight: 600; padding: 13px 30px; border-radius: 4px; cursor: pointer; border: 1px solid transparent;
  transition: background-color .15s ease, border-color .15s ease, opacity .15s ease;
}
.ar-btn-primary { background: var(--ar-color-vermillion); color: #fff; }
.ar-btn-primary:hover { background: var(--ar-color-vermillion-dark); }
.ar-btn-primary:disabled { opacity: .6; cursor: default; }
.ar-btn-secondary { background: transparent; color: var(--ar-color-indigo); border-color: var(--ar-color-indigo); }
.ar-btn-secondary:hover { background: var(--ar-color-indigo-tint); }

.ar-form-actions { margin-top: 34px; display: flex; justify-content: flex-end; }
.ar-preview-actions { margin-top: 34px; display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; }

/* ---------- preview (dl) ---------- */
.ar-preview-note { color: var(--ar-color-text-muted); font-size: 14px; margin: 0 0 26px; }

/* ---------- confirm ---------- */
.ar-confirm-view { text-align: center; padding: 10px 0 4px; }
.ar-confirm-icon {
  width: 54px; height: 54px; border-radius: 50%; background: var(--ar-color-indigo); color: #fff;
  display: flex; align-items: center; justify-content: center; font-size: 24px; margin: 0 auto 22px;
}
.ar-ref-label { font-size: 13px; color: var(--ar-color-text-muted); margin: 26px 0 4px; }
.ar-reference-number {
  font-family: var(--ar-font-display); font-size: 26px; font-weight: 700;
  color: var(--ar-color-indigo); margin: 0 0 26px; letter-spacing: 0.03em;
}
.ar-confirm-note { color: var(--ar-color-text-muted); font-size: 14px; max-width: 42ch; margin: 0 auto 30px; }

.ar-edit-link-box { background: var(--ar-color-indigo-tint); border-radius: 4px; padding: 18px 20px; text-align: left; margin-top: 8px; }
.ar-edit-link-label { font-size: 13px; color: var(--ar-color-text-muted); margin: 0 0 8px; }
.ar-edit-link { display: block; font-size: 14px; color: var(--ar-color-indigo); word-break: break-all; text-decoration: underline; }
.ar-edit-link:hover { color: var(--ar-color-vermillion-dark); }

.ar-edit-mode-note { background: var(--ar-color-vermillion-tint); color: var(--ar-color-vermillion-dark); border-radius: 4px; padding: 12px 14px; font-size: 14px; margin: 0 0 24px; }

.ar-invalid-link-card { text-align: center; }
.ar-invalid-link-card p { color: var(--ar-color-text-muted); }

@media (max-width: 640px) {
  .ar-page-title { font-size: 24px; }
  .ar-card { padding: 22px; }
  .ar-affiliation-row { grid-template-columns: auto 1fr auto; }
  .ar-btn-remove { justify-self: end; }
  .ar-step-label { display: none; }
  .ar-form-actions .ar-btn-primary { width: 100%; }
  .ar-preview-actions { flex-direction: column-reverse; }
  .ar-preview-actions .ar-btn-primary, .ar-preview-actions .ar-btn-secondary { width: 100%; text-align: center; }
  .ar-print-preview { padding: 20px 18px; }
}

/* ============================================================
   管理者向け閲覧専用プレビューページ
   ============================================================ */
.ar-preview-toolbar {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  margin: 0 0 14px;
}
.ar-preview-toolbar-note { margin: 0; font-size: 13px; color: var(--ar-color-text-muted); }
.ar-print-number-box.ar-has-number { font-size: 20px; font-weight: 700; color: var(--ar-color-indigo); }

/* 印刷：navy背景・飾り線も色付きのまま印刷する */
@media print {
  .ar-print-title, .ar-print-title::before, .ar-print-title::after {
    -webkit-print-color-adjust: exact; print-color-adjust: exact;
  }
  .ar-preview-toolbar { display: none !important; }
  /* JavaScript(preview.js)が印刷直前に付けるクラスを使い、抄録部分以外
     （サイトのヘッダー・フッター・サイドバー等）を非表示にして1ページに収める */
  html.ar-print-mode body *:not(.ar-print-keep):not(.ar-print-page-root):not(.ar-print-page-root *) {
    display: none !important;
  }
  html.ar-print-mode .ar-print-preview { border: none; }
}
