/* Låg specificitet så att webbplatser fortfarande kan flytta eller dölja knappen med egen CSS. */
.cookie-preferences-button {
    bottom: 15px;
    display: flex;
    z-index: 1000;
}

/* Hög specificitet så att temats knappstilar inte ändrar knappens storlek eller form. */
button.cookie-preferences-button.termly-display-preferences {
    position: fixed;
    box-sizing: border-box;
    width: 40px;
    min-width: 40px;
    height: 40px;
    min-height: 40px;
    margin: 0;
    padding: 0;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 50%;
    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3);
    cursor: pointer;
    transform: none;

    /* !important eftersom temats hover-stilar annars kan sänka kontrasten (WCAG 1.4.11). */
    background-image: none !important;
    opacity: 1 !important;
    filter: none !important;
}

button.cookie-preferences-button.termly-display-preferences svg {
    display: block;
    flex-shrink: 0;
    fill: currentColor !important;
}

/* Svart och vit ring ger minst 3:1 mot alla bakgrunder (WCAG 2.4.7 och 1.4.11).
   !important eftersom teman ofta tar bort fokusmarkeringen. */
button.cookie-preferences-button.termly-display-preferences:focus-visible {
    outline: 2px solid #000000 !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 2px #ffffff !important;
}

/* Med forcerade färger (t.ex. Windows kontrastteman) försvinner bakgrund och skugga, så knappen behöver en kant. */
@media (forced-colors: active) {
    button.cookie-preferences-button.termly-display-preferences {
        border: 1px solid ButtonText !important;
    }

    button.cookie-preferences-button.termly-display-preferences:focus-visible {
        outline-color: Highlight !important;
    }
}