/**
 * True Heart - Glimmer & Bloom
 * FULL CONSOLIDATED FILE
 * Updates: Forced z-index for buttons, Enhanced visibility for .btn-primary
 */

/* ============================================
   1. THE CORE BLOOM (Breathing Effect)
   Subtle pulsing glow for brand elements
   ============================================ */

.message-ai,
.btn-primary,
.send-btn,
.welcome-card,
.prompt-display,
.welcome-section,
.is-sparkling,
.daily-focus-card { /* Added for index.php support */
    position: relative;
    z-index: 1;
    box-shadow: 0 0 12px rgba(62, 207, 207, 0.06);
    animation: thPulse 13s ease-in-out infinite;
    border: 1px solid rgba(62, 207, 207, 0.2) !important;
    transition: box-shadow var(--th-transition-fast), border-color var(--th-transition-fast);
}

/* ============================================
   2. THE REFLECTIVE SHIMMER (The Sweep)
   ============================================ */

.message-ai::after,
.btn-primary::after,
.send-btn::after,
.welcome-card::after,
.prompt-display::after,
.welcome-section::after,
.is-sparkling::after,
.daily-focus-card::after {
    content: '';
    position: absolute;
    inset: 0;
    /* Increased contrast slightly for the beam to be visible on buttons */
    background: linear-gradient(
        110deg,
        transparent 35%,
        rgba(62, 207, 207, 0.08) 48%,
        rgba(255, 255, 255, 0.06) 50%,
        rgba(62, 207, 207, 0.08) 52%,
        transparent 65%
    );
    background-size: 200% 100%;
    animation: thSweep 12s linear infinite;
    pointer-events: none;
    z-index: 2;
    opacity: 0.6; /* Bumped slightly from 0.4 for visibility */
}

/* Ensure child content (text) stays above the shimmer layer */
/* Added direct button text targeting to ensure "Begin Writing" is visible */
.message-ai > *, 
.welcome-card > *,
.btn-primary,
.btn-primary * {
    position: relative;
    z-index: 3;
}

/* ============================================
   3. ANIMATION KEYFRAMES
   ============================================ */

@keyframes thPulse {
    0%, 100% { 
        box-shadow: 0 0 12px rgba(62, 207, 207, 0.05);
        border-color: rgba(62, 207, 207, 0.15);
    }
    50% { 
        box-shadow: 0 0 20px rgba(62, 207, 207, 0.15);
        border-color: rgba(62, 207, 207, 0.35);
    }
}

@keyframes thSweep {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* ============================================
   4. ACTIVE TRIGGER: .is-sparkling
   ============================================ */

.is-sparkling {
    animation: thPulse 5s ease-in-out infinite !important; 
}

.is-sparkling::after {
    animation: thSweep 5s linear infinite !important;
    opacity: 0.7;
}

/* ============================================
   5. HOVER & INTERACTION
   ============================================ */

.btn-primary:hover,
.send-btn:hover {
    box-shadow: 0 0 15px rgba(62, 207, 207, 0.3);
}

/* ============================================
   6. LIGHT MODE COMPATIBILITY
   ============================================ */

body.light-mode .message-ai,
body.light-mode .welcome-card {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
    animation: none;
}

body.light-mode .message-ai::after {
    background: linear-gradient(
        110deg,
        transparent 25%,
        rgba(255, 255, 255, 0.4) 50%,
        transparent 75%
    );
    opacity: 0.2;
}

/* ============================================
   7. ACCESSIBILITY (Reduced Motion)
   ============================================ */

@media (prefers-reduced-motion: reduce) {
    .message-ai,
    .is-sparkling,
    .welcome-card {
        animation: none !important;
    }
    .message-ai::after,
    .is-sparkling::after {
        display: none;
    }
}
