/* Painel claro sobreposto à coluna navy, borda com fio de dados e textura leve de gráfico. */

@media (min-width: 992px) {
    .s-login__panel {
        z-index: 3;
        margin-left: -32px;
        border-radius: 32px 0 0 32px;
        box-shadow: -24px 0 70px rgba(5, 10, 22, 0.45);
        overflow: hidden;
    }
}

.s-edge {
    position: absolute;
    top: 32px;
    bottom: 32px;
    left: 0;
    z-index: 1;
    width: 1px;
    pointer-events: none;
    overflow: hidden;
    background: linear-gradient(180deg,
        transparent,
        color-mix(in srgb, var(--brand-green) 45%, transparent) 20%,
        color-mix(in srgb, var(--brand-green) 45%, transparent) 80%,
        transparent);
}

.s-edge__pulse {
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 140px;
    background: linear-gradient(180deg, transparent, var(--brand-green-text), transparent);
    box-shadow: 0 0 10px 1px color-mix(in srgb, var(--brand-green-soft) 60%, transparent);
    animation: s-edge-flow 6s cubic-bezier(0.45, 0, 0.55, 1) infinite;
}

.s-login__panel::before,
.s-login__panel::after {
    content: "";
    position: absolute;
    pointer-events: none;
}

.s-login__panel::before {
    inset: 0;
    background-image: radial-gradient(circle, rgba(11, 17, 32, 0.08) 1px, transparent 1.4px);
    background-size: 22px 22px;
    -webkit-mask-image: radial-gradient(ellipse 60% 50% at 50% 45%, transparent 35%, #000 100%);
    mask-image: radial-gradient(ellipse 60% 50% at 50% 45%, transparent 35%, #000 100%);
}

.s-login__panel::after {
    left: 0;
    right: 0;
    bottom: 0;
    height: 26%;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 160' preserveAspectRatio='none'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%232e8b57' stop-opacity='.09'/%3E%3Cstop offset='1' stop-color='%232e8b57' stop-opacity='0'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M0 120 C60 110 90 70 150 78 S240 120 300 96 S400 40 460 58 S560 30 600 20 L600 160 L0 160Z' fill='url(%23g)'/%3E%3Cpath d='M0 120 C60 110 90 70 150 78 S240 120 300 96 S400 40 460 58 S560 30 600 20' fill='none' stroke='%232e8b57' stroke-opacity='.22' stroke-width='1.5' vector-effect='non-scaling-stroke'/%3E%3Cpath d='M0 138 C80 130 130 112 200 117 S320 97 400 102 S520 72 600 66' fill='none' stroke='%230b1120' stroke-opacity='.1' stroke-width='1.2' stroke-dasharray='4 6' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") center bottom / 100% 100% no-repeat;
}

.s-login__card,
.s-login__footer {
    position: relative;
    z-index: 2;
}

.s-login__secure {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: 20px 0 0;
    color: var(--muted-foreground);
    font-size: 12px;
}

.s-login__secure svg {
    color: var(--brand-green);
}

@keyframes s-edge-flow {
    from { transform: translateY(-140px); opacity: 0; }
    15% { opacity: 1; }
    85% { opacity: 1; }
    to { transform: translateY(calc(100vh - 64px)); opacity: 0; }
}

@media (max-width: 991.98px) {
    .s-edge,
    .s-login__panel::before,
    .s-login__panel::after {
        display: none;
    }
}