/* ============================================================
   المهمات اليومية — نفس لغة تصميم daily-gifts.css/store-modal
   (كروت بيضاء، حواف دائرية، ظل ناعم، هيدر متدرج بلون الموقع)
   ============================================================ */

.ms-overlay{
  position:fixed;inset:0;z-index:20011;display:none;align-items:center;justify-content:center;
  background:rgba(20,20,30,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
  opacity:0;transition:opacity .2s ease;
}
.ms-overlay.ms-open{opacity:1;}

.ms-modal{
  width:400px;max-width:92vw;max-height:88vh;background:#fbfbfd;border-radius:18px;overflow:hidden;
  display:flex;flex-direction:column;box-shadow:0 20px 50px rgba(0,0,0,.35);
  transform:translateY(14px) scale(.97);transition:transform .22s ease;
}
.ms-overlay.ms-open .ms-modal{transform:translateY(0) scale(1);}

.ms-modal-header{
  display:flex;align-items:center;justify-content:space-between;padding:14px 16px;
  background:linear-gradient(135deg,var(--theme-btcolor),#7c3aed);color:#fff;flex-shrink:0;
}
.ms-modal-header > div{font-size:15px;font-weight:800;}
.ms-modal-header .fa{margin-left:6px;}
.ms-modal-close{
  width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.22);cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:all .2s ease;
}
.ms-modal-close:hover{background:rgba(220,53,69,.9);transform:rotate(90deg);}

.ms-modal-sub{padding:12px 16px 4px;font-size:12.5px;color:#777;text-align:center;}

.ms-modal-body{overflow-y:auto;padding:12px;flex:1;display:flex;flex-direction:column;gap:10px;}

.ms-card{
  background:#fff;border:1.5px solid #eee;border-radius:14px;padding:10px 12px;
  display:flex;flex-direction:column;gap:6px;transition:all .15s ease;
}
.ms-card-top{display:flex;align-items:center;gap:8px;}
.ms-ico{
  width:30px;height:30px;border-radius:9px;background:#f3f3fb;color:var(--theme-btcolor);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:14px;
}
.ms-title{font-size:12.5px;font-weight:800;color:#333;flex:1;}
.ms-check{color:#2ecc71;font-size:16px;}

.ms-bar-wrap{width:100%;height:8px;background:#eee;border-radius:6px;overflow:hidden;}
.ms-bar-fill{
  height:100%;border-radius:6px;background:linear-gradient(90deg,var(--theme-btcolor),#7c3aed);
  transition:width .3s ease;
}

.ms-bottom{display:flex;align-items:center;justify-content:space-between;font-size:11px;}
.ms-progress-txt{color:#888;font-weight:700;}
.ms-reward{color:#e07b0e;font-weight:800;}

.ms-claim-btn{
  margin-top:2px;width:100%;border:none;border-radius:10px;height:32px;font-size:12px;font-weight:800;
  color:#fff;background:linear-gradient(135deg,#ff9f43,#ff6b35);cursor:pointer;
  box-shadow:0 3px 8px rgba(255,107,53,.3);transition:transform .12s ease;
}
.ms-claim-btn:hover{transform:translateY(-1px);}
.ms-claim-btn:active{transform:scale(.96);}

.ms-card.ms-earned{border-color:#ffb84d;background:linear-gradient(160deg,#fff8ec,#fff);}
.ms-card.ms-claimed{opacity:.65;}
.ms-card.ms-claimed .ms-bar-fill{background:#2ecc71;}

.ms-loading{text-align:center;color:#aaa;font-size:12.5px;padding:24px 0;}

/* شارة الأيقونة في الشريط العلوي - نفس أسلوب usx-qb-badge بس بلون مميز
   شوية عن هدية اليوم (بنفسجي بدل برتقالي) عشان تتفرق بصريًا بينهم */
.usx-qb-missions-btn .usx-qb-badge{
  background:linear-gradient(135deg,#7c3aed,#a78bfa)!important;
  box-shadow:0 1px 4px rgba(124,58,237,.5)!important;
}

/* [ADDED] لون/توهج على أيقونة المهمات نفسها لما يكون فيه مهمة مكتملة
   جاهزة للاستلام - ظاهر من برا حتى لو النافذة مقفولة (مش بس الشارة
   الصغيرة). btn.ms-btn-ready بتتحط/بتتشال أوتوماتيك من missions-client.js
   حسب hasUnclaimed اللي جاي من السيرفر */
.usx-qb-missions-btn.ms-btn-ready{
  color:#ff9f43;
  animation:msReadyPulse 1.6s ease-in-out infinite;
}
.usx-qb-missions-btn.ms-btn-ready .fa{
  color:#ff9f43;
}
@keyframes msReadyPulse{
  0%,100%{ box-shadow:0 0 0 0 rgba(255,159,67,.55); }
  50%{ box-shadow:0 0 0 7px rgba(255,159,67,0); }
}