/* =========================================================
   MSC ACTION BUTTONS
   File: msc_action_buttons.css
   Depends on: msc_core_tokens.css + vertical token file
   Purpose: Token-driven buttons for course, lesson, dashboard and simulation actions.
   Rule: primary/secondary inherit vertical identity; status buttons use global status tokens.
   ========================================================= */

.msc-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  min-height: 42px;
  border-radius: var(--msc-btn-radius, 10px);
  padding: var(--msc-btn-padding-y, .72rem) var(--msc-btn-padding-x, 1rem);
  font-family: var(--msc-font-family-base, "Inter", Arial, sans-serif);
  font-size: .95rem;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
  border: 1px solid transparent;
  cursor: pointer;
  transition: background-color .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.msc-btn:hover,
.msc-btn:focus {
  text-decoration: none;
  outline: none;
}

.msc-btn:focus-visible {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--msc-vertical-primary) 30%, transparent);
}

.msc-btn--primary {
  background: var(--msc-vertical-primary);
  border-color: var(--msc-vertical-primary-dark);
  color: #fff;
}

.msc-btn--primary:hover,
.msc-btn--primary:focus {
  background: var(--msc-vertical-primary-dark);
  border-color: var(--msc-vertical-primary-dark);
  color: #fff;
  transform: translateY(-1px);
}

.msc-btn--secondary {
  background: var(--msc-vertical-primary-soft);
  border-color: var(--msc-vertical-primary);
  color: var(--msc-vertical-primary-dark);
}

.msc-btn--secondary:hover,
.msc-btn--secondary:focus {
  background: var(--msc-vertical-primary);
  border-color: var(--msc-vertical-primary-dark);
  color: #fff;
  transform: translateY(-1px);
}

.msc-btn--quiet {
  background: transparent;
  border-color: var(--msc-border);
  color: var(--msc-text-main);
}

.msc-btn--quiet:hover,
.msc-btn--quiet:focus {
  background: var(--msc-vertical-primary-pale);
  border-color: var(--msc-vertical-primary);
  color: var(--msc-vertical-primary-dark);
}

.msc-btn--complete {
  background: var(--msc-status-complete);
  border-color: var(--msc-status-complete);
  color: #fff;
}

.msc-btn--warning {
  background: var(--msc-status-warning);
  border-color: var(--msc-status-warning);
  color: #fff;
}

.msc-btn--danger {
  background: var(--msc-status-danger);
  border-color: var(--msc-status-danger);
  color: #fff;
}

.msc-btn--disabled,
.msc-btn[disabled],
.msc-btn[aria-disabled="true"] {
  background: var(--msc-status-disabled-soft);
  border-color: #D1D5DB;
  color: #6B7280;
  cursor: not-allowed;
  pointer-events: none;
  transform: none;
}

.msc-action-panel {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  align-items: center;
  margin: 1rem 0;
}
