/**
 * Seven Fires Platform - Main CSS
 *
 * This file imports all CSS modules in the correct order:
 * 1. Base styles and CSS custom properties
 * 2. Layout and grid system
 * 3. UI components
 * 4. Page-specific styles
 * 5. Inline style replacements for CSP compliance
 *
 * Load order is important for CSS specificity and performance.
 */

/* 1. Base Styles & CSS Variables */
@import 'base.css';

/* 2. Layout & Grid System */
@import 'layout.css';

/* 3. UI Components */
@import 'components.css';

/* 3.5. Shared Components (Cross-Business Unit) */
@import 'shared-components.css';

/* 4. Legacy Compatibility - REMOVED - styles consolidated into appropriate files */

/* 5. Inline Styles Replacement (CSP Compliance) */
@import 'inline-styles.css';

/* 6. Page-Specific Styles */
@import 'pages/hero.css';
@import 'pages/jobs.css';
@import 'pages/partnerships.css';
@import 'pages/news.css';
@import 'pages/testimonials.css';
@import 'pages/applications.css';
@import 'pages/interest.css';
@import 'admin.css';

/**
 * Global Overrides & Layout Improvements
 * Only add styles here that need to override other styles
 * or provide global fixes that can't be placed elsewhere
 */

/* Ensure proper box-sizing inheritance */
html {
    box-sizing: border-box;
}

*,
*::before,
*::after {
    box-sizing: inherit;
}

/* Body improvements for better visual hierarchy */
body {
    background: #ffffff;
    min-height: 100vh;
}

/* Section spacing improvements */
section {
    position: relative;
}

/* Ensure most sections have white backgrounds for readability, but not hero */
section:not(.hero):not(.page-header) {
    background: #ffffff !important;
    color: var(--color-text) !important;
}

/* Legacy text color fixes - now handled by shared-components.css */
/* Keeping only essential overrides that can't be standardized */

/* Fix spacing gaps at bottom of pages */
.content {
    padding: var(--spacing-xl) 0 !important;
    margin-bottom: 0 !important;
}

/* Ensure news section has proper styling */
.news-section {
    background: #f8f9fa !important;
    color: #333333 !important;
}

/* Interest page news section enhancement */
.interest-page .news-section {
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%) !important;
    border-bottom: 1px solid #e9ecef;
    position: relative;
}

/* Container improvements */
.container {
    position: relative;
}

/* Header enhancements */
header {
    background: var(--color-white);
    box-shadow: var(--shadow-sm);
    border-bottom: 1px solid var(--color-gray-200);
    position: sticky;
    top: 0;
    z-index: var(--z-sticky);
}

/* Global focus management */
*:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

/* Smooth scrolling for anchor links */
@media (prefers-reduced-motion: no-preference) {
    html {
        scroll-behavior: smooth;
    }
}

/* Enhanced link styles */
a {
    color: var(--color-primary);
    font-weight: var(--font-weight-medium);
}

a:hover {
    color: var(--color-primary-hover);
}

/* Improved text contrast */
p,
li,
span {
    color: var(--color-text);
}

/* Force good contrast for text elements in footer and news sections, but exclude buttons */
.news-footer,
.news-footer p,
.news-footer span,
.news-footer div:not(.btn):not(.btn-primary):not(.btn-secondary):not(.btn-small),
.newsletter-signup p,
.newsletter-signup span,
.newsletter-signup h1,
.newsletter-signup h2,
.newsletter-signup h3,
.newsletter-signup h4,
.newsletter-signup h5,
.newsletter-signup h6,
.newsletter-signup div:not(.btn):not(.btn-primary):not(.btn-secondary):not(.btn-small),
.partnership-actions p,
.partnership-actions span,
.partnership-actions div:not(.btn):not(.btn-primary):not(.btn-secondary):not(.btn-small) {
    color: #333333 !important;
}

/* Specific fixes for partnership page elements */
.partnership-actions p,
.newsletter-signup .partnership-actions p {
    color: #333333 !important;
    font-weight: 500 !important;
}

/* Override for actual footer element (loaded via template) */
footer p,
footer span,
footer li {
    color: var(--color-white) !important;
}

/* Enhanced visual hierarchy for headings */
h1,
h2,
h3,
h4,
h5,
h6 {
    position: relative;
}

/* Removed problematic pseudo-elements that were showing as underscores */

/* Print styles */
@media print {

    /* Hide non-essential elements when printing */
    .no-print,
    nav,
    .modal,
    .dropdown-menu,
    .btn:not(.btn-print) {
        display: none !important;
    }

    /* Ensure readable text in print */
    body {
        font-size: 12pt;
        line-height: 1.4;
        color: #000;
        background: #fff;
    }

    /* Improve link handling in print */
    a::after {
        content: " (" attr(href) ")";
        font-size: 10pt;
        color: #000;
    }

    a[href^="mailto:"]::after,
    a[href^="tel:"]::after,
    a[href^="#"]::after,
    a[href^="javascript:"]::after {
        content: "";
    }
}

/* High contrast mode improvements */
@media (prefers-contrast: high) {
    :root {
        --shadow-base: 0 0 0 1px currentColor;
        --shadow-lg: 0 0 0 2px currentColor;
    }

    .card,
    .modal-dialog,
    .dropdown-menu {
        border: 2px solid currentColor;
    }
}

/* Dark mode support (future enhancement) - Disabled until full dark mode implementation */
/*
@media (prefers-color-scheme: dark) {
    :root {
        --color-bg-main: #1a1a1a;
        --color-bg-white: #2d2d2d;
        --color-text: #e0e0e0;
        --color-text-light: #b0b0b0;
        --color-gray-200: #404040;
        --color-gray-300: #4a4a4a;
    }

    img {
        filter: brightness(0.9) contrast(1.1);
    }
}
*/

/* Performance optimizations */
/* Enable GPU acceleration for animations */
.card:hover,
.btn:hover,
.interactive-element:hover,
.modal {
    will-change: transform;
}

/* Remove will-change after animation completes */
.card:not(:hover),
.btn:not(:hover),
.interactive-element:not(:hover) {
    will-change: auto;
}

/* Optimize font loading */
.hero h2,
.page-header h2 {
    font-display: swap;
}

/* Critical CSS for above-the-fold content */
.hero,
.page-header,
header {
    contain: layout style;
}

/* Reduce layout thrashing */
.grid,
.flex,
.card-grid {
    contain: layout;
}

/* Accessibility improvements */
/* Skip link enhancement */
.skip-link:focus {
    position: fixed;
    top: var(--spacing-sm);
    left: var(--spacing-sm);
    z-index: var(--z-tooltip);
    background: var(--color-primary);
    color: var(--color-white);
    padding: var(--spacing-sm) var(--spacing-md);
    border-radius: var(--radius-sm);
    text-decoration: none;
    font-weight: var(--font-weight-medium);
}

/* Screen reader improvements */
.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* Focus trap for modals */
.modal.show .modal-dialog {
    contain: focus;
}

/* Reduced motion preferences */
@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* Error state for development */
@supports not (display: grid) {
    .grid {
        display: flex;
        flex-wrap: wrap;
    }

    .grid>* {
        flex: 1 1 300px;
    }
}