/*
Theme Name: Campus Theme
Description: A modern block-based WordPress theme with light blue background and horizontal navigation
Version: 1.0
Author: Campus Service
Requires at least: 6.0
Tested up to: 6.4
Requires PHP: 7.4
License: GPL v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: campus-theme
Tags: block-themes, one-column, two-columns, wide-blocks, block-patterns, custom-colors, custom-spacing, custom-typography, threaded-comments, translation-ready
*/

/* 
 * Root Variables
 */
:root {
    --wp--preset--color--light-blue: #E8F4FD;
    --wp--preset--color--primary-blue: #2E86AB;
    --wp--preset--color--dark-blue: #1E5F7A;
    --wp--preset--color--white: #FFFFFF;
    --wp--preset--color--text-dark: #333333;
    --wp--preset--color--text-light: #666666;
    --wp--preset--color--border: #E0E0E0;
    
    --wp--preset--font-family--primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
    
    --wp--preset--spacing--10: 0.625rem;
    --wp--preset--spacing--20: 1.25rem;
    --wp--preset--spacing--30: 2rem;
    --wp--preset--spacing--40: 3rem;
    --wp--preset--spacing--50: 5rem;
}

/*
 * Global Styles
 */
body {
    background-color: var(--wp--preset--color--light-blue);
    font-family: var(--wp--preset--font-family--primary);
    color: var(--wp--preset--color--text-dark);
    line-height: 1.6;
    margin: 0;
    padding: 0;
}

/* 
 * Navigation Styles 
 */
.wp-block-navigation {
    background-color: var(--wp--preset--color--white);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    padding: var(--wp--preset--spacing--20) 0;
}

.wp-block-navigation .wp-block-navigation__container {
    justify-content: center;
    gap: var(--wp--preset--spacing--30);
}

.wp-block-navigation .wp-block-navigation-item a {
    color: var(--wp--preset--color--text-dark);
    text-decoration: none;
    font-weight: 500;
    padding: var(--wp--preset--spacing--10) var(--wp--preset--spacing--20);
    border-radius: 6px;
    transition: all 0.3s ease;
}

.wp-block-navigation .wp-block-navigation-item a:hover {
    background-color: var(--wp--preset--color--primary-blue);
    color: var(--wp--preset--color--white);
}

/*
 * Content Area
 */
.wp-site-blocks {
    padding: 0;
}

main {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--20);
}

/*
 * Block Styles
 */
.wp-block-group {
    margin-bottom: var(--wp--preset--spacing--30);
}

.wp-block-heading {
    color: var(--wp--preset--color--dark-blue);
    margin-bottom: var(--wp--preset--spacing--20);
}

.wp-block-paragraph {
    margin-bottom: var(--wp--preset--spacing--20);
}

/*
 * Footer Styles
 */
.wp-block-template-part.footer {
    background-color: var(--wp--preset--color--dark-blue);
    color: var(--wp--preset--color--white);
    margin-top: var(--wp--preset--spacing--50);
    padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--20);
}

.footer-content {
    max-width: 1200px;
    margin: 0 auto;
    text-align: center;
}

.footer-links {
    margin-bottom: var(--wp--preset--spacing--20);
}

.footer-links a {
    color: var(--wp--preset--color--white);
    text-decoration: none;
    margin: 0 var(--wp--preset--spacing--20);
    padding: var(--wp--preset--spacing--10);
    border-radius: 4px;
    transition: background-color 0.3s ease;
}

.footer-links a:hover {
    background-color: var(--wp--preset--color--primary-blue);
}

/*
 * Responsive Design
 */
@media (max-width: 768px) {
    .wp-block-navigation .wp-block-navigation__container {
        flex-direction: column;
        gap: var(--wp--preset--spacing--10);
    }
    
    main {
        padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--10);
    }
    
    .footer-links a {
        display: block;
        margin: var(--wp--preset--spacing--10) 0;
    }
}

/*
 * Utility Classes
 */
.has-light-blue-background-color {
    background-color: var(--wp--preset--color--light-blue) !important;
}

.has-primary-blue-background-color {
    background-color: var(--wp--preset--color--primary-blue) !important;
}

.has-dark-blue-background-color {
    background-color: var(--wp--preset--color--dark-blue) !important;
}

.has-white-background-color {
    background-color: var(--wp--preset--color--white) !important;
}