/* AL60 Memory – Design V2 Override v1.1.0 */

.al60-memory-wrapper {
  --al60-accent:       var(--al60-primary, #1F6F5B);
  --al60-accent-dark:  var(--al60-primary-dark, #145443);
  --al60-green:        var(--al60-primary, #1F6F5B);
  --al60-green-dark:   var(--al60-primary-dark, #145443);
  --al60-bg:           #FAF8F3;
  --al60-surface:      #FFFFFF;
  --al60-surface-alt:  #F4EFE6;
  --al60-text:         #1F2933;
  --al60-muted:        #4B5563;
  --al60-border:       #D8D3C7;
  --al60-radius:       10px;
  --al60-radius-lg:    16px;
  --al60-card-back:    var(--al60-primary, #1F6F5B);
  --al60-card-matched: var(--al60-primary-soft, #E8F3EF);
  --al60-card-border-matched: var(--al60-primary, #1F6F5B);

  background: #FAF8F3;
  border-radius: 20px;
  padding: 1.5rem 1.25rem 2.5rem;
  box-shadow: 0 6px 24px rgba(0,0,0,0.07);
}

/* Stats-Bar */
.al60-memory-wrapper .al60-stats-bar {
  background: #FFFFFF;
  border: 1px solid #D8D3C7;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

.al60-memory-wrapper .al60-stat-label {
  font-size: 13px;
  color: #4B5563;
}

.al60-memory-wrapper .al60-stat-value {
  font-size: 1.6rem;
  color: var(--al60-primary);
  font-weight: 700;
}

/* Buttons */
.al60-memory-wrapper .al60-btn {
  min-height: 48px;
  font-size: 16px;
  border-radius: 10px;
  font-weight: 700;
}

.al60-memory-wrapper .al60-btn--large {
  min-height: 56px;
  font-size: 18px;
}

.al60-memory-wrapper .al60-btn--primary {
  background: var(--al60-primary);
  border-color: var(--al60-primary);
  color: #fff;
}

.al60-memory-wrapper .al60-btn--primary:hover,
.al60-memory-wrapper .al60-btn--primary:focus-visible {
  background: var(--al60-primary-dark);
  border-color: var(--al60-primary-dark);
}

.al60-memory-wrapper .al60-btn--secondary {
  background: transparent;
  border-color: var(--al60-primary);
  color: var(--al60-primary);
}

.al60-memory-wrapper .al60-btn--secondary:hover,
.al60-memory-wrapper .al60-btn--secondary:focus-visible {
  background: var(--al60-primary-soft);
}

.al60-memory-wrapper .al60-btn:focus-visible {
  outline: 3px solid #005FCC;
  outline-offset: 3px;
}

/* Schwierigkeitsgrad-Buttons */
.al60-memory-wrapper .al60-btn--diff {
  min-height: 44px;
  font-size: 15px;
}

.al60-memory-wrapper .al60-btn--diff.active {
  background: var(--al60-primary);
  border-color: var(--al60-primary);
  color: #fff;
}
