/* assets/core.css - Core variables, typography, and base styles */

:root {
    /* ... other variables ... */
    
    /* --- IPO Confidence Colors (Updated for Realistic Ranges 35-58%) --- */
    --confidence-excellent: #00A651;  /* Forest Green - 55%+ */
    --confidence-very-good: #46B571;  /* Medium Green - 50-54% */
    --confidence-good: #B0D235;       /* Yellow-Green - 45-49% */
    --confidence-fair: #FF8C42;       /* Warm Orange - 40-44% */
    --confidence-poor: #FF6B6B;       /* Coral Red - 35-39% */
    --confidence-very-poor: #C5282F;  /* Deep Red - <35% */

    /* --- Example Font Pairing --- */
    /* Clean Sans-Serif for body text */
    --font-family-body: 'Lato', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    /* Monospace for specific data/code elements (applied via component styles or specific classes) */
    --font-family-monospace: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    /* Header font - could be same as body or slightly different */
    --font-family-headers: 'BlinkMacSystemFont', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    /* Example: Using Inter for headers */
    /* --- End Font Pairing --- */

    /* Font weights */
    --font-weight-normal: 100;
    --font-weight-medium: 300;
    /* Good for headers if using same family */
    --font-weight-bold: 400;
}

body {
    font-family: var(--font-family-body);
    /* Use body font globally */
    /* ... other body styles ... */
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-family-headers);
    /* Use header font */
    font-weight: var(--font-weight-medium);
    /* Or bold */
    /* ... other header styles ... */
}

/* Dashboard elements */
.page-container {
    padding: 20px;
    border-radius: var(--radius-md);
    background-color: var(--card-bg-color);
    box-shadow: var(--shadow-sm);
    margin-bottom: 2rem;
}

.click-message {
    padding: 10px;
    background-color: var(--info-color);
    color: white;
    border-radius: var(--radius-sm);
    font-weight: 500;
}

.search-message {
    padding: 10px;
    background-color: var(--light-color);
    border-radius: var(--radius-sm);
    font-style: italic;
}

.debug-info {
    font-family: monospace;
    font-size: 12px;
    padding: 10px;
    background-color: var(--light-color);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-sm);
    margin-top: 10px;
    overflow-x: auto;
}

.filter-label {
    display: block;
    margin-bottom: 5px;
    /* Reduced from 8px */
    font-weight: 500;
    font-size: 14px;
    color: var(--text-color);
}

/* === Landing Page Styling === */

