/* ==========================================================================
   ContentScope — Design System Stylesheet (Pure Light Theme)
   Modern, Clean, High-Contrast Light Theme
   ========================================================================== */

/* Glassmorphism & Card Surfaces (Pure Light) */
.glass {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 20px -2px rgba(15, 23, 42, 0.05), 0 2px 6px -1px rgba(15, 23, 42, 0.02);
}

.glass-light {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    box-shadow: 0 1px 3px 0 rgba(15, 23, 42, 0.05);
}

.glass-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    box-shadow: 0 1px 3px 0 rgba(15, 23, 42, 0.04), 0 1px 2px 0 rgba(15, 23, 42, 0.02);
    transition: all 0.2s ease;
}

.glass-card:hover {
    border-color: #cbd5e1;
    box-shadow: 0 10px 25px -3px rgba(15, 23, 42, 0.08), 0 4px 6px -2px rgba(15, 23, 42, 0.03);
    transform: translateY(-2px);
}

/* Gradient Text (High Contrast & Vibrant) */
.text-gradient {
    background: linear-gradient(135deg, #4f46e5 0%, #0284c7 60%, #4338ca 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Subtle, luminous background for hero - NO dark background */
.bg-gradient-animated {
    background: linear-gradient(135deg, #f8fafc 0%, #eef2ff 50%, #f0fdfa 100%);
    background-size: 200% 200%;
    animation: gradientShift 10s ease infinite alternate;
}

@keyframes gradientShift {
    0% { background-position: 0% 50%; }
    100% { background-position: 100% 50%; }
}

/* Soft, elegant glows for light mode */
.glow-brand {
    box-shadow: 0 12px 35px -5px rgba(79, 70, 229, 0.12), 0 0 1px 1px rgba(79, 70, 229, 0.06);
}

.glow-accent {
    box-shadow: 0 12px 35px -5px rgba(6, 182, 212, 0.12);
}

/* Score badge & gauge colors (High contrast light mode) */
.score-green { color: #059669; }
.score-yellow { color: #d97706; }
.score-red { color: #dc2626; }

.bg-score-green { background: #ecfdf5; border-color: #a7f3d0; color: #047857; }
.bg-score-yellow { background: #fffbeb; border-color: #fde68a; color: #b45309; }
.bg-score-red { background: #fef2f2; border-color: #fecaca; color: #b91c1c; }

/* Highlight tags for weak points */
.highlight-seo { background: #fee2e2; border-bottom: 2px solid #ef4444; color: #991b1b; }
.highlight-ai { background: #f3e8ff; border-bottom: 2px solid #a855f7; color: #6b21a8; }
.highlight-readability { background: #fef3c7; border-bottom: 2px solid #f59e0b; color: #92400e; }
.highlight-structure { background: #e0e7ff; border-bottom: 2px solid #4f46e5; color: #3730a3; }

/* Custom scrollbar (Light theme) */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
::-webkit-scrollbar-track {
    background: #f1f5f9;
}
::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}