/* ══════════ THE O5 DIALOG ══════════

   One pop-up for the admin, the promoter panel, the CRM and the public site,
   replacing SweetAlert v1 (2026-09-30). Styled after the forgot-password
   modal's "Check your email" card (option5.css .olf-*): white 24px card,
   red-to-orange top line, round icon badge, bold headline, grey text, pill
   buttons.

   DEPENDS ON NOTHING. Every colour is literal, every class is o5-dlg-*, and
   every rule is scoped under .o5-dlg-overlay -- so Bootstrap, Webix and the
   themes cannot reach in, and it looks the same on every platform.
   Left/right are logical properties, so Arabic (dir="rtl") mirrors by itself.

   CLOSED MEANS display:none ON THE CARD, deliberately. The card also carries
   SweetAlert's own class names (.sweet-alert, button.confirm, button.cancel)
   so code and checks written against SweetAlert keep working during the
   switch -- admin-browser-check and views/modules/confirm_dialog.js both ask
   "is a .sweet-alert displayed?". Those names style nothing here. */

.o5-dlg-overlay{position:fixed;inset:0;z-index:2147483000;display:none;align-items:center;justify-content:center;padding:24px;
  background:rgba(10,10,12,.55)}
.o5-dlg-overlay.is-open{display:flex;animation:o5-dlg-fade .18s ease-out}
.o5-dlg-overlay .o5-dlg{display:none}
.o5-dlg-overlay.is-open .o5-dlg{display:block;animation:o5-dlg-rise .18s ease-out}
@keyframes o5-dlg-fade{from{opacity:0}to{opacity:1}}
@keyframes o5-dlg-rise{from{transform:translateY(8px) scale(.98)}to{transform:none}}

.o5-dlg-overlay .o5-dlg{position:relative;box-sizing:border-box;width:400px;max-width:100%;max-height:calc(100vh - 48px);overflow:auto;
  margin:0;background:#fff;border-radius:24px;padding:40px 28px 28px;text-align:center;box-shadow:0 30px 60px -16px rgba(0,0,0,.35);
  font-family:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Tahoma,sans-serif;color:#1a1a1a;line-height:normal}
.o5-dlg-overlay .o5-dlg::before{content:'';position:absolute;top:0;inset-inline:0;height:6px;background:linear-gradient(90deg,#d62133,#ff6f3c)}
/* The public site marks Arabic with data-dir, the panels with dir. */
[dir="rtl"] .o5-dlg-overlay .o5-dlg::before,[data-dir="rtl"] .o5-dlg-overlay .o5-dlg::before{background:linear-gradient(270deg,#d62133,#ff6f3c)}
.o5-dlg-overlay [hidden]{display:none !important}

.o5-dlg-overlay .o5-dlg-badge{width:80px;height:80px;border-radius:50%;color:#fff;display:inline-flex;align-items:center;justify-content:center;margin:0 auto 22px}
.o5-dlg-overlay .o5-dlg-badge svg{width:36px;height:36px}
.o5-dlg-overlay .o5-dlg.is-success .o5-dlg-badge{background:linear-gradient(135deg,#1f8a5b,#4ddc9e);box-shadow:0 14px 28px -10px rgba(31,138,91,.45)}
.o5-dlg-overlay .o5-dlg.is-error .o5-dlg-badge{background:linear-gradient(135deg,#b91c2c,#ff5a5f);box-shadow:0 14px 28px -10px rgba(214,33,51,.45)}
.o5-dlg-overlay .o5-dlg.is-warning .o5-dlg-badge,
.o5-dlg-overlay .o5-dlg.is-confirm .o5-dlg-badge{background:linear-gradient(135deg,#d9851a,#f7b955);box-shadow:0 14px 28px -10px rgba(217,133,26,.45)}
.o5-dlg-overlay .o5-dlg.is-info .o5-dlg-badge{background:linear-gradient(135deg,#1f5fc2,#5aa0f2);box-shadow:0 14px 28px -10px rgba(39,116,214,.45)}

.o5-dlg-overlay .o5-dlg-title{font-family:inherit;font-size:24px;font-weight:800;letter-spacing:-.01em;line-height:1.2;color:#1a1a1a;margin:0 0 12px;padding:0;text-transform:none}
.o5-dlg-overlay .o5-dlg-text{font-size:14.5px;line-height:1.55;color:#6b6b6b;margin:0 0 24px;padding:0;white-space:pre-line;overflow-wrap:anywhere}
.o5-dlg-overlay .o5-dlg-detail{font-size:12.5px;line-height:1.5;color:#8a8a8a;background:#f7f5f0;border-radius:12px;padding:10px 14px;margin:-12px 0 24px;text-align:start;overflow-wrap:anywhere}

.o5-dlg-overlay .o5-dlg-field{margin:0 0 22px;text-align:start}
.o5-dlg-overlay .o5-dlg-input{display:block;width:100%;height:auto;box-sizing:border-box;padding:13px 18px;border:1px solid #ececec;border-radius:999px;background:#f7f5f0;
  font:inherit;font-size:14.5px;font-weight:600;color:#1a1a1a;outline:none;box-shadow:none}
.o5-dlg-overlay .o5-dlg-input:focus{border-color:#1a1a1a;background:#fff;box-shadow:0 0 0 3px rgba(0,0,0,.05)}
.o5-dlg-overlay .o5-dlg-input.is-invalid{border-color:#d62133}
.o5-dlg-overlay .o5-dlg-error{margin:8px 0 0;padding:0 4px;font-size:12.5px;font-weight:700;color:#d62133}

.o5-dlg-overlay .o5-dlg-actions{display:flex;flex-direction:column-reverse;gap:10px;margin:0}
.o5-dlg-overlay .o5-dlg-btn{display:inline-flex;align-items:center;justify-content:center;width:100%;box-sizing:border-box;margin:0;padding:13px 18px;border-radius:999px;
  border:1px solid #ececec;background:#fff;font:inherit;font-size:13.5px;font-weight:800;line-height:1.2;color:#1a1a1a;cursor:pointer;text-transform:none;
  box-shadow:none;transition:transform .12s,border-color .12s,background .12s}
.o5-dlg-overlay .o5-dlg-btn:hover{border-color:#1a1a1a;transform:translateY(-1px)}
.o5-dlg-overlay .o5-dlg-btn:focus-visible{outline:3px solid rgba(214,33,51,.35);outline-offset:2px}
.o5-dlg-overlay .o5-dlg-btn.is-primary,.o5-dlg-overlay .o5-dlg-btn.is-destructive{background:#d62133;border-color:#d62133;color:#fff;box-shadow:0 14px 28px -14px rgba(214,33,51,.5)}
.o5-dlg-overlay .o5-dlg-btn.is-primary:hover,.o5-dlg-overlay .o5-dlg-btn.is-destructive:hover{background:#b91c2c;border-color:#b91c2c}
.o5-dlg-overlay .o5-dlg-btn[disabled]{opacity:.6;cursor:default;transform:none}

@media (max-width:480px){.o5-dlg-overlay .o5-dlg{padding:36px 20px 20px;border-radius:20px}.o5-dlg-overlay .o5-dlg-title{font-size:21px}}
@media (prefers-reduced-motion:reduce){.o5-dlg-overlay.is-open,.o5-dlg-overlay.is-open .o5-dlg{animation:none}.o5-dlg-overlay .o5-dlg-btn{transition:none}}
body.o5-dlg-lock{overflow:hidden}