/* Light grey gradient background for the page container */
.landing-page-container {
    /* Adjust gradient colors and direction as needed */
    /* background: linear-gradient(to bottom, #f8f9fa, #e9ecef); */
    /* Subtle light grey */
    /* Or maybe a slightly cooler grey */
    background: linear-gradient(to bottom, #ffffff, #eef2f7);
    padding-top: 20px;
    /* Add some padding if needed */
    padding-bottom: 40px;
    border-radius: 8px;
    /* Optional rounded corners for the container */
    margin-top: -1rem;
    /* Adjust if needed based on navbar margin */
}

/* Styling for the individual landing page cards */
.landing-card {
    /* Blue/Lavender Gradient */
    background: linear-gradient(135deg, #89CFF0, #B19CD9);
    /* Baby Blue to Light Pastel Purple */
    /* Adjust angle and colors: */
    /* background: linear-gradient(to bottom right, #6495ED, #D8BFD8); /* Cornflower Blue to Thistle */

    color: #ffffff;
    /* White text color for better contrast on gradient */
    border: none;
    /* Remove default card border */
    transition: all 0.3s ease-in-out;
    /* Smooth transition for hover effect */
    border-radius: 10px;
    /* Slightly rounder corners for the cards */
}

/* Ensure link wrapper doesn't interfere with card styles */
.landing-card-link {
    text-decoration: none;
    /* Remove underline from link */
    display: block;
    /* Ensure link takes up column space */
    height: 100%;
    /* Make link fill the column height */
}

/* Hover effect for the cards */
.landing-card-link:hover .landing-card {
    transform: translateY(-6px);
    /* Lift card slightly */
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
    /* Increase shadow */
    /* You could also change the gradient slightly on hover */
    /* background: linear-gradient(135deg, #7ac0e0, #a18cc9); */
    /* Slightly darker version */
}

/* Make sure icon and title color are also white */
.landing-card .card-body i,
.landing-card .card-body .card-title {
    color: #ffffff;
}

/* Terminal-style console for script logs */
.log-output {
    /* Targeting the existing class */
    background-color: #000000;
    /* Black background */
    color: #00FF00;
    /* Bright green text (classic terminal green) */
    /* Alternative green: #39FF14 (Lime), #00C000 (darker green) */

    font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
    /* Monospaced font stack */
    /* 'Consolas', 'Monaco', 'Lucida Console' are common, 'Courier New' is very standard */
    /* For a more specific "Matrix" font, you might need to import one via @font-face or Google Fonts */

    padding: 15px;
    /* Add some internal spacing */
    border-radius: 5px;
    /* Optional: slightly rounded corners */
    border: 1px solid #003300;
    /* Optional: dark green border */

    /* You can override or adjust inline styles here if needed */
    font-size: 0.85em;
    /* Example: slightly increase size from original inline style */

    /* Inline styles like maxHeight, overflowY, whiteSpace, wordBreak can often stay */
    /* unless you want to define them globally here */
}

/* Add a subtle green tint for certain elements like success messages */
.log-output .success,
.log-output .completed {
    color: #4CAF50 !important;
}

/* Add red color for errors */
.log-output .error,
.log-output .warning {
    color: #F44336 !important;
}

/* Add yellow color for warnings */
.log-output .warning {
    color: #FFC107 !important;
}

/* Optional: Add a simple cursor effect */
.log-output::after {
    content: "█";
    animation: blink 1s step-end infinite;
    color: #e0e0e0;
}

@keyframes blink {
    50% {
        opacity: 0;
    }
}

/* Debug Output Styling */
.debug-output {
    background-color: #2b2b2b;
    color: #e6e6e6;
    font-family: 'Courier New', monospace;
    padding: 1rem;
    border-radius: var(--radius-sm);
    max-height: 500px;
    overflow-y: auto;
    font-size: 14px;
    line-height: 1.4;
}

/* Login page styling */
.login-page {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgb(116, 171, 226), rgb(85, 99, 222));
}

.login-container {
    width: 100%;
    max-width: 400px;
    padding: 20px;
}

.login-card {
    background-color: rgba(255, 255, 255, 0.2); /* Semi-transparent white - adjust opacity (0.0 to 1.0) */
    backdrop-filter: blur(8px);                 /* The "frosting" effect - adjust blur radius */
    -webkit-backdrop-filter: blur(8px);         /* For Safari compatibility */
    border: 1px solid rgba(255, 255, 255, 0.25); /* Light, slightly transparent border */
    box-shadow: 0 8px 24px 0 rgba(31, 38, 135, 0.2); /* Softer shadow for a glassy feel */
    border-radius: var(--radius-md, 10px);       /* Your defined radius or a new one */
    /* padding: 2rem; */ /* Adjust padding as needed */
}

/* Text inside the frosted glass card needs to be clearly visible */
.login-card .form-label,
.login-card h4.text-center { /* Assuming the title is H4 and centered */
    color: #FFFFFF; /* White text usually works well here */
    text-shadow: 0px 0px 3px rgba(0, 0, 0, 0.2); /* Optional subtle text shadow for readability */
}

.login-card .form-control {
    background-color: rgba(255, 255, 255, 0.7); /* Make input fields more opaque for typing */
    color: #000000; /* Dark text in input fields */
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.login-card .form-control::placeholder {
    color: #555555;
}

.login-card .btn-primary { /* Assuming your login button is dbc.Button with color="primary" */
    /* You might want to adjust button style too if using frosted glass */
    /* For example, make it more solid or use a contrasting color */
}

/* Soccer tooltip styling - wider tooltips for team names and prevent wrapping */
.tooltip {
    max-width: 600px !important;
}

.tooltip-inner {
    max-width: 600px !important;
    text-align: left !important;
    padding: 8px 12px !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
    white-space: pre-line !important;
    word-wrap: normal !important;
    overflow-wrap: normal !important;
}

/* Strikeout Details Modal Content Styling */
.strikeout-details-modal-content {
    white-space: pre-wrap !important;
    line-height: 1.8 !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important;
}

/* Mobile-specific styling for strikeout details modal */
@media (max-width: 768px) {
    .strikeout-details-modal-content {
        font-size: 0.85rem !important;
        line-height: 1.7 !important;
        padding: 0.75rem !important;
    }
}

/* Desktop-specific styling for strikeout details modal */
@media (min-width: 769px) {
    .strikeout-details-modal-content {
        font-size: 0.95rem !important;
        line-height: 1.8 !important;
        padding: 1rem !important;
    }
}

/* Daily Players card styling - ensure badge text displays fully */
.daily-players-card .badge {
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
    max-width: none !important;
    display: inline-block !important;
}

.daily-players-card {
    overflow: visible !important;
}