﻿.usersite-advert-source {
    --rb-source-accent: #1769c2;
    --rb-source-accent-2: #0b315d;
    --rb-source-surface: #f6f9fc;
    --rb-source-border: #cbd9e8;
    --rb-source-ink: #17263a;
    --rb-source-muted: #65758a;
    --rb-source-button-text: #fff;
    --rb-source-radius: 18px;
    margin-top: 18px;
    padding: 18px;
    border: 1px solid var(--rb-source-border);
    border-radius: var(--rb-source-radius);
    background: var(--rb-source-surface);
    box-shadow: 0 12px 26px rgba(15, 23, 42, .08);
}

.usersite-advert-source::before {
    display: block;
    width: 54px;
    height: 3px;
    margin: -19px auto 15px;
    background: var(--rb-source-accent);
    content: "";
}

.usersite-advert-source-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.usersite-advert-source-logo {
    display: block;
    width: 108px;
    height: auto;
    color: var(--rb-source-accent-2);
    fill: currentColor;
}

.usersite-advert-source-label {
    color: var(--rb-source-accent);
    font-size: .69rem;
    font-weight: 900;
    letter-spacing: .11em;
    text-align: right;
    text-transform: uppercase;
}

.usersite-advert-source-description {
    margin: 13px 0 14px;
    color: var(--rb-source-muted);
    font-size: .82rem;
    font-weight: 700;
    line-height: 1.45;
}

.usersite-advert-source-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    padding: 13px 15px;
    border: 1px solid color-mix(in srgb, var(--rb-source-accent) 68%, #fff);
    border-radius: calc(var(--rb-source-radius) - 5px);
    background: linear-gradient(135deg, var(--rb-source-accent-2), var(--rb-source-accent));
    color: var(--rb-source-button-text);
    font-size: .83rem;
    font-weight: 900;
    line-height: 1.25;
    text-decoration: none;
    box-shadow: 0 9px 20px color-mix(in srgb, var(--rb-source-accent) 22%, transparent);
    transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}

.usersite-advert-source-link svg {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    fill: currentColor;
}

.usersite-advert-source-link:hover {
    color: var(--rb-source-button-text);
    text-decoration: none;
    filter: brightness(1.06);
    transform: translateY(-2px);
    box-shadow: 0 13px 25px color-mix(in srgb, var(--rb-source-accent) 28%, transparent);
}

.usersite-layout01-body .usersite-advert-source {
    --rb-source-accent: #dc2626;
    --rb-source-accent-2: #111827;
    --rb-source-surface: #fff;
    --rb-source-border: #d1d5db;
    --rb-source-ink: #111827;
    --rb-source-muted: #5f6876;
    --rb-source-radius: 18px;
}

.usersite-layout02-body .usersite-advert-source {
    --rb-source-accent: #9dff00;
    --rb-source-accent-2: #020402;
    --rb-source-surface: #f3f7ef;
    --rb-source-border: #9dff00;
    --rb-source-ink: #020402;
    --rb-source-muted: #526047;
    --rb-source-button-text: #020402;
    --rb-source-radius: 0px;
    box-shadow: 6px 6px 0 #020402;
}

.usersite-layout02-body .usersite-advert-source-link {
    background: #9dff00;
    border-color: #020402;
    box-shadow: 4px 4px 0 #020402;
}

.usersite-layout02-body .usersite-advert-source-label {
    color: #477500;
}

.usersite-layout03-body .usersite-advert-source {
    --rb-source-accent: #2563eb;
    --rb-source-accent-2: #0b2a4a;
    --rb-source-surface: #f5faff;
    --rb-source-border: #bfdbfe;
    --rb-source-muted: #54708c;
    --rb-source-radius: 24px;
}

.usersite-layout04-body .usersite-advert-source {
    --rb-source-accent: #e6005c;
    --rb-source-accent-2: #111827;
    --rb-source-surface: #f8fafc;
    --rb-source-border: #d7dde5;
    --rb-source-muted: #64748b;
    --rb-source-radius: 20px;
}

.usersite-layout05-body .usersite-advert-source {
    --rb-source-accent: #d6a84f;
    --rb-source-accent-2: #0a1524;
    --rb-source-surface: #f8fafc;
    --rb-source-border: #c8d0da;
    --rb-source-muted: #64748b;
    --rb-source-radius: 3px;
}

.usersite-layout06-body .usersite-advert-source {
    --rb-source-accent: #ff5a5f;
    --rb-source-accent-2: #4d2cc9;
    --rb-source-surface: #fffaf2;
    --rb-source-border: #cfc5ff;
    --rb-source-muted: #655f79;
    --rb-source-radius: 14px;
}

.usersite-layout06-body .usersite-advert-source-link {
    border-radius: 11px 3px 11px 3px;
}

.usersite-layout07-body .usersite-advert-source {
    --rb-source-accent: #b7ef2d;
    --rb-source-accent-2: #090909;
    --rb-source-surface: #fff;
    --rb-source-border: #090909;
    --rb-source-muted: #525252;
    --rb-source-button-text: #090909;
    --rb-source-radius: 0px;
    box-shadow: none;
}

.usersite-layout07-body .usersite-advert-source-link {
    background: #b7ef2d;
    border-color: #090909;
    box-shadow: none;
}

.usersite-layout08-body .usersite-advert-source {
    --rb-source-accent: #b18a43;
    --rb-source-accent-2: #5b1724;
    --rb-source-surface: #fffaf0;
    --rb-source-border: #d9c59d;
    --rb-source-muted: #705f54;
    --rb-source-radius: 4px;
}

@media (max-width: 575.98px) {
    .usersite-advert-source {
        padding: 15px;
    }

    .usersite-advert-source-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    .usersite-advert-source-label {
        text-align: left;
    }

    .usersite-advert-source-link {
        padding: 12px 13px;
        font-size: .79rem;
    }
}
