/* ==================== GLASSMORPHISM SYSTEM ==================== */

/* Card de vidro base */
.glass-card {
    background: rgba(10, 21, 46, 0.55);
    backdrop-filter: blur(40px) saturate(180%);
    -webkit-backdrop-filter: blur(40px) saturate(180%);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-xl);
    position: relative;
    overflow: hidden;
}

.glass-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.03) 0%,
        transparent 40%,
        transparent 60%,
        rgba(255, 255, 255, 0.02) 100%
    );
    pointer-events: none;
    z-index: 0;
    border-radius: inherit;
}

.glass-card::after {
    content: '';
    position: absolute;
    top: -1px;
    left: 20%;
    width: 60%;
    height: 1px;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(255, 255, 255, 0.06),
        transparent
    );
    pointer-events: none;
}

/* Reflexo de borda */
.glass-border-glow {
    position: relative;
}

.glass-border-glow::after {
    content: '';
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    padding: 1px;
    background: linear-gradient(
        135deg,
        rgba(30, 108, 240, 0.4),
        transparent 30%,
        transparent 70%,
        rgba(0, 198, 255, 0.3)
    );
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

/* Superfície translúcida */
.glass-surface {
    background: rgba(13, 26, 54, 0.6);
    backdrop-filter: blur(30px) saturate(150%);
    -webkit-backdrop-filter: blur(30px) saturate(150%);
    border: 1px solid var(--border-subtle);
}

/* Reflexo de luz */
.glass-reflection {
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(
        ellipse at 30% 20%,
        rgba(255, 255, 255, 0.04) 0%,
        transparent 60%
    );
    pointer-events: none;
    transition: var(--transition-smooth);
}