/* Miscellaneous basic styles */

body {
  background: #f8f9fa;
}

a {
  text-decoration: none;
}

/* Grayed out elements */
.opaque {
  opacity: 0.6;
}

.opaque-fade-in {
  animation: opaque-fade-in-animation 0.15s;
}

@keyframes opaque-fade-in-animation {
  0% { opacity: 0; }
  100% { opacity: 0.6; }
}

.opaque-transition {
  transition: opacity 0.3s;
}

/* Fully visible elements */
.fade-in {
  animation: fade-in-animation 0.15s;
}

@keyframes fade-in-animation {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

/* Map display in event details */
#map {
  height: 300px; 
  background-color: #f8f9fa;
}

/* No asterisk in crispy forms */
.asteriskField {
  display: none;
}

/* Inline toggle button forms */
form.toggle {
  display: inline;
}

/* Icon button controls (opacity needed for transition effect) */
.list-group-item .controls {
  display: none;
  opacity: 0;
  animation: fade-in-animation 0.15s;
}

.list-group-item:hover .controls {
  display: block;
  opacity: 1;
}

/* Loading indicator */
.loading {
  width: 100%;
}

/* Use aria-busy to control whether to show loading on panels */
.card-body .loading {
  display: none;
}

[aria-busy] .card .card-body .loading {
  display: inline-block;
}

[aria-busy] .card .card-body > :not(.loading) {
  display: none;
}

[aria-busy] #event-list .col .card .card-body .loading {
  display: inline-block;
}

[aria-busy] #event-list .col .card .card-body > :not(.loading) {
  display: none;
}