/* ═══════════════════════════════════════════════════════════════════
   OWLMARK STUDIO — SESSION RECOVERY
   Companion stylesheet to owlmark-recovery.js.

   A bar, deliberately. Stage 2 established that OwlMark does not stack
   full-screen layers on a teacher, and an offer to restore work is not
   important enough to break that rule — the document behind it stays
   visible and usable while they decide.
   ═══════════════════════════════════════════════════════════════════ */

.om-recover{
  position:fixed;z-index:16200;
  inset-inline:auto;
  inset-inline-end:18px;
  bottom:18px;
  max-width:min(430px, calc(100vw - 28px));
  display:flex;align-items:center;gap:12px;
  padding:13px 15px;
  border-radius:16px;
  background:linear-gradient(180deg,#FFFDF8,#F6F0E2);
  border:1px solid rgba(201,154,61,.42);
  box-shadow:0 18px 46px rgba(16,26,45,.3),0 2px 6px rgba(16,26,45,.14);
  opacity:0;transform:translateY(10px);
  transition:opacity .24s ease, transform .24s ease;
}
.om-recover.open{opacity:1;transform:none}

.om-rec-ic{
  flex:0 0 36px;width:36px;height:36px;
  display:flex;align-items:center;justify-content:center;
  border-radius:11px;background:rgba(184,134,47,.16);color:#8A6420;
}
.om-rec-ic svg{width:19px;height:19px}

.om-rec-tx{
  flex:1 1 auto;min-width:0;
  display:flex;flex-direction:column;gap:2px;
  font-family:'Manrope',system-ui,sans-serif;
}
.om-rec-tx strong{font-size:.86rem;font-weight:700;color:#101A2D;line-height:1.3}
.om-rec-tx small{font-size:.75rem;font-weight:500;color:#5A6478}

.om-recover button{
  flex:0 0 auto;min-height:40px;padding:9px 14px;
  border-radius:11px;cursor:pointer;
  font-family:'Manrope',system-ui,sans-serif;
  font-size:.82rem;font-weight:700;
}
.om-rec-go{
  border:1px solid #A87C2A;
  background:linear-gradient(180deg,#D8B15C,#B8862F);color:#fff;
}
.om-rec-go:hover{background:linear-gradient(180deg,#E2BE72,#C4923A)}
.om-rec-no{
  border:1px solid rgba(16,26,45,.14);
  background:rgba(16,26,45,.04);color:#3A4257;
}
.om-rec-no:hover{background:rgba(16,26,45,.09)}
.om-recover button:focus-visible{outline:2px solid #B8862F;outline-offset:2px}

body.lang-ar .om-rec-tx,body.lang-ar .om-recover button{
  font-family:'Cairo',system-ui,sans-serif;
}

/* Clear of the phone task bar, which owns the bottom of the screen. */
body.om-mobile .om-recover{
  inset-inline:12px;
  bottom:calc(var(--om-bar-h, 60px) + env(safe-area-inset-bottom, 0px) + 12px);
  max-width:none;flex-wrap:wrap;
}
@media (max-width: 520px){
  .om-recover{inset-inline:12px;max-width:none;flex-wrap:wrap}
  .om-rec-tx{flex:1 1 100%;order:-1}
  .om-recover button{flex:1 1 0;min-height:44px}
}

@media (prefers-reduced-motion: reduce){
  .om-recover{transition:none}
}
@media print{
  .om-recover{display:none !important}
}