/* achievements.css — UI achievementů */

.achievements-panel { padding: 12px 6px 40px; }

/* Souhrn nahoře */
.ach-summary {
  display: flex; align-items: center; gap: 16px;
  background: rgba(0, 0, 0, 0.28);
  border: 1px solid rgba(212, 175, 55, 0.35);
  border-radius: 12px; padding: 14px 18px; margin-bottom: 18px;
}
.ach-summary-stat { text-align: center; flex: 0 0 auto; }
.ach-summary-stat .ach-big { display: block; font-size: 1.5rem; font-weight: 700; color: #f2d478; line-height: 1.1; }
.ach-summary-stat small { color: #cbb98c; font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; }
.ach-summary-bar { flex: 1 1 auto; height: 10px; border-radius: 6px; background: rgba(255,255,255,.08); overflow: hidden; }
.ach-summary-fill { height: 100%; background: linear-gradient(90deg, #b8862b, #f2d478); transition: width .5s ease; }

/* Skupiny kategorií */
.ach-group { margin-bottom: 22px; }
.ach-group-title {
  display: flex; align-items: center; gap: 8px;
  color: #e8d9a8; font-size: 1.05rem; margin: 0 0 10px; padding-bottom: 6px;
  border-bottom: 1px solid rgba(212, 175, 55, 0.22);
}
.ach-group-title i { color: #d4af37; }
.ach-group-count { margin-left: auto; font-size: .8rem; color: #a99a6f; font-weight: 400; }

/* Mřížka karet */
.ach-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; }

.ach-card {
  display: flex; align-items: center; gap: 12px;
  background: rgba(20, 18, 14, 0.55);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px; padding: 10px 12px; position: relative;
  transition: transform .12s ease, border-color .2s ease;
}
.ach-card:hover { transform: translateY(-2px); }

.ach-icon {
  flex: 0 0 auto; width: 44px; height: 44px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.2rem; background: rgba(255,255,255,.06); color: #8a8272;
}
.ach-body { flex: 1 1 auto; min-width: 0; }
.ach-name { font-weight: 600; color: #e6ddc4; font-size: .92rem; }
.ach-desc { font-size: .78rem; color: #a49c86; line-height: 1.25; margin-top: 1px; }
.ach-points {
  flex: 0 0 auto; align-self: flex-start; font-weight: 700; font-size: .82rem;
  color: #c9b988; background: rgba(212,175,55,.12); border-radius: 6px; padding: 2px 7px;
}

/* Stav odemčeno / zamčeno */
.ach-card.ach-locked { opacity: .72; filter: grayscale(.35); }
.ach-card.ach-unlocked { border-color: rgba(212, 175, 55, 0.5); background: rgba(45, 38, 20, 0.6); }
.ach-card.ach-unlocked .ach-icon { background: linear-gradient(145deg, #b8862b, #f2d478); color: #241c05; box-shadow: 0 0 12px rgba(242, 212, 120, .35); }
.ach-card.ach-unlocked .ach-name { color: #f4e9c8; }

/* Tier akcenty (odemčené) */
.ach-card.ach-unlocked.ach-tier-1 .ach-icon { background: linear-gradient(145deg, #a97142, #e0a870); }
.ach-card.ach-unlocked.ach-tier-2 .ach-icon { background: linear-gradient(145deg, #9aa3ad, #e6ecf2); color: #2a2f36; }
.ach-card.ach-unlocked.ach-tier-3 .ach-icon { background: linear-gradient(145deg, #b8862b, #ffd86b); }

.ach-date { font-size: .7rem; color: #7fae6b; margin-top: 3px; }
.ach-date i { margin-right: 3px; }

/* Progress bar u tierových */
.ach-progress { position: relative; height: 14px; border-radius: 7px; background: rgba(255,255,255,.08); margin-top: 5px; overflow: hidden; }
.ach-progress-fill { height: 100%; background: linear-gradient(90deg, #6b5320, #d4af37); }
.ach-progress-text { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: .66rem; color: #ece3c6; text-shadow: 0 1px 2px rgba(0,0,0,.7); }

/* ---- Toasty ---- */
#ach-toast-container {
  position: fixed; top: 16px; right: 16px; z-index: 20000;
  display: flex; flex-direction: column; gap: 10px; pointer-events: none;
}
.ach-toast {
  display: flex; align-items: center; gap: 12px; min-width: 260px; max-width: 340px;
  background: linear-gradient(135deg, #2a2410, #1a1608);
  border: 1px solid #d4af37; border-radius: 12px; padding: 12px 14px;
  box-shadow: 0 8px 28px rgba(0,0,0,.5), 0 0 18px rgba(212,175,55,.25);
  transform: translateX(120%); opacity: 0; transition: transform .4s cubic-bezier(.2,.9,.3,1.3), opacity .4s;
}
.ach-toast.show { transform: translateX(0); opacity: 1; }
.ach-toast-icon {
  flex: 0 0 auto; width: 42px; height: 42px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; font-size: 1.2rem;
  background: linear-gradient(145deg, #b8862b, #f2d478); color: #241c05;
}
.ach-toast-text { flex: 1 1 auto; min-width: 0; }
.ach-toast-title { font-size: .68rem; text-transform: uppercase; letter-spacing: .05em; color: #d4af37; }
.ach-toast-title i { margin-right: 4px; }
.ach-toast-name { font-weight: 700; color: #f4e9c8; font-size: .95rem; }
.ach-toast-points { flex: 0 0 auto; font-weight: 800; color: #f2d478; font-size: 1rem; }

@media (max-width: 520px) {
  .ach-grid { grid-template-columns: 1fr; }
  #ach-toast-container { left: 12px; right: 12px; }
  .ach-toast { max-width: none; }
}