/* ===== Overlay ===== */
.pic-safe-modal{
  position:fixed;
  inset:0;
  z-index:999999;
  display:none;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(0,0,0,.55);
}

/* ===== Card ===== */
.pic-safe-inner{
  width:min(560px, 92vw);
  background:#0f1723;
  color:#e9eef7;
  border-radius:16px;
  box-shadow:0 24px 70px rgba(0,0,0,.55);
  padding:28px 26px 22px;
}

#pic-safe-title{ display:none; } /* hidden heading, we render our own */

.pic-safe-icon{
  display:flex;
  justify-content:center;
  align-items:center;
  margin-top:2px;
}

.pic-safe-heading{
  text-align:center;
  font-size:24px;
  line-height:1.25;
  font-weight:800;
  margin:12px 0 6px;
  word-break:break-word;
}

.pic-safe-content{
  font-size:15px;
  line-height:1.7;
  text-align:center;
  margin:4px 0 8px;
}

.ps-note{ opacity:.85; }

/* Centered meta row(s) */
.ps-meta{ margin:6px 0 2px; opacity:.95; }
.ps-meta.center{ text-align:center; }

/* Buttons */
.pic-safe-actions{
  margin-top:16px;
  display:flex;
  gap:12px;
  justify-content:center;      /* centered buttons */
  flex-wrap:wrap;
}
.pic-safe-actions .button{
  min-width:130px;
  padding:15px 18px;
  border-radius:12px;
  font-weight:700;
}
.pic-safe-actions .button-primary{
  background:#ff7a1a;
  border-color:#ff7a1a;
  color:#fff;
}
.pic-safe-actions .button-primary:hover{
  filter:brightness(1.05);
}

/* ===== Success icon (SMALLER ring + clean tick; no glow) ===== */
.ps-anim-check{
  width:80px;               
  height:80px;
  display:block;
  margin:2px auto 5px;
  transform:scale(.98);
  animation:psPop 200ms ease-out forwards;
}
.ps-ring-bg{
  fill:none;
  stroke:rgba(255,255,255,.10);/* very faint guide ring; remove if not needed */
  stroke-width:10;             /* 12 -> 10 (cleaner) */
}
.ps-anim-ring{
  fill:none;
  stroke:#2dd36f;
  stroke-width:10;             /* 12 -> 10 */
  stroke-linecap:round;
  stroke-dasharray:415;
  stroke-dashoffset:415;
  /* removed glow: no drop-shadow */
  animation:psRingDraw 640ms cubic-bezier(.2,.8,.2,1) 40ms forwards;
}
.ps-anim-tick{
  fill:none;
  stroke:#2dd36f;
  stroke-width:12;             /* 14 -> 12 */
  stroke-linecap:round;
  stroke-linejoin:round;
  stroke-dasharray:160;
  stroke-dashoffset:160;
  /* removed glow: no drop-shadow */
  animation:psTickDraw 460ms ease-out 220ms forwards;
}
@keyframes psPop { to{ transform:scale(1); } }
@keyframes psRingDraw { to{ stroke-dashoffset:0; } }
@keyframes psTickDraw { to{ stroke-dashoffset:0; } }

/* ===== Error icon (large cross; no glow) ===== */
.ps-anim-error{
  width:80px;
  height:80px;
  display:block;
  margin:2px auto 5px;
}
.ps-error-ring{
  fill:none;
  stroke:#ff4757;
  stroke-width:10;
  opacity:.25;
}
.ps-error-line{
  fill:none;
  stroke:#ff4757;
  stroke-width:14;
  stroke-linecap:round;
  stroke-dasharray:120;
  stroke-dashoffset:120;
  /* removed glow: no drop-shadow */
}
.ps-error-line.a{ animation:errLine 360ms ease-out 100ms forwards; }
.ps-error-line.b{ animation:errLine 360ms ease-out 180ms forwards; }
@keyframes errLine { to{ stroke-dashoffset:0; } }

/* ===== Loading spinner (info) ===== */
.ps-spinner{
  width:64px; height:64px; margin:0 auto 6px; position:relative;
}
.ps-spinner div{
  box-sizing:border-box;
  position:absolute;
  width:64px; height:64px;
  border:6px solid transparent;
  border-top-color:#6ea8fe;
  border-radius:50%;
  animation:spin 1s linear infinite;
  filter:drop-shadow(0 3px 8px rgba(110,168,254,.35));
}
.ps-spinner div:nth-child(2){
  width:48px; height:48px; top:8px; left:8px;
  border-top-color:#8bd1ff;
  animation-duration: .85s;
}
.ps-spinner div:nth-child(3){
  width:32px; height:32px; top:16px; left:16px;
  border-top-color:#b8e7ff;
  animation-duration: .75s;
}
@keyframes spin { to { transform:rotate(360deg); } }

/* ===== Region highlight ===== */
.pic-safe-region{
  color:#ff5a5a;
  font-weight:800;
}

/* (Optional) Dark theme tweak */
button.pic-cancel.button{
  background:#1f2a3a;
  border-color:#1f2a3a;
  color:#e6edf7;
}
button.pic-cancel.button:hover{ filter:brightness(1.05); }
