/* The notice banner only: the preferences center dialog also carries the ---reset class, and these sizes squeezed it */
.freeprivacypolicy-com---nb {
    font-family: var(--font-family-main) !important;
    font-size: var(--font-size);
    box-shadow: 0 0 40px var(--color-shadow);
    background: var(--color-surface) !important;
    border: solid var(--color-border) 1px;
    border-top-left-radius: var(--border-radius);
    width: min(100%, 500px) !important;

    > .cc-nb-main-container {
        padding: 25px !important;
    }

    .cc-nb-title {
        color: var(--color-text-strong) !important;
        font-size: 17px !important;
    }

    .cc-nb-text {
        font-size: var(--font-size-small) !important;
        color: var(--color-text-soft) !important;
        line-height: 1.4 !important;
    }

    button[role="button"] {
        --padding-base: 10px;
        padding: var(--padding-base) calc(var(--padding-base) * 1.4);
        font-size: .9em;
        font-weight: 500;

        border-radius: var(--border-radius-pill);
        border: solid var(--color-border-strong) 1px;
        background: transparent;
        transition: all var(--transition-animation-ms) ease;
        transition-property: color, background;
        color: var(--color-text);

        &:hover {
            color: var(--color-text-strong);
            border-color: var(--color-text-muted);
        }

        &.cc-nb-okagree,
        &.cc-nb-reject {
            background-color: var(--color-accent);
            color: var(--color-on-accent);
            border-color: transparent;

            &:hover {
                background-color: var(--color-accent-hover);
                color: var(--color-on-accent);
            }
        }
    }
}