/* BIG KLASS ELECTRIC CHROME ACTIVITY BUTTONS */

#screen-logbook #activityButtons {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  margin: 16px 0 !important;
}

#screen-logbook #activityButtons .train-btn {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  min-width: 0 !important;
  min-height: 126px !important;
  padding: 17px 9px !important;
  text-align: center !important;

  border: 2px solid #839bb7 !important;
  border-radius: 16px !important;

  background:
    linear-gradient(150deg, #34465d 0%, #121e30 45%, #030811 100%) !important;

  color: #f5faff !important;
  font: 900 16px Arial, sans-serif !important;
  letter-spacing: .4px;

  box-shadow:
    inset 0 2px 2px #ffffff55,
    inset 0 -3px 5px #0009,
    0 5px 12px #000b,
    0 0 10px #007bff33 !important;

  text-shadow: 0 2px 5px #000;
  transition: transform .15s, box-shadow .15s;
}

#screen-logbook #activityButtons .train-btn svg {
  width: 39px !important;
  height: 39px !important;
  stroke: #52caff !important;
  stroke-width: 2 !important;
  filter: drop-shadow(0 0 8px #008cff);
}

#screen-logbook #activityButtons .train-btn.selected,
#screen-logbook #activityButtons .train-btn[aria-pressed="true"] {
  border-color: #b9efff !important;
  background:
    linear-gradient(155deg, #0b91ff, #0050bc 80%) !important;

  box-shadow:
    inset 0 2px 3px #ffffff88,
    inset 0 0 18px #8ce4ff55,
    0 0 12px #00baff,
    0 0 26px #006bff88 !important;
}

#screen-logbook #activityButtons .train-btn.selected svg {
  stroke: #fff !important;
}

#screen-logbook #activityButtons .train-btn:active {
  transform: scale(.97);
}

@media (max-width: 380px) {
  #screen-logbook #activityButtons {
    gap: 9px !important;
  }

  #screen-logbook #activityButtons .train-btn {
    min-height: 108px !important;
    font-size: 14px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #screen-logbook #activityButtons .train-btn {
    transition: none !important;
  }
}
