/* css/packs/k.css | Source: MonarqueXD_v95L_GUILDORIGINS.html lignes 58482-58615 (id="mx-fx-pack-k-styles") */
/* ============================================================ */
/*  PACK K — Punition v2 : 3 options (gems / vidéo / accepter) */
/* ============================================================ */

/* Conteneur des 3 boutons d'action */
.fx-pun-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 12px;
  width: 100%;
}

.fx-pun-action {
  position: relative;
  width: 100%;
  padding: 12px 16px;
  border-radius: 10px;
  font-family: 'Rajdhani', 'Orbitron', sans-serif;
  font-weight: 800;
  font-size: 0.95em;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  cursor: pointer;
  transition: transform .15s ease, box-shadow .25s ease, opacity .2s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-shadow: 0 1px 2px rgba(0,0,0,.6);
}
.fx-pun-action:active { transform: scale(0.96); }
.fx-pun-action:disabled { opacity: 0.4; cursor: not-allowed; }
.fx-pun-action:disabled:active { transform: none; }

/* Bouton GEMMES (premium violet) */
.fx-pun-action.gems {
  background: linear-gradient(135deg, #7a3acc 0%, #aa44ff 50%, #50dcff 100%);
  color: #fff;
  border: 2px solid rgba(170, 80, 255, .7);
  box-shadow:
    0 4px 16px rgba(170, 80, 255, .4),
    inset 0 1px 0 rgba(255, 255, 255, .25);
}
.fx-pun-action.gems:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow:
    0 8px 24px rgba(170, 80, 255, .6),
    inset 0 1px 0 rgba(255, 255, 255, .3);
}

/* Bouton VIDÉO (orange/jaune YouTube-like) */
.fx-pun-action.video {
  background: linear-gradient(135deg, #ff8c1a 0%, #ffc83a 100%);
  color: #2a1500;
  border: 2px solid rgba(255, 200, 50, .8);
  box-shadow:
    0 4px 16px rgba(255, 140, 30, .4),
    inset 0 1px 0 rgba(255, 255, 255, .35);
  text-shadow: 0 1px 0 rgba(255, 255, 255, .3);
}
.fx-pun-action.video:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow:
    0 8px 24px rgba(255, 140, 30, .6),
    inset 0 1px 0 rgba(255, 255, 255, .4);
}

/* Bouton ACCEPTER (rouge sombre) */
.fx-pun-action.accept {
  background: linear-gradient(180deg, #6a0010 0%, #3a0005 100%);
  color: #ffaaaa;
  border: 1px solid rgba(180, 0, 30, .6);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
  font-size: 0.85em;
  letter-spacing: 2px;
  margin-top: 4px;
}
.fx-pun-action.accept:hover {
  background: linear-gradient(180deg, #8a0015 0%, #4a0008 100%);
  color: #ffd6d6;
}

/* Icône bouton */
.fx-pun-action .ico {
  font-size: 1.3em;
  filter: drop-shadow(0 0 4px currentColor);
}

/* Détail prix gems */
.fx-pun-action.gems .price {
  background: rgba(0, 0, 0, .35);
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 0.85em;
  letter-spacing: 1px;
  margin-left: 4px;
}

/* Toast de succès punition annulée */
.fx-pun-cancelled-toast {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0);
  z-index: 100002;
  background: linear-gradient(135deg, #1ea35a 0%, #0a5a2a 100%);
  color: #fff;
  padding: 16px 28px;
  border-radius: 14px;
  font-family: 'Cinzel', 'Rajdhani', sans-serif;
  font-weight: 800;
  font-size: 1.2em;
  letter-spacing: 2px;
  text-transform: uppercase;
  box-shadow: 0 0 40px rgba(80, 255, 130, .6), 0 0 80px rgba(80, 255, 130, .3);
  border: 2px solid #6bff8a;
  animation: fx-cancel-pop 1.6s ease-out forwards;
  pointer-events: none;
}
@keyframes fx-cancel-pop {
  0%   { transform: translate(-50%, -50%) scale(0) rotate(-15deg); opacity: 0; }
  20%  { transform: translate(-50%, -50%) scale(1.15) rotate(3deg); opacity: 1; }
  40%  { transform: translate(-50%, -50%) scale(1) rotate(0); opacity: 1; }
  85%  { transform: translate(-50%, -50%) scale(1) rotate(0); opacity: 1; }
  100% { transform: translate(-50%, -50%) scale(0.9) rotate(0); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .fx-pun-cancelled-toast { animation: none !important; transform: translate(-50%, -50%) scale(1); opacity: 1; }
}
