/**
 * Main Theme Styles
 * 
 * Minimal base styles for non-Elementor pages
 * Elementor pages use their own styling system
 */

/* ===== Base Reset ===== */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    font-size: 16px;
    line-height: 1.6;
    color: #333;
    background: #fff;
}

/* ===== Container for Elementor Pages ===== */
.elementor-page #page,
.elementor-default #page {
    width: 100%;
    max-width: none;
}

.elementor-page .site-main,
.elementor-default .site-main {
    width: 100%;
    max-width: none;
    padding: 0;
    margin: 0;
}

/* ===== Hide theme header/footer for full-width Elementor ===== */
.elementor-template-canvas .site-header,
.elementor-template-canvas .site-footer {
    display: none;
}

/* ===== Basic Layout for Non-Elementor Pages ===== */
.site {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.site-main {
    flex: 1;
    width: 100%;
}

/* Default contained layout */
.site-main:not(.site-main-full-width) > .content-area:not(.lemont-full-width-content) {
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 20px;
}

/* Full width main area */
.site-main-full-width {
    width: 100%;
    max-width: none !important;
    padding: 0;
    margin: 0;
}

.site-main-full-width > .content-area,
.site-main-full-width > .lemont-full-width-content {
    width: 100%;
    max-width: none !important;
    padding: 0;
    margin: 0;
}

/* ===== Links ===== */
a {
    color: #0073aa;
    text-decoration: none;
    transition: color 0.2s ease;
}

a:hover {
    color: #005177;
}

/* ===== Headings ===== */
h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: 1rem;
}

h1 { font-size: 2.5em; }
h2 { font-size: 2em; }
h3 { font-size: 1.75em; }
h4 { font-size: 1.5em; }
h5 { font-size: 1.25em; }
h6 { font-size: 1em; }

/* ===== Images ===== */
img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* ===== Screen Reader Text ===== */
.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
    word-wrap: normal !important;
}

.screen-reader-text:focus {
    background-color: #f1f1f1;
    border-radius: 3px;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    clip: auto !important;
    color: #21759b;
    display: block;
    font-size: 14px;
    font-weight: bold;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000;
}

/* ===== LemonT Full Width Template ===== */
.lemont-full-width-content,
.lemont-full-width {
    width: 100%;
    max-width: none !important;
    padding: 0;
    margin: 0;
}

/* Full width content area - no max-width restriction */
.lemont-full-width-content .entry-content,
.lemont-full-width-content .entry-content.full-width-content {
    width: 100%;
    max-width: none;
    padding: 0;
    margin: 0;
}

/* If you want contained text within full-width, use this class */
.lemont-full-width .entry-content:not(.full-width-content) {
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 20px;
}

/* Elementor full width support */
.elementor-page .lemont-full-width-content,
.elementor-page .site-main {
    width: 100%;
    max-width: none !important;
    padding: 0;
    margin: 0;
}

/* Elementor sections should be full width */
.lemont-full-width-content .elementor-section.elementor-section-boxed > .elementor-container {
    max-width: 1200px;
}

.lemont-full-width-content .elementor-section.elementor-section-full_width > .elementor-container {
    max-width: none;
}

/* ===== LemonT Canvas Template (No Header/Footer) ===== */
.lemont-canvas {
    min-height: 100vh;
}

.lemont-canvas-content {
    width: 100%;
    min-height: 100vh;
}

.lemont-no-header-footer .site-header,
.lemont-no-header-footer .site-footer,
.lemont-no-header-footer #masthead,
.lemont-no-header-footer #colophon {
    display: none !important;
}

/* ===== Responsive ===== */
@media (max-width: 768px) {
    .site-main {
        padding: 20px 15px;
    }
    
    h1 { font-size: 2em; }
    h2 { font-size: 1.75em; }
    h3 { font-size: 1.5em; }
    
    .lemont-full-width .entry-content {
        padding: 20px 15px;
    }
}