/**
 * Helix Ultimate (InfiNet patches) — template-level custom.css
 *
 * This file ships in the Helix package and applies to every client site.
 * Only GENERIC template-level fixes belong here. Site-specific rules
 * (page/section IDs, brand colors, client content IDs, etc.) go into
 *   Template Options -> Custom Code -> Custom CSS
 * so they're editable via the Joomla admin GUI and stay per-site.
 *
 * History: earlier iterations of this file accumulated site-specific
 * rules from a single client (InfiNet) and then got shipped to every
 * other client via the package zip — cross-contamination. 2.4.3 moves
 * that content to the per-site DB param (params.custom_css).
 */

/* ── Sticky logo swap: show logo-sticky variant only when header is sticky (≥md) ── */
#sp-header .logo .logo-sticky {
    display: none !important;
}
@media (min-width: 768px) {
    #sp-header.header-sticky .logo-sticky {
        display: inline-block !important;
    }
    #sp-header.header-sticky .logo-default {
        display: none !important;
    }
}

/* Header uses standard Bootstrap container (breakpoint-capped widths
   540/720/960/1140/1320). Navigation sits inside the bounded container
   so it's not flush to the viewport's right edge — there's natural
   margin from the screen on both sides. */

/* ── Body must not clip top of page (common Joomla + SPPB overflow trap) ── */
html, body {
    overflow-x: hidden !important;
    overflow-y: visible !important;
}
html body.site {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
html body .body-wrapper,
html body .body-innerwrapper {
    overflow: visible !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* ── Top bar: consistent padding + overflow handling.
   Color comes from $topbar_text_color via theme.scss.
   Note: NO `display` rule here. Header layouts opt in/out of the topbar via
   markup (e.g. 11-MultiRowContact emits #sp-header-topbar with d-none); a
   `display: block !important` here would override that and double-render. ── */
/* (Removed in v2.4.59 — opinionated `html body #sp-top-bar { padding: 20px 0
 * !important; ... }` cascade-hack reset block. The padding override
 * silently broke the new topbar_padding_y template param: admin saved
 * 8px in the GUI but the rendered output stayed 20px because this rule's
 * `html body` specificity + !important won. The other resets in the
 * block (margin: 0, min-height: 0, transform: none, etc.) were "InfiNet
 * had problems and forced these to defaults" — opinionated, not generic.
 * Auto-preserve mechanism in script.php captures any non-baseline rules
 * from the OLD on-disk custom.css into per-site params.custom_css, so
 * sites that depended on these get them carried forward; sites that
 * didn't will simply use the param-driven values. Net: param works. */

/* ── Responsive iframes (maps, YouTube, etc.) don't overflow content ── */
iframe {
    max-width: 100% !important;
}

/* (Removed in v2.4.39 — site-specific InfiNet brand wash) The InfiNet
 * blue/orange page-background gradient that lived here was painting the
 * content area of every client site with InfiNet brand colors. The
 * shipped package no longer ships this. Sites that genuinely want a
 * tinted page wash should set it via their own params.custom_css
 * (Template Options -> Custom Code -> Custom CSS). The install script's
 * auto-preserve mechanism captures the previous on-disk custom.css and
 * copies any rules NOT in the new baseline into params.custom_css for
 * each template_styles row, so sites that depended on the wash keep
 * rendering identically until the admin reviews/edits the preserved block. */

/* ── FAQ accordion (SPPB): make it obvious titles are clickable ── */
.sppb-addon-accordion .sppb-panel-heading {
    cursor: pointer !important;
    transition: background-color .2s ease, color .2s ease !important;
}
.sppb-addon-accordion .sppb-panel-heading:hover,
.sppb-addon-accordion .sppb-panel-heading:hover .sppb-panel-title,
.sppb-addon-accordion .sppb-panel-heading:hover .sppb-panel-title a {
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
}

/* ── Center images in SPPB columns marked sppb-align-items-center ── */
html body .sppb-column.sppb-align-items-center > .sppb-column-addons {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}
html body .sppb-column.sppb-align-items-center .sppb-addon-single-image-container {
    display: flex !important;
    justify-content: center !important;
}
html body .sppb-column.sppb-align-items-center .sppb-addon-single-image-container img {
    margin: 0 auto !important;
}

/* ── Floated images in article/content body: breathing room between image
 *    edge and wrapping text. .pull-left / .pull-right are the legacy Bootstrap
 *    utility names still emitted by Joomla's content editors. align="left/right"
 *    covers old-school HTML attribute usage. Small bottom margin so the line
 *    beneath the image isn't flush to its bottom edge either. ── */
img.pull-left,
img[align="left"] {
    float: left;
    margin: 0 1.25rem 0.75rem 0;
}
img.pull-right,
img[align="right"] {
    float: right;
    margin: 0 0 0.75rem 1.25rem;
}

/* ── SP PageBuilder Articles family: long unhyphenated strings (registry paths,
 *    URLs, code identifiers in technical posts) overflow card boundaries by
 *    default. Force them to wrap at any character so they stay inside the
 *    card. Applies to the Articles addon (any layout) and Articles Scroller. ── */
.sppb-addon-articles .sppb-article-info-wrap,
.sppb-addon-articles .sppb-article-info-wrap *,
.sppb-addon-articles .sppb-article-introtext,
.sppb-articles-carousel-content,
.sppb-articles-carousel-content *,
.sppb-articles-scroller-content,
.sppb-articles-scroller-content * {
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* ── SP PageBuilder JS Slideshow (sppb-sp-slider-*): vendor sppagebuilder.css
 *    sets `word-break: break-word` on slider title/text/image layers, which is
 *    the legacy non-standard alias for `overflow-wrap: anywhere`. That makes
 *    the layer's min-content size collapse to one character, so titles and body
 *    copy break MID-WORD inside the slide instead of wrapping at spaces. Reset
 *    to normal word-breaking; let `overflow-wrap: break-word` only kick in for
 *    genuinely unbreakable strings (long URLs, etc.) as a last resort. ── */
.sppb-sp-slider-text,
.sppb-sp-slider-title,
.sppb-sp-slider-image {
    word-break: normal;
    overflow-wrap: break-word;
}

/* ── Collapse the title section when no module is published to the 'title'
 *    position. Helix renders #sp-section-1 with vertical padding even when
 *    its only child (#sp-title > .sp-column) has no content, leaving a gap
 *    between the header and main body on every such page. ── */
#sp-section-1:has(#sp-title > .sp-column:empty),
#sp-section-1:has(> .row > #sp-title:empty) {
    display: none;
}

/* (Removed in v2.4.39 — single-client payment-form fixes that targeted
 * #square-amount and [id^="paypal-form-fields-container-"]. Both selectors
 * only exist on InfiNet's "Make A Payment" page; the rules were inert on
 * every other client site but shipped as bloat. Sites that need them
 * should set them via their own params.custom_css. Auto-preserve will
 * carry them forward for sites that previously rendered them in the
 * shipped custom.css.) */

/* The header's #sp-menu column is rendered as <div class="col-auto flex-auto">.
 * Bootstrap loads after Helix in the page <head>, so its `.col-auto{flex:none}`
 * rule wins over Helix's `.flex-auto{flex:auto}` (equal specificity, later
 * declaration). Result: #sp-menu shrinks to its content, parking the hamburger
 * roughly in the middle of the header instead of at the right edge.
 * Promoting the rule to ID specificity beats Bootstrap's class rule cleanly. */
#sp-menu { flex: auto; }

/* SPPB rows are flex containers; when columns wrap to a stacked layout on
 * mobile they collide vertically because the framework only sets horizontal
 * gutters. row-gap is the native flex primitive for that. */
@media (max-width: 991.98px) {
    .sp-page-builder .sppb-row { row-gap: 1.25rem; }
}

/* Hide Joomla frontend admin edit indicators (visible when logged in)
   so they don't reserve layout space on public-facing pages. */
.btn.jmodedit,
body > .btn.jmodedit,
.jfedit-menu,
.popover .jfedit-menu,
a.btn-edit,
.icons > .btn-edit,
.edit-icon,
.contentpane-modal-edit { display: none !important; }
.jmoddiv.jmodinside { padding: 0 !important; margin: 0 !important; }

/* Helix unconditionally renders <section id="sp-section-1"> wrapping the
 * #sp-title position even when no module/title is published into it.
 * Result: every page where the page-title position is empty has a wasted
 * empty section between the header and #sp-main-body. Detect the empty
 * inner column and collapse the whole wrapper. The :only-child guard
 * keeps the rule inert on pages that DO publish a real title module
 * (since the .sp-column would then have content siblings or non-empty
 * children). */
#sp-title .sp-column:empty { display: none; }
#sp-section-1:has(> .row > #sp-title > .sp-column:empty:only-child) {
    display: none;
}

/* (Removed in v2.4.38) The "reserve header_height on the sticky-header
 * placeholder so first paint doesn't slide under a fixed header" rule
 * lived here. It was an InfiNet-specific workaround for a JS init quirk
 * on that site but fired unconditionally on every client whose template
 * has sticky_header enabled, pushing the topbar down by header_height
 * on first paint everywhere. Sites that genuinely need it should add the
 * rule to their own params.custom_css (Template Options -> Custom Code). */