/* iOS-style liquid glass controls for the Activity tab and workout builder. */
.activity-glass-button,
.activity-screen-mode .ng-btn-primary,
.activity-screen-mode .ng-btn-secondary,
.activity-screen-mode .back-btn,
.wg-screen button,
.wg-entry button,
.wg-result-actions button,
.workout-card,
.workout-plan-row,
.workout-today-plan-card > button,
.pill-tab,
#screenContent .back-btn {
  -webkit-tap-highlight-color: transparent;
  -webkit-backdrop-filter: blur(18px) saturate(145%);
  backdrop-filter: blur(18px) saturate(145%);
  border: 1px solid rgba(210, 241, 255, .16);
  background: linear-gradient(145deg, rgba(255,255,255,.105), rgba(255,255,255,.035));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), inset 0 -1px 0 rgba(0,0,0,.18), 0 10px 24px rgba(0,0,0,.16);
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.activity-glass-button:hover,
.activity-glass-button:focus-visible,
.activity-screen-mode .ng-btn-primary:hover,
.activity-screen-mode .ng-btn-primary:focus-visible,
.activity-screen-mode .ng-btn-secondary:hover,
.activity-screen-mode .ng-btn-secondary:focus-visible,
.activity-screen-mode .back-btn:hover,
.activity-screen-mode .back-btn:focus-visible,
.wg-screen button:hover,
.wg-screen button:focus-visible,
.wg-entry button:hover,
.wg-entry button:focus-visible,
.wg-result-actions button:hover,
.wg-result-actions button:focus-visible,
.workout-card:hover,
.workout-card:focus-visible,
.workout-plan-row:hover,
.workout-plan-row:focus-visible,
.workout-today-plan-card > button:hover,
.workout-today-plan-card > button:focus-visible,
.pill-tab:hover,
.pill-tab:focus-visible,
#screenContent .back-btn:hover,
#screenContent .back-btn:focus-visible {
  border-color: rgba(255, 173, 50, .58);
  background: linear-gradient(145deg, rgba(255,173,50,.18), rgba(255,255,255,.055));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 12px 28px rgba(255,138,0,.14);
  outline: none;
}

.activity-glass-button:active,
.activity-screen-mode .ng-btn-primary:active,
.activity-screen-mode .ng-btn-secondary:active,
.activity-screen-mode .back-btn:active,
.wg-screen button:active,
.wg-entry button:active,
.wg-result-actions button:active,
.workout-card:active,
.workout-plan-row:active,
.workout-today-plan-card > button:active,
.pill-tab:active,
#screenContent .back-btn:active {
  transform: scale(.985);
}

.wg-screen .wg-choice {
  min-height: 48px;
  border-radius: 16px;
  text-align: left;
}

.wg-screen .wg-choice.is-selected,
.wg-screen .wg-choice.is-selected:hover {
  border-color: rgba(200,255,0,.78);
  background: linear-gradient(145deg, rgba(200,255,0,.22), rgba(157,252,84,.08));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 8px 22px rgba(157,252,84,.1);
}

.activity-screen-mode .ng-btn-primary,
.wg-screen .ng-btn-primary,
.wg-entry .ng-btn-primary,
.wg-result-actions .ng-btn-primary {
  border-color: rgba(255,173,50,.62);
  background: linear-gradient(145deg, rgba(255,173,50,.96), rgba(255,138,0,.9));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 12px 28px rgba(255,138,0,.2);
  color: #101820;
}

.activity-screen-mode .ng-btn-secondary,
.wg-screen .ng-btn-secondary,
.wg-result-actions .ng-btn-secondary {
  border-color: rgba(190,231,235,.25);
  background: linear-gradient(145deg, rgba(190,231,235,.14), rgba(255,255,255,.045));
}

.wg-fields .ng-input {
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  backdrop-filter: blur(16px) saturate(140%);
  border-color: rgba(210,241,255,.17);
  background: rgba(255,255,255,.07);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.1);
}

@media (max-width: 640px) {
  .wg-entry { align-items: stretch; flex-direction: column; }
  .wg-entry .ng-btn-primary { width: 100%; min-height: 48px; }
  .wg-result-actions { grid-template-columns: 1fr !important; }
  .wg-result-actions button { width: 100%; min-height: 48px; }
}

@media (prefers-reduced-motion: reduce) {
  .activity-glass-button,
  .activity-screen-mode .ng-btn-primary,
  .activity-screen-mode .ng-btn-secondary,
  .activity-screen-mode .back-btn,
  .wg-screen button,
  .wg-entry button,
  .wg-result-actions button,
  .workout-card,
  .workout-plan-row,
  .workout-today-plan-card > button,
  .pill-tab,
  #screenContent .back-btn { transition: none; }
}
