/* ============================================================================
   LS FABRICATION — LAYOUT
   Header, store page header, sidebar, footer, breadcrumbs.
   ========================================================================= */

/* The site header is built in the Divi Theme Builder. This only guarantees it
   stacks above builder content — Divi's own z-index on .et_builder_inner_content
   otherwise lets sticky sections slide over the nav. */
header#main-header,
.et-l--header {
    position: relative;
    z-index: 999;
}
header .et_builder_inner_content,
.et-db #et-boc .et-l .et_builder_inner_content { z-index: auto; }

/* ============================================================================
   STORE PAGE HEADER
   The title + breadcrumb block printed by lsfab_page_title().
   ========================================================================= */

#ecommerce-custom-header {
    padding: var(--ls-space-7) 0 var(--ls-space-5);
}
#ecommerce-custom-header .page-title {
    margin: 0 0 var(--ls-space-3);
    font-size: var(--ls-h1);
    line-height: var(--ls-leading-tight);
}

.woocommerce .woocommerce-breadcrumb {
    margin: 0;
    padding: 0;
    font-family: var(--ls-font-body);
    font-size: var(--ls-small);
    color: var(--ls-text-soft);
}
.woocommerce .woocommerce-breadcrumb a { color: var(--ls-text-soft); }
.woocommerce .woocommerce-breadcrumb a:hover { color: var(--ls-red); }

/* ============================================================================
   SHOP LAYOUT
   ========================================================================= */

.woocommerce #main-content .container { padding-top: 0; }

#sidebar { padding-top: 0; }

.woocommerce .term-img {
    display: block;
    width: 100%;
    height: auto;
    margin: 0 0 var(--ls-space-5);
    border-radius: var(--ls-radius-lg);
}

.woocommerce .woocommerce-result-count {
    margin: 0;
    font-size: var(--ls-small);
    color: var(--ls-text-soft);
}
.woocommerce .woocommerce-ordering { margin: 0 0 var(--ls-space-5); }
.woocommerce .woocommerce-ordering select.orderby {
    width: auto;
    min-width: 220px;
    min-height: var(--ls-control-h-sm);
}

/* ============================================================================
   FOOTER
   Built in the Theme Builder; this keeps its type consistent with the rest.
   ========================================================================= */

.et-l--footer h1, .et-l--footer h2, .et-l--footer h3,
.et-l--footer h4, .et-l--footer h5, .et-l--footer h6 {
    font-family: var(--ls-font-display);
    letter-spacing: 0.02em;
    text-transform: uppercase;
}
.et-l--footer a { color: var(--ls-text-muted); }
.et-l--footer a:hover { color: var(--ls-red); }

/* ============================================================================
   PAGE CANVAS
   Divi's style-static.min.css paints #main-content white and only clears it
   for builder-built pages, via `.page.et_pb_pagebuilder_layout #main-content`.
   Any page Divi did NOT build -- search results, 404, blog archives, account
   sub-pages, plain WooCommerce pages -- therefore falls back to white on a
   black site. The cart/checkout/account pages only escape it because they
   happen to be builder-built and carry that class.

   Painted here with !important on the two ID selectors so the canvas never
   depends on a Divi page setting or on Divi's per-template cached inline CSS,
   which has already been observed missing on some page types (see the footer
   background regression, Aug 31 2026).

   .et_pb_post is deliberately NOT !important: Divi's own
   `.et_pb_blog_grid .et_pb_post` rule is more specific and must keep winning,
   because the Additional CSS intentionally paints blog-GRID cards white.
   ========================================================================= */

#main-content,
#left-area {
    background-color: transparent !important;
}

.et_pb_post {
    background-color: transparent;
}