.buttonStyle {
  line-height: 133%;
  color: #FFF;
  background: linear-gradient(#001c32, #059);
  padding: 0 0.5rem;
  cursor: pointer !important;
}
.buttonStyle:hover {
  background: linear-gradient(#059, #001c32);
}
.buttonStyle:active {
  background: linear-gradient(#ED1A3B, #500612);
}
.buttonStyle:focus {
  border: solid 0.2rem #FFF;
}
.dangerButtonStyle {
  line-height: 133%;
  color: #FFF;
  background: linear-gradient(#281122, #77386a);
  padding: 0 0.5rem;
  cursor: pointer !important;
}
.dangerButtonStyle:hover {
  background: linear-gradient(#77386a, #281122);
}
.dangerButtonStyle:active {
  background: linear-gradient(#ED1A3B, #500612);
}
form,
div.form {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 1rem;
}
form row-break,
div.form row-break {
  grid-column: span 12;
}
form.unguided {
  display: block !important;
}
[readonly] {
  cursor: default;
}
[disabled] {
  cursor: not-allowed;
}
caption,
.caption {
  font-size: smaller;
  color: #059;
  margin-bottom: 0.25rem;
}
label,
.label {
  display: block;
  font-size: smaller;
  color: #059;
}
.label currency-value {
  border: 0.1rem solid #FFF;
  border-radius: 0.75rem;
  padding: 0 1rem;
  height: var(--row-height);
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  margin-left: auto;
  color: initial;
  font-size: initial;
}
label select {
  cursor: pointer !important;
}
label text,
label textarea {
  cursor: text;
}
label input,
label select,
label textarea,
label span {
  display: block;
  width: 100%;
  margin-top: 0.25rem;
  font-size: initial;
  color: initial;
}
label input,
label select,
label textarea {
  background-color: #FFF;
}
label input:focus,
label select:focus,
label textarea:focus {
  background-color: #c8f7ea;
}
label span {
  border: 0.1rem solid #FFF;
  border-radius: 0.75rem;
  padding: 0 1rem;
  height: var(--row-height);
  grid-column: span 12;
  display: flex;
  align-items: center;
}
label input[type=checkbox] {
  width: 2rem;
  height: 2rem;
  margin: 0.5rem 0;
}
label:has(input[required])::before {
  content: "*";
  color: #ED1A3B;
}
label:has(select[required])::before {
  content: "*";
  color: #ED1A3B;
}
input,
select,
button,
textarea {
  border-radius: 0.75rem;
  padding: 0 1rem;
}
input,
select,
button {
  height: var(--row-height);
  grid-column: span 12;
  background-color: white;
}
input:focus,
select:focus,
button:focus {
  background-color: #c8f7ea;
}
button {
  line-height: 133%;
  color: #FFF;
  background: linear-gradient(#001c32, #059);
  padding: 0 0.5rem;
  cursor: pointer !important;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  overflow: hidden;
}
button:hover {
  background: linear-gradient(#059, #001c32);
}
button:active {
  background: linear-gradient(#ED1A3B, #500612);
}
button:focus {
  border: solid 0.2rem #FFF;
}
button.danger {
  line-height: 133%;
  color: #FFF;
  background: linear-gradient(#281122, #77386a);
  padding: 0 0.5rem;
  cursor: pointer !important;
}
button.danger:hover {
  background: linear-gradient(#77386a, #281122);
}
button.danger:active {
  background: linear-gradient(#ED1A3B, #500612);
}
button[disabled] {
  background: linear-gradient(#000, #777);
  color: #CCC;
}
roundButton {
  border-radius: 50%;
}
currency-value {
  width: 100%;
  text-align: right;
}