/* ── Rentals24 Auth Aside Panel ──────────────────────────────────────────────
   Replaces the static auth-bg.png with a layered CSS mesh gradient.
   Dark navy base gives white logo/text full contrast.
   Corporate #1B84FF used as accent blobs, not as base (avoids logo blending).
   ─────────────────────────────────────────────────────────────────────────── */

.r24-auth-aside {
    position: relative;
    overflow: hidden;

    /* ── Mesh gradient: dark navy base + blue accent blobs ── */
    background:
        radial-gradient(ellipse 90% 70% at 110%  -5%, rgba(86, 174, 255, 0.45) 0%, transparent 55%),
        radial-gradient(ellipse 70% 90% at  -5% 105%, rgba(27, 132, 255, 0.35) 0%, transparent 55%),
        radial-gradient(ellipse 50% 50% at  85%  85%, rgba(10,  42,  94, 0.60) 0%, transparent 60%),
        radial-gradient(ellipse 40% 40% at  15%  20%, rgba(56, 142, 255, 0.25) 0%, transparent 50%),
        linear-gradient(150deg, #071B3E 0%, #0E3272 45%, #1259B8 100%);
}

/* ── Decorative blobs (pure CSS, no images) ── */

/* Large soft circle — top right */
.r24-auth-aside::before {
    content: '';
    position: absolute;
    top: -120px;
    right: -120px;
    width: 420px;
    height: 420px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(27, 132, 255, 0.30) 0%, transparent 70%);
    pointer-events: none;
}

/* Medium soft circle — bottom left */
.r24-auth-aside::after {
    content: '';
    position: absolute;
    bottom: -80px;
    left: -80px;
    width: 300px;
    height: 300px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(56, 142, 255, 0.22) 0%, transparent 70%);
    pointer-events: none;
}

/* ── Subtle dot grid overlay ── */
.r24-auth-aside__grid {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(255, 255, 255, 0.07) 1px, transparent 1px);
    background-size: 28px 28px;
    pointer-events: none;
}

/* ── Floating accent ring — decorative ── */
.r24-auth-aside__ring {
    position: absolute;
    top: 12%;
    right: 8%;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    border: 1.5px solid rgba(255, 255, 255, 0.10);
    pointer-events: none;
}

.r24-auth-aside__ring::after {
    content: '';
    position: absolute;
    inset: 20px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.07);
}

/* ── Content sits above decorative layers ── */
.r24-auth-aside > .r24-auth-aside__content {
    position: relative;
    z-index: 1;
}

/* ── Logo: slight drop shadow so it pops even more ── */
.r24-auth-aside .r24-auth-logo {
    filter: drop-shadow(0 2px 16px rgba(0, 0, 0, 0.25));
}

/* ── Subtle vignette at the bottom to anchor the content ── */
.r24-auth-aside__vignette {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 200px;
    background: linear-gradient(to top, rgba(7, 27, 62, 0.5) 0%, transparent 100%);
    pointer-events: none;
}