.kdp-button {
    border-radius: 50px;
    display: block;
    font-family: var(--lwc-fontFamilyHeader, var(--dxp-s-text-heading-large-font-family, "aktiv-grotesk-extended"));
    font-size: 0.875rem;
    font-weight: var(--font-weight_stronger);
    line-height: 0.75rem;
    padding: 1.1875rem 2.5rem;
    text-decoration: none;
    text-transform: uppercase;
    transition: 0.2s all ease-in-out;
    border-color:transparent;
}

.kdp-button[disabled] {
  cursor: not-allowed;
  opacity: 0.6;
}

.kdp-button[disabled]:hover {
  background-color: var(--color-maroon);
}

.kdp-button[disabled][aria-disabled="true"] {
  pointer-events: none;
}

.button-primary {
    background-color: var(--color-maroon);
    color: white !important;
}

.button-primary[disabled], .kdp-button[disabled] {
    background-color: var(--color-grey-01);
  }

.button-primary:hover,
.button-primary:active, .button-primary:focus {
    background-color: var(--color-maroon_dark);
    text-decoration: none !important;
}


.button-secondary {
    background-color: white;
    color: var(--color-maroon) !important;
}

.button-secondary:hover,
.button-secondary:active, .button-secondary:focus {
    background-color: var(--color-cream);
    text-decoration: none !important;
}

.button-ghost {
    background-color: transparent;
    border: 2px solid white !important;
    color: white;
    padding: 1.1875rem 2.375rem; /* horizontal padding adjusted to account for border */
}

.button-ghost:hover,
.button-ghost:active, .button-ghost:focus {
    background-color: var(--color-cream);
    border-color: var(--color-cream) !important;
    color: var(--color-maroon);
    text-decoration: none !important;
}

.button-ghost_small,
a.kdp-button.kdp-button-login.button-ghost_small {
    background-color: transparent;
    border: 2px solid white;
    color: white;
    font-size: 0.875rem !important;
    padding: 0.625rem 0.875rem; /* horizontal padding adjusted to account for border */
}

.button-ghost_small:hover, 
.button-ghost_small:active,
.button-ghost_small:focus, 
a.kdp-button.kdp-button-login.button-ghost_small:hover, 
a.kdp-button.kdp-button-login.button-ghost_small:active,
a.kdp-button.kdp-button-login.button-ghost_small:focus{
    background-color: var(--color-cream);
    border-color: var(--color-cream);
    color: var(--color-maroon);
    text-decoration: none !important;
}

.button-septenary {
    color: white;
}

.button-quaternary { 
    background-color: var(--color-cream) !important;
    color: var(--color-maroon) !important;
    padding: 1.1875rem 2.375rem; /* horizontal padding adjusted to account for border */
}

.button-quinary {
    background-color: var(--color-maroon) !important;
    color: white !important;
  }
  
  .button-quinary:hover {
    background-color: var(--color-maroon_dark) !important;
    text-decoration: none !important;
  }
  
  .button-senary {
    background-color: white !important;
    border-color: white !important;
  }
  
  .button-senary:hover {
    background-color: var(--color-cream) !important;
    color: var(--color-maroon) !important;
    text-decoration: none !important;
  }
  

.kdp-badge {
    color: var(--color-maroon);
    display: inline-block;
    background-color: var(--color-cream);
    font: normal 0.75rem/0.75rem var(--font-header) !important;
    margin-bottom: 1rem;
    padding: 0.5rem;
    text-transform: uppercase;
}