/**
 * Blueprint Theme - Spacing Helper Classes
 * ========================================
 * 
 * Moderne Helper-Classes für flexibles Spacing
 * Opt-in statt Default-Padding auf Sections
 */

/* ========================================
   CONTAINER RESET (kein Default-Padding)
   ======================================== */

/* Entry Content ohne Standard-Padding */
.entry-content {
    padding-top: 0;
    padding-bottom: 0;
}

/* Sections ohne Standard-Padding */
.blueprint-section,
section {
    padding-top: 0;
    padding-bottom: 0;
}

/* Site Main ohne Padding */
.site-main {
    padding-top: 0;
    padding-bottom: 0;
}

/* Blueprint Container ohne vertikales Padding */
.bp-container,
.bp-container-fluid,
.container,
.container-fluid {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* Pagebuilder Section ohne Default Padding */
.pagebuilder-section {
    padding-top: 0;
    padding-bottom: 0;
}

/* OVERRIDE: Alte bp-py-* Classes deaktivieren */
.bp-py-0,
.bp-py-1,
.bp-py-2,
.bp-py-3,
.bp-py-4,
.bp-py-5,
.bp-py-6,
.bp-py-7,
.bp-py-8 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}


/* ========================================
   SPACING HELPER CLASSES (Opt-in)
   ======================================== */

/* Padding Top */
.pt-0 { padding-top: 0 !important; }
.pt-xs { padding-top: 1rem !important; }      /* 16px */
.pt-sm { padding-top: 2rem !important; }      /* 32px */
.pt-md { padding-top: 3rem !important; }      /* 48px */
.pt-lg { padding-top: 4rem !important; }      /* 64px */
.pt-xl { padding-top: 6rem !important; }      /* 96px */
.pt-2xl { padding-top: 8rem !important; }     /* 128px */

/* Padding Bottom */
.pb-0 { padding-bottom: 0 !important; }
.pb-xs { padding-bottom: 1rem !important; }
.pb-sm { padding-bottom: 2rem !important; }
.pb-md { padding-bottom: 3rem !important; }
.pb-lg { padding-bottom: 4rem !important; }
.pb-xl { padding-bottom: 6rem !important; }
.pb-2xl { padding-bottom: 8rem !important; }

/* Padding Y (oben + unten) */
.py-0 { padding-top: 0 !important; padding-bottom: 0 !important; }
.py-xs { padding-top: 1rem !important; padding-bottom: 1rem !important; }
.py-sm { padding-top: 2rem !important; padding-bottom: 2rem !important; }
.py-md { padding-top: 3rem !important; padding-bottom: 3rem !important; }
.py-lg { padding-top: 4rem !important; padding-bottom: 4rem !important; }
.py-xl { padding-top: 6rem !important; padding-bottom: 6rem !important; }
.py-2xl { padding-top: 8rem !important; padding-bottom: 8rem !important; }

/* Padding X (links + rechts) */
.px-0 { padding-left: 0 !important; padding-right: 0 !important; }
.px-xs { padding-left: 1rem !important; padding-right: 1rem !important; }
.px-sm { padding-left: 2rem !important; padding-right: 2rem !important; }
.px-md { padding-left: 3rem !important; padding-right: 3rem !important; }
.px-lg { padding-left: 4rem !important; padding-right: 4rem !important; }
.px-xl { padding-left: 6rem !important; padding-right: 6rem !important; }

/* All Padding */
.p-0 { padding: 0 !important; }
.p-xs { padding: 1rem !important; }
.p-sm { padding: 2rem !important; }
.p-md { padding: 3rem !important; }
.p-lg { padding: 4rem !important; }
.p-xl { padding: 6rem !important; }

/* Margin Top */
.mt-0 { margin-top: 0 !important; }
.mt-xs { margin-top: 1rem !important; }
.mt-sm { margin-top: 2rem !important; }
.mt-md { margin-top: 3rem !important; }
.mt-lg { margin-top: 4rem !important; }
.mt-xl { margin-top: 6rem !important; }
.mt-2xl { margin-top: 8rem !important; }

