/* ============================================================
   RDR Banner Display — Public Styles
   Skeleton loader + banner wrapper, theme-aware
   ============================================================ */

/* ── Wrapper ──────────────────────────────────────────────── */
.rdr-bd-wrapper {
    display: block;
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
    /* Prevent CLS: max-width lets it shrink on mobile */
    max-width: 100%;
}

/* ── Skeleton shimmer ─────────────────────────────────────── */
.rdr-bd-skeleton {
    background: var(--rdr-bd-skel-bg, #1c2128);
    border-radius: 8px;
}

.rdr-bd-skeleton::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        transparent 0%,
        var(--rdr-bd-skel-shine, rgba(46,168,255,0.12)) 40%,
        transparent 100%
    );
    animation: rdr-bd-shimmer 1.6s ease-in-out infinite;
    border-radius: inherit;
}

@keyframes rdr-bd-shimmer {
    0%   { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}

/* ── Empty state (bot / no eligible content) ──────────────── */
.rdr-bd-empty {
    /* Keep exact dimensions to preserve layout — no visible content */
    background: transparent;
    display: block;
}

/* ── Loaded state ─────────────────────────────────────────── */
.rdr-bd-loaded {
    background: transparent;
    animation: rdr-bd-fadein 0.25s ease;
}

.rdr-bd-loaded::after {
    display: none; /* kill shimmer once loaded */
}

@keyframes rdr-bd-fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* ── Inner content ────────────────────────────────────────── */
.rdr-bd-inner {
    display: block;
    width: 100%;
    height: 100%;
}

.rdr-bd-inner img,
.rdr-bd-inner iframe,
.rdr-bd-inner video {
    max-width: 100%;
    display: block;
}

/* ── Light theme overrides ────────────────────────────────── */
[data-theme="light"] .rdr-bd-skeleton {
    background: var(--rdr-bd-skel-bg, #e8edf2);
}

[data-theme="light"] .rdr-bd-skeleton::after {
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(30,115,190,0.1) 40%,
        transparent 100%
    );
}

/* ── Collapsed (no-ads users) ─────────────────────────────── */
.rdr-bd-collapsed {
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: none !important;
}