/* Keep the banner anchored independently of MDB's measured height. */
#cookieModal {
    top: auto !important;
    bottom: 0;
    height: auto !important;
}

#cookieModal .modal-dialog {
    position: relative;
}

#cookieModal .modal-content {
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 -3px 14px rgba(0, 0, 0, 0.06);
}

#cookieModal .modal-body {
    background: rgba(247, 37, 133, 0.04);
    padding: 0.75rem 0;
    max-height: 85vh;
    max-height: 85dvh;
    overflow-y: auto;
}

#cookieModal [hidden] {
    display: none !important;
}

#cookieModal .cookie-consent-content {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    text-align: left;
}

#cookieModal .cookie-summary {
    flex: 1 1 32rem;
}

#cookieModal .cookie-details {
    flex-basis: 100%;
}

#cookieModal .cookie-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
}

#cookieModal .cookie-actions .btn {
    white-space: normal;
    line-height: 1.4;
    padding-left: 0.375rem;
    padding-right: 0.375rem;
    min-height: 2.75rem;
}

#cookieModal[data-cookie-details="true"] .cookie-actions {
    width: 100%;
    max-width: 48rem;
    margin-inline-start: auto;
    grid-template-columns: 2.75rem repeat(3, minmax(0, 1fr));
}

#cookieModal #btn-cookies-back {
    display: grid;
    place-items: center;
    width: 2.75rem;
    padding: 0;
    font-size: 1rem;
    border: 1px solid #cbd0d5;
}

#cookieModal #btn-cookies-reject {
    --cookie-action-accent: #b33a49;
}

#cookieModal #btn-cookies-accept {
    --cookie-action-accent: #227548;
}

#cookieModal #btn-cookies-save,
#cookieModal #btn-cookies-customize {
    --cookie-action-accent: #4f4f4f;
    --cookie-action-background: var(--mdb-light);
}

/* Keep the consent choice colors consistent in both views. */
#cookieModal #btn-cookies-reject,
#cookieModal #btn-cookies-accept,
#cookieModal #btn-cookies-save,
#cookieModal #btn-cookies-customize {
    background: var(--cookie-action-background, transparent) !important;
    color: var(--cookie-action-accent) !important;
    border: 1px solid var(--cookie-action-accent) !important;
}

#cookieModal .cookie-actions .btn:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

@media (max-width: 991.98px) {
    #cookieModal .cookie-actions {
        width: 100%;
    }
}

@media (max-width: 575.98px) {
    #cookieModal[data-cookie-details="true"] .cookie-actions {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    #cookieModal[data-cookie-details="true"] #btn-cookies-back {
        grid-column: 1;
    }

    #cookieModal[data-cookie-details="true"] #btn-cookies-save {
        grid-column: 2 / 5;
    }

    #cookieModal[data-cookie-details="true"] #btn-cookies-reject {
        grid-column: 1 / 3;
    }

    #cookieModal[data-cookie-details="true"] #btn-cookies-accept {
        grid-column: 3 / 5;
    }
}
