/* フォーム部品のみ。**単独ページでも園ページへの埋め込みでも同じものを読む**ので、
   :root / body / * のような大域セレクタは書かない（埋め込み先の見た目を壊さないため）。
   色・書体は変数で受け、埋め込み先に無いときのフォールバックを併記する。 */

.ef-lead{color:var(--ink-2,#555); font-size:14px; margin-bottom:28px}
.ef-lead p{margin:0 0 10px}
.ef-small{font-size:12.5px; color:var(--ink-3,#888)}

.ef-note{border-radius:var(--radius-sm,10px); padding:14px 16px; margin:0 0 24px; font-size:14px}
.ef-note p{margin:0 0 8px} .ef-note p:last-child{margin:0}
.ef-note ul{margin:8px 0 0; padding-left:20px}
.ef-ok{background:var(--leaf,#eaf5ea)}
.ef-err{background:var(--accent-soft,#fbeaea); color:var(--ink,#222)}

.ef-form{display:flex; flex-direction:column; gap:22px; margin:0}
.ef-f{display:block; border:0; padding:0; margin:0; min-width:0}
.ef-l{display:block; font-weight:700; font-size:14px; padding:0; color:var(--ink,#222)}
.ef-req{font-style:normal; font-size:11px; color:var(--accent,#b3261e); margin-left:8px;
  border:1px solid currentColor; border-radius:4px; padding:0 4px; vertical-align:2px}
.ef-help{display:block; font-size:12.5px; color:var(--ink-3,#888); line-height:1.7; margin:2px 0 6px}
.ef-row{display:flex; gap:16px; flex-wrap:wrap}
.ef-row .ef-f{flex:1 1 200px}

.ef-form input[type=text], .ef-form input[type=url], .ef-form textarea{
  width:100%; background:var(--card,#fff); color:var(--ink,#222);
  border:1px solid var(--rule,#ddd); border-radius:var(--radius-sm,10px);
  padding:11px 13px; font-family:inherit; font-size:16px; /* iOSの自動ズーム回避 */
  line-height:1.7; margin-top:4px}
.ef-form textarea{line-height:1.8; resize:vertical}

.ef-chips{display:flex; flex-wrap:wrap; gap:8px; margin-top:6px}
.ef-chip{position:relative; display:inline-flex}
.ef-chip input{position:absolute; opacity:0; width:100%; height:100%; margin:0; cursor:pointer}
.ef-chip span{display:inline-block; padding:9px 15px; border-radius:999px;
  border:1px solid var(--rule,#ddd); background:var(--card,#fff); font-size:14px;
  color:var(--ink-2,#555); transition:background .15s, border-color .15s, color .15s}
.ef-chip input:checked + span{background:var(--accent,#b3261e); border-color:var(--accent,#b3261e);
  color:#fff; font-weight:700}
.ef-chip input:focus-visible + span{outline:2px solid var(--focus,#b3261e); outline-offset:2px}

.ef-check{display:flex; gap:12px; align-items:flex-start; background:var(--paper-2,#f4f2f0);
  border-radius:var(--radius-sm,10px); padding:14px 16px; font-size:14px; color:var(--ink,#222)}
.ef-check input{margin-top:6px; width:20px; height:20px; flex:none; accent-color:var(--accent,#b3261e)}
.ef-check small{color:var(--ink-3,#888); font-size:12.5px; line-height:1.7; display:block; margin-top:4px}

.ef-privacy{font-size:12.5px; color:var(--ink-3,#888); line-height:1.8;
  border-top:1px solid var(--rule,#ddd); padding-top:14px}
.ef-privacy ul{margin:6px 0 0; padding-left:18px}

.ef-submit{appearance:none; border:0; border-radius:999px;
  background:var(--accent,#b3261e); color:#fff;
  font-family:var(--font-display,sans-serif); font-weight:800; font-size:16px;
  padding:15px 24px; cursor:pointer; width:100%}
.ef-submit:hover{filter:brightness(1.06)}
.ef-submit[disabled]{opacity:.55; cursor:progress}
.ef-back{display:inline-block; font-size:14px}

/* honeypot: 目にも支援技術にも触れさせない（tabindex=-1 と aria-hidden は HTML 側） */
.ef-hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}

/* 園ページに埋め込むとき（embed.js が使う） */
.ef-embed{border:1px solid var(--rule,#ddd); border-radius:var(--radius,16px);
  padding:18px; background:var(--card,#fff); font-size:14.5px; line-height:1.9}
.ef-embed .ef-form{gap:18px}
.ef-embed .ef-lead{margin-bottom:18px}
.ef-embed h2{font-family:var(--font-display,sans-serif); font-size:16px; margin:0 0 8px;
  color:var(--ink,#222)}
.ef-cta{display:inline-block; border:1px solid var(--rule,#ddd); border-radius:999px;
  padding:10px 18px; font-size:14px; text-decoration:none; background:var(--card,#fff)}