/*
Theme Name: Ignitein
Theme URI: https://example.com/ignitein
Author: Ignitein Team
Author URI: https://example.com
Description: A modern, elegant and powerful WordPress theme with stunning design and smooth animations.
Version: 1.0.0
Requires at least: 5.0
Tested up to: 6.4
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ignitein
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready, blog, portfolio, one-column, two-columns
*/

/* ========================================
   IMPORTANT: This theme uses Tailwind CSS CDN
   Most styling is done via Tailwind utility classes
   This file contains only WordPress-required styles
   and components that need custom CSS
   ======================================== */

/* ========================================
   CSS Variables - Design Tokens
   ======================================== */
:root {
    /* Primary Colors - NCA Dark Blue Theme */
    --ignitein-primary: #0a1628;
    --ignitein-primary-light: #1a2942;
    --ignitein-primary-dark: #060d17;

    /* Secondary Colors */
    --ignitein-secondary: #1e3a5f;
    --ignitein-secondary-light: #2d4a6f;
    --ignitein-secondary-dark: #0f2a4f;

    /* Accent Colors - Orange */
    --ignitein-accent: #f59e0b;
    --ignitein-accent-light: #fbbf24;
    --ignitein-accent-dark: #d97706;

    /* Neutral Colors */
    --ignitein-dark: #0a1628;
    --ignitein-gray: #64748b;
    --ignitein-gray-light: #94a3b8;
    --ignitein-light: #f3f4f6;
    --ignitein-white: #ffffff;
}

/* ========================================
   Reset - Let Tailwind handle most of this
   ======================================== */
*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    overflow-x: hidden;
}

body {
    overflow-x: hidden;
}

/* ========================================
   WordPress Core Classes (Required)
   ======================================== */
.alignnone {
    margin: 1rem 0;
}

.aligncenter {
    display: block;
    margin: 1rem auto;
}

.alignleft {
    float: left;
    margin: 0 1rem 1rem 0;
}

.alignright {
    float: right;
    margin: 0 0 1rem 1rem;
}

.wp-caption {
    max-width: 100%;
}

.wp-caption-text {
    font-size: 0.875rem;
    color: #64748b;
    margin-top: 0.5rem;
}

.screen-reader-text {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* ========================================
   WordPress Gallery
   ======================================== */
.gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 1rem;
    margin: 1.5rem 0;
}

.gallery-item {
    margin: 0;
}

.gallery-icon img {
    width: 100%;
    height: auto;
    border-radius: 0.5rem;
}

/* ========================================
   WordPress Blocks Support
   ======================================== */
.wp-block-image img {
    max-width: 100%;
    height: auto;
}

.has-text-align-center {
    text-align: center;
}

.has-text-align-left {
    text-align: left;
}

.has-text-align-right {
    text-align: right;
}

/* ========================================
   Custom Scrollbar (Optional)
   ======================================== */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: #f1f5f9;
}

::-webkit-scrollbar-thumb {
    background: #94a3b8;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #64748b;
}

/* ========================================
   Print Styles
   ======================================== */
@media print {

    .site-header,
    .site-footer,
    .back-to-top,
    .mobile-menu-toggle {
        display: none !important;
    }

    .site-main {
        padding: 0;
    }
}

/* ========================================
   Elementor Full Width Support
   ======================================== */
.elementor-full-width-content {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
}

.elementor-full-width-content>.elementor {
    width: 100%;
}

/* Remove container constraints for fullwidth sections */
.page-template-template-elementor-fullwidth .site-main,
.page-template-template-elementor-canvas .site-main {
    max-width: 100%;
    padding: 0;
    margin: 0;
}

/* Elementor section fullwidth */
.elementor-section.elementor-section-full_width,
.elementor-section-stretched {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
    margin-right: calc(-50vw + 50%) !important;
}

/* Fix container inside fullwidth sections */
.elementor-section.elementor-section-boxed>.elementor-container {
    max-width: 1200px;
    margin: 0 auto;
}

/* Canvas template - no header spacing */
.page-template-template-elementor-canvas .site-main {
    margin-top: 0;
}

/* ========================================
   Remove ALL padding/margin for Elementor
   ======================================== */

/* Remove body padding */
body.elementor-page,
body.elementor-default,
body.page-template-template-elementor-fullwidth,
body.page-template-template-elementor-canvas {
    margin: 0;
    padding: 0;
}

/* Remove article and entry-content padding */
.elementor-page article,
.elementor-page .entry-content,
.page-template-template-elementor-fullwidth article,
.page-template-template-elementor-fullwidth .entry-content,
.page-template-template-elementor-canvas article,
.page-template-template-elementor-canvas .entry-content {
    margin: 0 !important;
    padding: 0 !important;
    max-width: 100% !important;
}

