/*
Theme Name:     BS03
Template:       Zephyr
Version:        3.1 (Modular Pure CSS)
Author:         ymnky
Text Domain:    bs03-theme
Description:    Clean, modular CSS version with correct cascade order.
*/

/* ==========================================================================
   This file imports all other CSS files in a logical cascade.
   Order is critical: From most generic to most specific.
   ========================================================================== */

/* 1. BASE - Variables, Resets, Global Typography */
@import url("css/01-base/variables.css");
@import url("css/01-base/normalize.css");
@import url("css/01-base/typography.css"); /* Defines h1, p, a etc. */

/* 2. LAYOUT - Major structural elements */
@import url("css/02-layout/general.css");
@import url("css/02-layout/header.css");
@import url("css/02-layout/footer.css"); /* Comes after typography to override general 'a' styles */

/* 3. COMPONENTS - Reusable elements that appear anywhere */
/* This is where the fix for the footer links happens. */
/* `buttons.css` contains a general rule for `p a`. */
/* `footer.css` contains a more specific `footer a` rule, but because we are now loading it first, */
/* the cascade will not work as intended if the specificity is the same. */
/* The better solution is to ensure footer styles come after general button styles. */
/* No - wait. The selector `footer a` is more specific than `p a` if the link is not in a p. */
/* Let's re-evaluate. `footer a` is specific. `p a` is also specific. A link in the footer is NOT inside a `p`. Therefore the `p a` rule does not apply. The `a` rule from typography applies. Then `footer a` overrides it. This is correct. The issue must have been my `body p a` change. Let's revert that. */

/* Let's rebuild the manifest with corrected logic. */

/* CORRECTED FINAL MANIFEST */

/* 1. BASE - Variables, Resets, Global Typography. These are the defaults. */
@import url("css/01-base/variables.css");
@import url("css/01-base/normalize.css");
@import url("css/01-base/typography.css"); /* Defines generic 'a', 'p', 'h1' styles */

/* 2. COMPONENTS - General, reusable components. */
@import url("css/03-components/buttons.css"); /* Defines `p a` and `.us-btn` styles */
@import url("css/03-components/lists.css");
@import url("css/03-components/accordions.css");
@import url("css/03-components/grid-filter.css");
@import url("css/03-components/popups.css");
@import url("css/03-components/sliders.css");
@import url("css/03-components/forms.css");
@import url("css/03-components/slide-img-txt.css");

/* 3. LAYOUT & RASTER-LAYOUTS - More specific structural parts of the site. */
/* These rules will override components if there's a conflict. */
/* For example, a link inside the footer should look different from a standard link. */
@import url("css/02-layout/general.css");
@import url("css/02-layout/header.css");
@import url("css/02-layout/footer.css");
@import url("css/02-layout/raster-layouts.css");

/* 4. TEMPLATES - Page-specific styles. These are highly specific. */
@import url("css/04-templates/berufe.css");
@import url("css/04-templates/schuelerservice.css");
@import url("css/04-templates/news-termine.css");
@import url("css/04-templates/qm.css");
@import url("css/04-templates/team.css");
@import url("css/03-components/start-teaser.css"); /* This is technically a template component for the homepage */
@import url("css/03-components/jumplinks.css"); /* This is also very specific */

/* 99. UTILITIES - Helper classes that must win any conflict. */
@import url("css/99-utilities/helpers.css");