/* css/packs/qrs.css | Source: MonarqueXD_v95L_GUILDORIGINS.html lignes 68587-68810 (id="mx-fx-pack-qrs-styles") */
/* ============================================================ */
/*  PACK QRS — Mailbox + Guilde enrichie + Chat                */
/* ============================================================ */

/* === MAILBOX === */
#mx-mailbox-icon {
  position: fixed;
  top: 70px;
  right: 16px;
  z-index: 9700;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(20,12,30,.95), rgba(8,4,16,.95));
  border: 1.5px solid rgba(255, 215, 74, .55);
  color: #ffd84a;
  font-size: 1.2em;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 14px rgba(255, 215, 74, .35);
  transition: all .2s;
}
#mx-mailbox-icon:hover { transform: scale(1.08); }
#mx-mailbox-icon .mb-badge {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  background: #ff2030;
  color: #fff;
  font-size: 11px;
  font-weight: 900;
  border-radius: 9px;
  border: 2px solid #1a1a2e;
  display: none;
  align-items: center;
  justify-content: center;
}
#mx-mailbox-icon .mb-badge.visible { display: flex; }

#mx-mailbox-modal {
  position: fixed;
  inset: 0;
  z-index: 99800;
  background: rgba(0,0,0,.92);
  backdrop-filter: blur(10px);
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
#mx-mailbox-modal.visible { display: flex; }
#mx-mailbox-modal .mb-card {
  background: linear-gradient(160deg, #11132a, #06081a);
  border: 2px solid #ffd84a;
  border-radius: 18px;
  padding: 24px;
  max-width: 460px;
  width: 100%;
  max-height: 85vh;
  overflow-y: auto;
  font-family: 'Rajdhani', sans-serif;
  color: #fff;
  position: relative;
}
#mx-mailbox-modal h2 {
  font-family: 'Cinzel', serif;
  color: #ffd84a;
  margin: 0 0 16px;
  text-align: center;
  letter-spacing: 2px;
}
.mb-msg {
  background: rgba(255, 215, 74, .08);
  border: 1px solid rgba(255, 215, 74, .3);
  border-radius: 10px;
  padding: 12px;
  margin-bottom: 10px;
}
.mb-msg .mb-from { font-size: .8em; color: #80e8ff; margin-bottom: 4px; }
.mb-msg .mb-text { color: #fff; margin-bottom: 8px; }
.mb-msg .mb-actions { display: flex; gap: 8px; }
.mb-accept, .mb-decline {
  flex: 1; padding: 8px; border-radius: 8px; border: 0; font-weight: 800; cursor: pointer; letter-spacing: 1.5px; text-transform: uppercase; font-size: .8em;
}
.mb-accept { background: linear-gradient(135deg, #6bff8a, #1ea35a); color: #0a1a08; }
.mb-decline { background: rgba(255, 80, 80, .2); border: 1px solid #ff5050; color: #ff8090; }
.mb-close { position: absolute; top: 12px; right: 12px; background: rgba(255,80,80,.2); border: 1px solid #ff5050; color: #ff8090; padding: 6px 12px; border-radius: 8px; cursor: pointer; }

/* === GUILDE — Curseur partage XP + Chat === */
.guild-share-slider-wrapper {
  background: linear-gradient(160deg, rgba(20,12,30,.9), rgba(10,6,18,.95));
  border: 1.5px solid rgba(170, 80, 255, .4);
  border-radius: 12px;
  padding: 16px;
  margin: 14px 0;
}
.guild-share-slider-wrapper label {
  display: block;
  color: #aa44ff;
  font-family: 'Cinzel', serif;
  font-weight: 800;
  letter-spacing: 1.5px;
  margin-bottom: 10px;
}
.guild-share-slider-wrapper input[type=range] {
  width: 100%;
  height: 6px;
  background: rgba(170, 80, 255, .3);
  border-radius: 3px;
  outline: none;
  -webkit-appearance: none;
}
.guild-share-slider-wrapper input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 24px;
  height: 24px;
  background: linear-gradient(135deg, #aa44ff, #50dcff);
  border-radius: 50%;
  cursor: pointer;
  box-shadow: 0 0 10px rgba(170, 80, 255, .8);
}
.guild-share-slider-wrapper .share-value {
  text-align: center;
  color: #ffd84a;
  font-family: 'Cinzel', serif;
  font-size: 1.5em;
  font-weight: 900;
  margin-top: 8px;
}

/* === Guild Chat === */
#mx-guild-chat-modal {
  position: fixed;
  inset: 0;
  z-index: 99700;
  background: rgba(0,0,0,.92);
  backdrop-filter: blur(8px);
  display: none;
  align-items: center;
  justify-content: center;
  padding: 16px;
}
#mx-guild-chat-modal.visible { display: flex; }
#mx-guild-chat-modal .chat-card {
  background: linear-gradient(160deg, #11132a, #06081a);
  border: 2px solid #aa44ff;
  border-radius: 18px;
  padding: 18px;
  max-width: 500px;
  width: 100%;
  height: 80vh;
  display: flex;
  flex-direction: column;
  font-family: 'Rajdhani', sans-serif;
}
#mx-guild-chat-modal h2 {
  font-family: 'Cinzel', serif;
  color: #aa44ff;
  margin: 0 0 14px;
  text-align: center;
  letter-spacing: 2px;
}
#mx-guild-chat-msgs {
  flex: 1;
  overflow-y: auto;
  background: rgba(0,0,0,.4);
  border-radius: 10px;
  padding: 12px;
  margin-bottom: 10px;
}
.gc-msg {
  margin-bottom: 8px;
  padding: 8px;
  background: rgba(170, 80, 255, .08);
  border-radius: 8px;
  border-left: 3px solid #aa44ff;
}
.gc-msg .gc-author { font-size: .75em; color: #80e8ff; font-weight: 800; }
.gc-msg .gc-text { color: #fff; margin-top: 2px; }
.gc-msg .gc-time { font-size: .65em; color: #888; margin-top: 2px; }
.gc-msg.me { border-left-color: #ffd84a; background: rgba(255, 215, 74, .08); }
.gc-msg.me .gc-author { color: #ffd84a; }
#mx-guild-chat-input {
  display: flex;
  gap: 8px;
}
#mx-guild-chat-input input {
  flex: 1;
  padding: 10px;
  background: rgba(0,0,0,.5);
  border: 1px solid rgba(170, 80, 255, .4);
  border-radius: 8px;
  color: #fff;
  font-family: inherit;
}
#mx-guild-chat-input button {
  padding: 10px 18px;
  background: linear-gradient(135deg, #aa44ff, #50dcff);
  border: 0;
  border-radius: 8px;
  color: #fff;
  font-weight: 800;
  cursor: pointer;
  letter-spacing: 1.5px;
}
.chat-close {
  position: absolute;
  top: 14px;
  right: 14px;
  background: rgba(255,80,80,.2);
  border: 1px solid #ff5050;
  color: #ff8090;
  padding: 6px 12px;
  border-radius: 8px;
  cursor: pointer;
}