/* =========================
   Root & Overlay
========================== */
.agx-modal{
  position:fixed;
  inset:0;
  z-index:99999999;
  display:none;
}
.agx-modal.is-open{display:block;}
.agx-modal[aria-hidden="true"]{display:none;}

.agx-overlay{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.35);
  -webkit-backdrop-filter:blur(18px) saturate(120%);
  backdrop-filter:blur(18px) saturate(120%);
}

/* =========================
   Panel (Desktop / Default)
========================== */
.agx-panel{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:100%;
  max-width:550px;
  padding:0;
  background:#fff;
  border-radius:8px;
  box-shadow:0 24px 70px rgba(0,0,0,.35);
  overflow:hidden;
}

.agx-inner{
  padding:44px;
  text-align:center;
  background:#fff;
}

/* =========================
   Typography
========================== */
.agx-only{
  font-family:Geist, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  font-size:13px;
  font-weight:400;
  letter-spacing:.06em;
  color:rgba(17,17,17,.75);
}

.agx-title{
  margin:16px 0 0;
  font-family:Figtree, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  font-size:40px;
  font-weight:800;
  line-height:1.05;
  color:#111;
}

.agx-text{
  margin:16px auto 0;
  max-width:640px;
  font-family:Figtree, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  font-size:18px;
  line-height:1.6;
  color:rgba(17,17,17,.72);
}

.agx-text-strong strong{
  font-weight:800;
  color:rgba(17,17,17,.85);
}

/* =========================
   Actions & Buttons (isolated)
========================== */
.agx-actions{
  display:flex;
  justify-content:center;
  gap:1.6rem;
  margin-top:28px;
}

/* ✅ all:unset 避免主题按钮样式污染 */
.agx-actions .agx-btnYes,
.agx-actions .agx-btnNo{
  all:unset;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:center;

  width:320px;
  height:48px;
  padding:12px 32px;

  font-family:Figtree, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  font-size:15.4px;
  font-weight:700;
  line-height:1;

  border-radius:8px;
  border:1px solid #111;
  cursor:pointer;
  text-decoration:none;
  user-select:none;
  -webkit-tap-highlight-color:transparent;

  transition:transform .08s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
}

/* base */
.agx-btnYes{ background:#111; color:#fff; box-shadow:0 14px 26px rgba(0,0,0,.18); }
.agx-btnNo{  background:#fff; color:#111; }

.agx-actions .agx-btnYes:active,
.agx-actions .agx-btnNo:active{ transform:scale(.99); }

/* =========================
   ✅ FIX: YES 按钮强制黑底（防主题覆盖）
========================== */
#agxModal .agx-actions .agx-btnYes,
#agxModal button.agx-btnYes{
  background:#111 !important;
  color:#fff !important;
  border-color:#111 !important;
  -webkit-appearance:none !important;
  appearance:none !important;
  box-shadow:0 14px 26px rgba(0,0,0,.18) !important;
}
#agxModal .agx-actions .agx-btnYes:hover{
  background:#111 !important;
  color:#fff !important;
}
#agxModal .agx-actions .agx-btnYes:focus{
  outline:none !important;
  box-shadow:0 0 0 3px rgba(17,17,17,.18), 0 14px 26px rgba(0,0,0,.18) !important;
}

/* =========================
   🚫 Disable scroll (incl. iOS)
========================== */
html.agx-lock,
body.agx-lock{
  overflow:hidden !important;
  height:100% !important;
  touch-action:none !important;
}

/* =========================
   Mobile: 左右各 10px 间距（关键修复）
========================== */
@media (max-width: 991px){
  /* ✅ 不用 left:50% + translateX，改用 left/right 固定间距 */
  #agxModal .agx-panel{
    position:fixed;
    left:10px;
    right:10px;
    top:50%;
    transform:translateY(-50%);
    width:auto;
    max-width:none;
    margin:0;

    max-height:calc(100vh - 20px);
    overflow:auto;
    -webkit-overflow-scrolling:touch;
  }

  /* iPhone 刘海安全区：仍保证至少 10px */
  @supports (padding: max(0px)){
    #agxModal .agx-panel{
      left:max(10px, env(safe-area-inset-left));
      right:max(10px, env(safe-area-inset-right));
    }
  }

  #agxModal .agx-inner{ padding:26px 18px; }
  #agxModal .agx-title{ font-size:34px; }
  #agxModal .agx-text{ font-size:15px; }

  #agxModal .agx-actions{
    flex-direction:column;
    gap:12px;
  }

  #agxModal .agx-actions .agx-btnYes,
  #agxModal .agx-actions .agx-btnNo{
    width:100%;
    max-width:none;
    margin:0;
  }
}