/**
 * Nilea Global Layout Styles
 *
 * Common container styles for all templates (departments, officers, events)
 * This file centralizes layout styling for better maintainability
 * 
 * @package Nilea_Plugin
 */

/**
 * Global Container Structure
 */
.main-wrap {
    width: 100%;
}

/* Page banner section - commented out to avoid conflicts with theme styling */
/* These styles should come from the theme */
/*
.intro-wrap {
    width: 100%;
}

.banner {
    width: 100%;
    background-color: #f8f9fa;
}

.banner-short {
    padding: 2rem 0;
    margin-bottom: 2rem;
}

.banner-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1rem;
    width: 100%;
    box-sizing: border-box;
}

.banner-inner {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.banner-text-wrap {
    text-align: center;
}

/* Headline styles */
.headline-wrap {
    margin-bottom: 1rem;
}

.headline {
    margin: 0;
    padding: 0;
    color: #333;
    font-size: 2.5rem;
    line-height: 1.2;
}
.main-container-no-padding{ padding: 0 0 !important;}
.banner-container-no-padding{
    padding-left: 0 !important;
    padding-right: 0 !important;
}
.banner-container-no-padding .banner-inner {
    padding-top: var(--wp--custom--spacer--md) !important;
    padding-bottom: var(--wp--custom--spacer--md) !important;
}
.nilea-wrap .main-boxed, .nilea-wrap .main-sidebar {
    padding-top: var(--wp--custom--spacer--md) !important;
    padding-bottom: var(--wp--custom--spacer--md) !important;
}
*/

/* Description text in banners - commented out to avoid conflicts with theme styling */
/* These styles should come from the theme */
/*
.term-description,
.archive-description {
    max-width: 800px;
    margin: 0 auto 1rem;
    font-size: 1.1rem;
    line-height: 1.6;
    color: #555;
}
*/

/* Main content section - commented out to avoid conflicts with theme styling */
/* These styles should come from the theme */
/*
.main {
    width: 100%;
}

.main-boxed {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0rem !important;
    width: 100%;
    box-sizing: border-box;
}

.main-container {
    width: 100%;
}

.main-inner {
    width: 100%;
}

/* Content area */
.content {
    width: 100%;
}
*/

/**
 * Common Buttons
 */
.btn {
    display: inline-block;
    padding: 0.5rem 1rem;
    text-decoration: none;
    border-radius: 4px;
    transition: all 0.2s ease;
    font-weight: 500;
    border: none;
    cursor: pointer;
}

.btn-primary {
    background-color: #0073aa;
    color: white;
}

.btn-primary:hover {
    background-color: #005177;
    color: white;
}

.btn-sm {
    padding: 0.3rem 0.75rem;
    font-size: 0.875rem;
}

/**
 * Common Elements
 */

/* Pagination */
.pagination {
    margin: 2rem 0;
    text-align: center;
}

.pagination .page-numbers {
    display: inline-block;
    padding: 0.5rem 0.75rem;
    margin: 0 0.25rem;
    border: 1px solid #ddd;
    border-radius: 4px;
    text-decoration: none;
    color: #333;
}

.pagination .page-numbers.current {
    background-color: #0073aa;
    color: white;
    border-color: #0073aa;
}

.pagination .page-numbers:hover:not(.current) {
    background-color: #f5f5f5;
}

/* No results */
.no-results {
    text-align: center;
    padding: 2rem;
    background-color: #f8f9fa;
    border-radius: 8px;
    margin: 2rem 0;
}

/**
 * Legacy support
 */
/* Support for older template container styles */
.departments-archive-container,
.officers-archive-container,
.events-archive-container,
.departments-single-container,
.officers-single-container,
.event-single-container,
.events-taxonomy-container {
    max-width: 1200px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0rem 0rem;
    width: 100% !important;
    box-sizing: border-box;
}

/* Legacy page headers - commented out to avoid conflicts with theme styling */
/* These styles should come from the theme */
/*
.page-header {
    margin-bottom: 2rem;
    text-align: center;
}

.page-title {
    font-size: 2.5rem;
    margin-bottom: 1rem;
    color: #333;
}
*/

/**
 * Responsive Adjustments
 */
@media (max-width: 768px) {
    .headline {
        font-size: 2rem;
    }
    
    .banner-short {
        padding: 1.5rem 0;
    }
}