/* Knappens grundläggande stil */
.button, .btn {
  background-color: #4a52b6; /*#0061ae; /* Blå bakgrundsfärg */
  color: white; /* Vit text */
  border: none; /* Ingen kant */
  padding: 12px 24px; /* Inre marginal */
  font-size: 16px; /* Textstorlek */
  cursor: pointer; /* Muspekare vid hover */
  border-radius: 4px; /* Avrundade hörn */
  transition: background-color 0.3s ease; /* Smidig övergång vid hover */
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  font-family: arial, "Helvetica Neue", sans-serif;
  font-weight: 700;
}
.button_small {
  padding: 10px 20px; /* Inre marginal */
  font-size: 14px; /* Textstorlek */
  font-weight: 500;
}
.button_secondary {
  background-color: #f5f6fa;
  border-color: #4a52b6;
  border-width: 2px;
  color: #4a52b6;
  padding-top: calc(1rem);
  padding-right: 1.5rem;
  padding-bottom
  padding-left: 1.5rem;
  border-style: solid; /* Lägg till detta för att visa ramen */
  border-radius: 4px; /* Valfritt: Avrundade hörn för en mer modern utseende */
  cursor: pointer; /* Valfritt: Visa handpekaren när man hovrar över knappen */
  /*font-size: 0.875rem; /* Valfritt: Anpassa teckenstorlek efter behov */
  /*font-weight: 500; /* Valfritt: Anpassa teckenvikt efter behov */
  /*text-align: center; /* Valfritt: Centrera texten i knappen */
  /*text-decoration: none; /* Valfritt: Ta bort understrykning om det är en länk */
  transition: background-color 0.3s ease, border-color 0.3s ease; /* Valfritt: Smidig övergång vid hover */
}

/* Ändra bakgrundsfärg vid muspekare över knappen */
.button:hover, .btn:hover {
  background-color: #3b4292; /*#004e8c; /* Mörkare blå */
}

.button_secondary:hover {
  background-color: #e5e5f5;
  color: #4a52b6;
}

/* En ram runt knappen */
.button:active, .btn:active {
  border-radius: 0;
  box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px #1b1e23, 0 0 0 6px #ffffff; /*0 1px 3px rgba(0, 0, 0, 0.3); /*var(--f-focus-box-shadow);*/
  outline: 2px solid transparent;
  background-color: #3b4292; /*var(--fkds-color-action-background-primary-hover);*/
  border-color: transparent;
  color: #ffffff;
}

/* Inaktiverad knapp */
.button:disabled, .btn:disabled {
  background-color: #ccc; /* Grå färg */
  cursor: not-allowed; /* Förbjuden muspekare */
}
