/* GMPI DPD Sidoarjo — Tombol darurat (halaman /darurat + tombol melayang di situs) */

/* ---------- Tombol melayang di semua halaman ---------- */
.sos-fab{position:fixed;left:18px;bottom:20px;z-index:61;display:flex;align-items:center;gap:10px;height:54px;padding:0 18px 0 6px;border-radius:30px;background:#e51c24;color:#fff;text-decoration:none;font:900 11px Arial,Helvetica,sans-serif;letter-spacing:.8px;text-transform:uppercase;box-shadow:0 10px 30px rgba(229,28,36,.45),0 0 0 3px rgba(255,255,255,.12)}
.sos-fab b{position:relative;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#fff;color:#e51c24;font:900 13px Arial,Helvetica,sans-serif;letter-spacing:.5px}
.sos-fab b:after{content:'';position:absolute;inset:-4px;border-radius:50%;border:2px solid rgba(255,255,255,.7);animation:sosPulse 1.8s ease-out infinite}
.sos-fab:hover{background:#bd1219}
.sos-fab:focus-visible{outline:3px solid #ffd76a;outline-offset:3px}
@keyframes sosPulse{0%{transform:scale(1);opacity:.9}100%{transform:scale(1.55);opacity:0}}
@media(max-width:760px){.sos-fab{left:12px;bottom:14px;height:50px;padding:0 6px}.sos-fab span{display:none}.sos-fab b{width:38px;height:38px}}
@media(prefers-reduced-motion:reduce){.sos-fab b:after{animation:none}}

/* ---------- Halaman darurat ---------- */
.sos-page{margin:0;min-height:100vh;background:radial-gradient(120% 60% at 50% 0%,#3a0b0d 0%,#141110 55%,#0c0b0a 100%);color:#f4f1ea;font:15px/1.5 Arial,Helvetica,sans-serif;-webkit-text-size-adjust:100%}
.sos-page *{box-sizing:border-box}
.sos-header{display:flex;align-items:center;justify-content:space-between;padding:14px max(5%,16px);border-bottom:1px solid rgba(255,255,255,.1);background:rgba(0,0,0,.35)}
.sos-brand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none}
.sos-brand img{width:38px;height:38px;border-radius:8px}
.sos-brand strong{display:block;font:400 22px/1 Impact,'Arial Narrow',sans-serif;letter-spacing:2px}
.sos-brand small{display:block;font-size:8px;letter-spacing:2.5px;color:#c9c4ba;margin-top:3px}
.sos-tag{font-size:9px;font-weight:900;letter-spacing:2px;color:#ff6b70}
.sos-main{max-width:640px;margin:0 auto;padding:26px 18px 40px}
.sos-kicker{display:flex;align-items:center;gap:10px;font-size:10px;font-weight:900;letter-spacing:2.2px;color:#ff8a8e}
.sos-kicker span{width:24px;height:2px;background:#e51c24}
.sos-main h1{font:400 clamp(40px,11vw,58px)/.95 Impact,'Arial Narrow',sans-serif;text-transform:uppercase;margin:12px 0 10px;letter-spacing:.3px}
.sos-main h1 em{display:block;font:italic 400 .82em/1.05 Georgia,serif;text-transform:none;color:#f0c35a;letter-spacing:-1px}
.sos-lead{margin:0 0 20px;color:#d8d3c9;font-size:14px}
.sos-lead b{color:#fff}
.sos-step{border:0;margin:0 0 18px;padding:0}
.sos-step legend{display:flex;align-items:center;gap:9px;padding:0;margin-bottom:10px;font-weight:900;font-size:13px;letter-spacing:.4px;text-transform:uppercase}
.sos-step legend b{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#e51c24;font-size:12px}
.sos-step legend small{font-weight:400;text-transform:none;color:#a9a39a;letter-spacing:0}
.sos-types{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.sos-types label{position:relative;cursor:pointer}
.sos-types input{position:absolute;opacity:0;pointer-events:none}
.sos-types span{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:84px;padding:10px 6px;border:1.5px solid rgba(255,255,255,.16);border-radius:12px;background:rgba(255,255,255,.04);text-align:center;font-size:12px;font-weight:700;line-height:1.2;transition:.15s}
.sos-types i{font-style:normal;font-size:24px}
.sos-types input:checked+span{border-color:#ff4b52;background:rgba(229,28,36,.22);box-shadow:0 0 0 3px rgba(229,28,36,.25)}
.sos-types input:focus-visible+span{outline:2px solid #ffd76a;outline-offset:2px}
.sos-loc{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:6px 12px;padding:13px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05)}
.sos-loc b{display:block;font-size:14px}
.sos-loc small{display:block;color:#bdb7ad;font-size:12px;line-height:1.4;word-break:break-word}
.sos-loc-dot{width:14px;height:14px;border-radius:50%;background:#c9a640;box-shadow:0 0 0 4px rgba(201,166,64,.2)}
.sos-loc.is-wait .sos-loc-dot{animation:sosBlink 1s infinite}
.sos-loc.is-ok{border-color:rgba(76,196,120,.5);background:rgba(46,160,90,.12)}
.sos-loc.is-ok .sos-loc-dot{background:#3fcf7a;box-shadow:0 0 0 4px rgba(63,207,122,.22)}
.sos-loc.is-rough .sos-loc-dot{background:#f0b43a}
.sos-loc.is-err{border-color:rgba(255,90,96,.5);background:rgba(229,28,36,.1)}
.sos-loc.is-err .sos-loc-dot{background:#ff4b52}
.sos-loc-map{grid-column:2;justify-self:start;color:#f0c35a;font-size:12px;font-weight:800;text-decoration:none}
.sos-loc-map[hidden],.sos-retry[hidden],.sos-install[hidden],.sos-send[hidden]{display:none!important}
@keyframes sosBlink{50%{opacity:.25}}
.sos-retry{margin-top:8px;background:none;border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:8px;padding:9px 12px;font-weight:700;cursor:pointer}
.sos-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sos-step label{display:block;font-size:12px;font-weight:700;color:#d8d3c9;margin-bottom:10px}
.sos-step label small{font-weight:400;color:#99938a}
.sos-step input[type=text],.sos-step input[type=tel],.sos-step textarea{display:block;width:100%;margin-top:6px;padding:12px;border-radius:10px;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.35);color:#fff;font:15px Arial,Helvetica,sans-serif}
.sos-step textarea{resize:vertical;min-height:62px}
.sos-step input:focus,.sos-step textarea:focus{outline:none;border-color:#f0c35a}
.sos-actions{display:grid;gap:9px;margin:4px 0 0}
.sos-send{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:76px;border:0;border-radius:16px;background:#e51c24;color:#fff;cursor:pointer;box-shadow:0 14px 34px rgba(229,28,36,.45)}
.sos-send b{font:400 26px/1 Impact,'Arial Narrow',sans-serif;letter-spacing:1px}
.sos-send small{font-size:11px;font-weight:700;opacity:.85;letter-spacing:.5px}
.sos-send:active{transform:scale(.985)}
.sos-send-ring{position:absolute;inset:0;border-radius:16px;box-shadow:inset 0 0 0 2px rgba(255,255,255,.35);animation:sosRing 2s ease-out infinite}
@keyframes sosRing{0%{box-shadow:inset 0 0 0 2px rgba(255,255,255,.5)}100%{box-shadow:inset 0 0 0 14px rgba(255,255,255,0)}}
.sos-alt{min-height:50px;border-radius:12px;border:1.5px solid rgba(255,255,255,.35);background:rgba(255,255,255,.06);color:#fff;font-weight:800;font-size:14px;cursor:pointer}
.sos-alt.is-primary{min-height:76px;border:0;background:#e51c24;font:400 22px/1.1 Impact,'Arial Narrow',sans-serif;letter-spacing:.6px;box-shadow:0 14px 34px rgba(229,28,36,.45)}
.sos-copy{justify-self:center;background:none;border:0;color:#c9c4ba;text-decoration:underline;font-size:13px;cursor:pointer;padding:4px}
.sos-msg{margin:0;min-height:1em;text-align:center;font-size:13px}
.sos-msg.is-ok{color:#7fe0a5}
.sos-msg.is-err{color:#ff8a8e}
.sos-calls{margin-top:26px}
.sos-calls h2{font-size:13px;letter-spacing:.3px;margin:0 0 10px;color:#d8d3c9}
.sos-call-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.sos-call-grid a{display:flex;flex-direction:column;align-items:center;padding:12px 4px;border-radius:12px;background:#f4f1ea;color:#141110;text-decoration:none}
.sos-call-grid b{font:400 26px/1 Impact,'Arial Narrow',sans-serif}
.sos-call-grid span{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;margin-top:3px;color:#5a554d}
.sos-tips{margin-top:22px;display:grid;gap:8px}
.sos-tips details{border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:12px 14px;background:rgba(255,255,255,.03)}
.sos-tips summary{cursor:pointer;font-weight:800;font-size:13px}
.sos-tips p{margin:9px 0 0;color:#cfc9bf;font-size:13px}
.sos-install{margin-top:10px;padding:10px 14px;border-radius:10px;border:0;background:#f0c35a;color:#17140c;font-weight:900;cursor:pointer}
.sos-footer{padding:20px 18px 30px;text-align:center;color:#8f897f;font-size:11px}
.sos-footer a{color:#f0c35a}
@media(max-width:380px){.sos-types{grid-template-columns:repeat(2,1fr)}.sos-row{grid-template-columns:1fr}.sos-call-grid b{font-size:22px}}

/* Status permintaan aktif */
.sos-live{margin-top:14px;padding:16px;border-radius:14px;border:1.5px solid rgba(63,207,122,.55);background:rgba(46,160,90,.13)}
.sos-live[hidden]{display:none}
.sos-live-head{display:flex;align-items:center;gap:10px}
.sos-live-head b{font-size:16px}
.sos-live-dot{width:12px;height:12px;border-radius:50%;background:#3fcf7a;box-shadow:0 0 0 0 rgba(63,207,122,.7);animation:sosLive 1.6s infinite}
@keyframes sosLive{70%{box-shadow:0 0 0 10px rgba(63,207,122,0)}100%{box-shadow:0 0 0 0 rgba(63,207,122,0)}}
.sos-live p{margin:8px 0 4px;font-size:15px;font-weight:700;color:#fff}
.sos-live small{display:block;color:#bfe9cf;font-size:12px}
.sos-live.is-coming{border-color:#f0c35a;background:rgba(240,195,90,.14)}
.sos-live.is-coming .sos-live-dot{background:#f0c35a}
.sos-live.is-ended{border-color:rgba(255,255,255,.2);background:rgba(255,255,255,.05)}
.sos-live.is-ended .sos-live-dot{background:#8f897f;animation:none}
.sos-safe{margin-top:12px;width:100%;min-height:46px;border-radius:10px;border:0;background:#f4f1ea;color:#141110;font-weight:900;font-size:14px;cursor:pointer}
.sos-safe[hidden]{display:none}