/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

* {
  font-family: sans-serif;
}

.progress {
  border: 1px solid black;
  min-height: 1rem;
}

.progress_bar {
  height: 1rem;
  width: 0%;
  background: green;
}

.cards {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
}

.card {
  padding: 1rem;
  margin: 1rem;
  border: solid black;
  box-shadow: 10px 5px 0px 0px #efefef;
  border-radius: 1rem;
  justify-content: start;

  h1 {
    font-size: 24pt;
  }

  p {
    font-size: 18pt;
  }

  .content {
    padding: 0.5rem;
  }
  
  .actions {
    display: flex;
    justify-content: end;
    gap: 1rem;
  }
}


a {
  color: inherit;
  text-decoration: none;
}

button {
  background: transparent;
  border: 0;
}

form {
  display: inline;
}

.secondary {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  text-decoration: none;
  font-weight: bold;
  margin: 0.5rem;
  border-radius: 0.5rem;
  font-size: 1rem;
  color: #232323;
  background: lightgrey;
}

button.primary,
a.primary,
input[type="button"],
input[type="submit"] {
  display: inline;
  text-decoration: none;
  font-weight: bold;
  margin: 0.5rem;
  padding: 0.5rem 1rem;
  border-radius: 0.5rem;
  font-size: 1rem;
  border: 0;
  color: #232323;
  background: #38d6df;
}

button:disabled,
button[disabled] {
  border: 1px solid #999999;
  background-color: #cccccc;
  color: #666666;
}