/* AI値上げウォッチ /ai-price　変わったらメールで知らせる（登録フォーム）　2026-10-05
   aiprice.css の色と箱の作りをそのまま使う（--sky-d・--line・--sh など）。ここには登録フォームのぶんだけ書く。
   ★クラス名は ap- で閉じてある。ボタンと入力に当てるものは .ap-root を前に付ける（aiprice.css のリセットに負けるため）。
   ★このファイルと aiprice-watch.js・inc/ainews-apwatch.php が登録フォームの一式。 */

.ap-root .ap-watch{margin-top:12px;scroll-margin-top:70px}
.ap-root .ap-watch[hidden]{display:none}

/* 登録フォーム。左に入力、右に「保存するもの」 */
.ap-root .ap-wt{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:0 28px;background:var(--card);border-radius:12px;box-shadow:var(--sh);
  padding:20px 20px 22px;position:relative;overflow:hidden}
.ap-root .ap-wt[hidden]{display:none}
.ap-root .ap-wt::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(96deg,#12b9e8,#3f8ae0)}
.ap-root .ap-wt__l{min-width:0}
.ap-root .ap-wt__lead{margin:0 0 14px;font-size:13.5px;color:#3d4d59;line-height:1.85}
.ap-root .ap-wt__lead b{font-weight:800;color:var(--txt)}
.ap-root .ap-wt__f{display:flex;gap:8px;align-items:stretch;max-width:560px}
.ap-root .ap-wt__in{flex:1;min-width:0;padding:11px 14px;border:1px solid #cfd9e1;background:#fff;border-radius:var(--r2);font-size:16px;line-height:1.5;-webkit-appearance:none;appearance:none}
.ap-root .ap-wt__in:focus{outline:2px solid var(--sky-d);outline-offset:-1px;border-color:var(--sky-d)}
.ap-root .ap-wt__in:disabled{background:#f1f4f7;color:var(--sub)}
.ap-root .ap-wt__b{flex:none;background:var(--ink);color:#fff;padding:11px 20px;border-radius:var(--r2);font-size:14px;font-weight:800;white-space:nowrap;transition:background .15s}
.ap-root .ap-wt__b:hover{background:var(--ink2)}
.ap-root .ap-wt__b:disabled{background:#9aa8b4;cursor:default}
/* 人には見えない欄（機械の書き込みを見分けるため）。画面の外へ出す。display:none にすると機械も飛ばすので使わない */
.ap-root .ap-wt__hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.ap-root .ap-wt__msg{margin:10px 0 0;font-size:13px;line-height:1.8;min-height:23px;color:var(--sub)}
.ap-root .ap-wt__msg-ok{color:#0f6b45;font-weight:700}
.ap-root .ap-wt__msg-ng{color:var(--up);font-weight:700}
.ap-root .ap-wt__note{margin:6px 0 0;font-size:12px;color:var(--sub);line-height:1.75}
.ap-root .ap-wt__note[hidden]{display:none}
.ap-root .ap-wt__r{min-width:0;background:#f7fafc;border-radius:var(--r);padding:14px 16px 14px;align-self:start}
.ap-root .ap-wt__r h3{font-size:12.5px;margin:0 0 6px;color:var(--sub)}
.ap-root .ap-wt__keep{margin:0 0 8px;padding:0;list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 12px;font-size:13px;font-weight:700}
.ap-root .ap-wt__keep li{list-style:none;padding:0 0 0 13px;position:relative;line-height:1.7}
.ap-root .ap-wt__keep li::before{content:"";position:absolute;left:0;top:.72em;width:6px;height:6px;border-radius:1px;background:var(--sky-d)}
.ap-root .ap-wt__n{margin:0;font-size:12px;color:var(--sub);line-height:1.8}
.ap-root .ap-wt__n a{white-space:nowrap}
.ap-root .ap-wt__pp{margin-top:4px}

/* メールのリンクから来たときの結果（登録が完了しました・通知を止めました） */
.ap-root .ap-wland{background:var(--card);border-radius:12px;box-shadow:var(--sh);padding:16px 20px;font-size:14px;line-height:1.85;border-left:4px solid var(--sky-d)}
.ap-root .ap-wland[hidden]{display:none}
.ap-root .ap-wland + .ap-wt{margin-top:12px}
.ap-root .ap-wland b{display:block;font-size:16px;font-weight:800;margin-bottom:2px}
.ap-root .ap-wland-ok{border-left-color:var(--down)}
.ap-root .ap-wland-ng{border-left-color:var(--up)}
.ap-root .ap-wland-wait{color:var(--sub)}
.ap-root .ap-wland__a{display:inline-block;margin-top:6px;font-weight:700}

@media (max-width:900px){
  .ap-root .ap-wt{grid-template-columns:1fr;gap:16px 0}
}
@media (max-width:600px){
  .ap-root .ap-wt{padding:18px 14px 18px}
  .ap-root .ap-wt__f{flex-direction:column;max-width:none}
  .ap-root .ap-wt__b{padding:13px 20px;font-size:15px}
  .ap-root .ap-wland{padding:14px 14px}
}
@media print{
  .ap-root .ap-watch{display:none!important}
}