/* Remove main container max-width */
.elementor-page .site-main,
.page-template-template-elementor-fullwidth .site-main {
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Remove Elementor default gaps */
.elementor-widget-wrap,
.elementor-element {
    margin-bottom: 0;
}

/* Hero banner specific - full bleed */
.ignitein-hero-banner {
    margin: 0 !important;
    padding: 0 !important;
    width: 100vw;
    margin-left: calc(-50vw + 50%) !important;
}

/* Elementor section - remove default margin/padding */
.elementor-section {
    margin-bottom: 0;
}

.elementor-section.elementor-section-full_width {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Remove post content wrapper padding */
.elementor-page .post-content,
.page-template-template-elementor-fullwidth .post-content {
    padding: 0 !important;
}

/* ========================================
   Fix top white gap for Hero Banner
   ======================================== */

/* Remove ALL top margins on Elementor pages */
.elementor-page #page,
.elementor-page .site,
.elementor-page .site-main,
.elementor-page #primary,
.elementor-page article,
.elementor-page .entry-content,
.elementor-page .elementor,
.page-template-template-elementor-fullwidth #page,
.page-template-template-elementor-fullwidth .site,
.page-template-template-elementor-fullwidth .site-main,
.page-template-template-elementor-fullwidth #primary,
.page-template-template-elementor-fullwidth article,
.page-template-template-elementor-fullwidth .entry-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* First section should have no top margin */
.elementor-page .elementor-section:first-child,
.elementor-page .elementor-element:first-child,
.page-template-template-elementor-fullwidth .elementor-section:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Body reset for Elementor pages */
body.elementor-page,
body.page-template-template-elementor-fullwidth {
    margin: 0 !important;
    padding: 0 !important;
}

/* ========================================
   Elementor Section/Widget Margin Reset
   ======================================== */

/* Remove ALL section margins */
.elementor-section {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Remove widget container margins */
.elementor-widget-container {
    margin: 0 !important;
}

/* Elementor column gaps */
.elementor-column-gap-default>.elementor-column>.elementor-element-populated {
    padding: 0 !important;
}

/* Remove gap between sections */
.elementor-top-section {
    margin-bottom: 0 !important;
}

/* Remove inner section padding */
.elementor-inner-section {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Force sections to touch each other */
.elementor-section+.elementor-section {
    margin-top: 0 !important;
}

/* ========================================
   Nuclear Option - Remove ALL Gaps
   ======================================== */

/* Elementor page wrapper */
.elementor .elementor-inner,
.elementor .elementor-section-wrap {
    margin: 0 !important;
    padding: 0 !important;
}

/* All elements inside Elementor */
.elementor-element {
    margin-bottom: 0 !important;
}

/* Widget wrapper - force no margin */
.elementor-widget:not(:last-child) {
    margin-bottom: 0 !important;
}

/* Section wrapper */
.elementor-top-section,
.elementor-section-wrap>.elementor-section {
    margin: 0 !important;
    padding: 0 !important;
}

/* Entry content should have no padding */
.entry-content,
.elementor-full-width-content {
    margin: 0 !important;
    padding: 0 !important;
}

/* Article wrapper */
article.post,
article.page {
    margin: 0 !important;
    padding: 0 !important;
}

/* Site main */
.site-main {
    padding: 0 !important;
    margin: 0 !important;
}

/* Elementor column default padding reset */
.elementor-column-gap-default>.elementor-row>.elementor-column>.elementor-element-populated,
.elementor-column-gap-default>.elementor-column>.elementor-element-populated {
    padding: 0 !important;
}

/* After hero - next element */
.elementor-widget-ignitein_hero_banner~.elementor-section,
.elementor-widget-ignitein_hero_banner~.elementor-widget {
    margin-top: 0 !important;
}

/* ========================================
   Elementor Container (.e-con) Reset
   ======================================== */

/* Remove default 10px padding from Elementor containers */
.e-con {
    --padding-top: 0px !important;
    --padding-bottom: 0px !important;
    --padding-left: 0px !important;
    --padding-right: 0px !important;
    padding: 0 !important;
}

/* Container inner */
.e-con-inner {
    padding: 0 !important;
    margin: 0 !important;
}

/* If you want to keep horizontal padding for content width, use this instead */
.e-con.e-con-full {
    --padding-left: 0px !important;
    --padding-right: 0px !important;
}

/* For containers that SHOULD have padding (like inner content sections), 
   you can add a custom class in Elementor and override here */
.e-con.keep-padding {
    --padding-top: 10px;
    --padding-bottom: 10px;
    --padding-left: 10px;
    --padding-right: 10px;
    padding: var(--padding-top) var(--padding-right) var(--padding-bottom) var(--padding-left);
}