リマインダー通知設定

<div class="d10-02-12-box">
          <div class="d10-02-12-row">
            <span class="d10-02-12-lbl">前日リマインダー</span>
            <button class="d10-02-12-sw" type="button" aria-pressed="true"><span class="d10-02-12-kb"></span></button>
          </div>
          <div class="d10-02-12-row">
            <span class="d10-02-12-lbl">通知タイミング</span>
            <select class="d10-02-12-sel">
              <option>1時間前</option>
              <option selected>前日 18:00</option>
              <option>3日前</option>
            </select>
          </div>
          <p class="d10-02-12-note">設定に応じて「<b class="d10-02-12-when">前日 18:00</b>」にお知らせします。</p>
        </div>

.d10-02-12-box{width:240px;background:#fff;border:1px solid #e2e8f0;border-radius:14px;padding:16px 18px;box-shadow:0 8px 20px rgba(30,41,59,.08)}
        .d10-02-12-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0}
        .d10-02-12-lbl{font-size:12.5px;color:#334155;font-weight:600}
        .d10-02-12-sw{width:40px;height:22px;border-radius:11px;border:none;background:#6366f1;position:relative;cursor:pointer;padding:0}
        .d10-02-12-sw[aria-pressed="false"]{background:#cbd5e1}
        .d10-02-12-kb{position:absolute;top:2px;left:20px;width:18px;height:18px;border-radius:50%;background:#fff;transition:left .2s;box-shadow:0 1px 3px rgba(0,0,0,.3)}
        .d10-02-12-sw[aria-pressed="false"] .d10-02-12-kb{left:2px}
        .d10-02-12-sel{border:1px solid #cbd5e1;border-radius:7px;padding:5px 8px;font-size:11.5px;color:#334155;background:#fff}
        .d10-02-12-note{margin:10px 0 0;font-size:11px;color:#64748b;line-height:1.6}
        .d10-02-12-note b{color:#6366f1}

(function(){
        var root=document.getElementById('item-10-02-12');if(!root)return;
        var sw=root.querySelector('.d10-02-12-sw'),sel=root.querySelector('.d10-02-12-sel'),when=root.querySelector('.d10-02-12-when');
        sw.addEventListener('click',function(){
          var on=sw.getAttribute('aria-pressed')==='true';
          sw.setAttribute('aria-pressed',!on);
        });
        sel.addEventListener('change',function(){when.textContent=sel.value;});
      })();