/* Margin Bottom */
.mb-0 { margin-bottom: 0 !important; }
.mb-xs { margin-bottom: 1rem !important; }
.mb-sm { margin-bottom: 2rem !important; }
.mb-md { margin-bottom: 3rem !important; }
.mb-lg { margin-bottom: 4rem !important; }
.mb-xl { margin-bottom: 6rem !important; }
.mb-2xl { margin-bottom: 8rem !important; }

/* Margin Y */
.my-0 { margin-top: 0 !important; margin-bottom: 0 !important; }
.my-xs { margin-top: 1rem !important; margin-bottom: 1rem !important; }
.my-sm { margin-top: 2rem !important; margin-bottom: 2rem !important; }
.my-md { margin-top: 3rem !important; margin-bottom: 3rem !important; }
.my-lg { margin-top: 4rem !important; margin-bottom: 4rem !important; }
.my-xl { margin-top: 6rem !important; margin-bottom: 6rem !important; }

/* Margin X */
.mx-auto { margin-left: auto !important; margin-right: auto !important; }
.mx-0 { margin-left: 0 !important; margin-right: 0 !important; }


/* ========================================
   SECTION HELPER CLASSES
   ======================================== */

/* Standard Section mit Padding */
.section-padded {
    padding-top: 4rem;
    padding-bottom: 4rem;
}

/* Hero Section (kein Padding) */
.section-hero {
    padding-top: 0;
    padding-bottom: 0;
}

/* Kompakte Section */
.section-compact {
    padding-top: 2rem;
    padding-bottom: 2rem;
}

/* Große Section */
.section-spacious {
    padding-top: 6rem;
    padding-bottom: 6rem;
}


/* ========================================
   CONTAINER HELPER CLASSES
   ======================================== */

/* Vollbreite (kein Padding, kein Container) */
.full-width {
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    padding-left: 0;
    padding-right: 0;
}

/* Container mit max-width */
.container-narrow {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem;
    padding-right: 1rem;
}

.container-medium {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem;
    padding-right: 1rem;
}

.container-wide {
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem;
    padding-right: 1rem;
}


/* ========================================
   RESPONSIVE SPACING
   ======================================== */

/* Mobile: Weniger Padding */
@media (max-width: 768px) {
    .py-sm { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; }
    .py-md { padding-top: 2rem !important; padding-bottom: 2rem !important; }
    .py-lg { padding-top: 3rem !important; padding-bottom: 3rem !important; }
    .py-xl { padding-top: 4rem !important; padding-bottom: 4rem !important; }
    
    .section-padded {
        padding-top: 2rem;
        padding-bottom: 2rem;
    }
    
    .section-spacious {
        padding-top: 3rem;
        padding-bottom: 3rem;
    }
}

/* Tablet */
@media (min-width: 769px) and (max-width: 1024px) {
    .py-xl { padding-top: 5rem !important; padding-bottom: 5rem !important; }
    
    .section-spacious {
        padding-top: 5rem;
        padding-bottom: 5rem;
    }
}


/* ========================================
   SPEZIELLE HELPER
   ======================================== */

/* Kein Abstand zur Navigation */
.no-header-space {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Negative Margin (unter sticky header) */
.pull-under-header {
    margin-top: -80px;
    padding-top: 80px;
}

/* Kein Abstand zum Footer */
.no-footer-space {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* ========================================
   BLUEPRINT PADDING EXTENSIONS (bp-p-*, bp-px-*)
   ======================================== */

/* All Padding */
.bp-p-0 { padding: 0 !important; }
.bp-p-1 { padding: 0.25rem !important; }
.bp-p-2 { padding: 0.5rem !important; }
.bp-p-3 { padding: 1rem !important; }
.bp-p-4 { padding: 1.5rem !important; }
.bp-p-5 { padding: 3rem !important; }

/* Padding X (left + right) */
.bp-px-0 { padding-left: 0 !important; padding-right: 0 !important; }
.bp-px-1 { padding-left: 0.25rem !important; padding-right: 0.25rem !important; }
.bp-px-2 { padding-left: 0.5rem !important; padding-right: 0.5rem !important; }
.bp-px-3 { padding-left: 1rem !important; padding-right: 1rem !important; }
.bp-px-4 { padding-left: 1.5rem !important; padding-right: 1.5rem !important; }
.bp-px-5 { padding-left: 3rem !important; padding-right: 3rem !important; }