/**
 * qa16-logistik-praxis-tabbar.css
 * Page:  /de/logistik-als-wachstumstreiber/  (page-id 326672 prod-ish + 304462 staging/dev)
 * Batch #16 item 1.
 *
 * The "PRAXIS-KNOWHOW / Das steckt im Whitepaper" section carries a white pill
 * tab-bar built from the theme's swiper `.tabs-pills` component. The ticket asks
 * for it to match the reference bar in the erp-software "Must-have tools" section
 * (/en/erp-software #features), which is the DIFFERENT `.tabbed-widget` component.
 * Both are already white rounded pill capsules with a blue active pill and a right
 * nav arrow; the deltas measured against the reference are cosmetic:
 *
 *   property           reference (.tabbed-widget)   this bar (.tabs-pills)   ->
 *   pill padding       8px 16px                     8px 22px                16px
 *   pill font-weight   400                          500                     400
 *   capsule padding    8px                          6px 8px                 8px
 *   nav arrow          fa-chevron-right, #595959    navy, larger            grey chevron
 *
 * The current 22px / weight-500 / 6px-8px values are set INTENTIONALLY by the
 * page's own override `jp-logistik-wachstumstreiber.css`. Rather than edit that
 * file (another ticket's), this sheet re-declares the SAME selectors so it wins by
 * source order (the overrides loader enqueues *.css alphabetically -> `qa16…`
 * loads after `jp-logistik…`), matching the reference values.
 *
 * Both page-ids are carried exactly as the existing file does: 326672 + 304462 are
 * the same /de/logistik page across envs (page-ids diverge per env, CLAUDE.md
 * 3.X.3). Everything is scoped to those bodies — `.tabs-pills` / `.btn-pill` /
 * `.swiper-button-*` are shared theme components, so per the batch rule the change
 * must not leak off this page.
 *
 * Also here (same page):
 *   - hide the two heading anchor-link chain icons the ticket named
 *     (#wachstumsbremse-2 on the H2, #das-erwartet-dich on the H3 — both in the
 *     default Wachstumsbremse panel, i.e. what the reporter saw);
 *   - colour every "Das erwartet dich" heading JTL dark-blue #0b1b45 (was #333),
 *     matched via its own #das-erwartet-dich* anchor so no other heading is hit.
 */

/* ---- white capsule: match the reference padding ---------------------------- */
body.page-id-326672 .kapitel.tabs.tabs-pills .swiper-container,
body.page-id-304462 .kapitel.tabs.tabs-pills .swiper-container {
    padding: 8px !important;
}

/* ---- pills: reference sizing (16px, weight 400) ---------------------------- */
body.page-id-326672 .kapitel.tabs.tabs-pills a.btn.btn-outline-primary.btn-pill,
body.page-id-304462 .kapitel.tabs.tabs-pills a.btn.btn-outline-primary.btn-pill {
    padding: 8px 16px !important;
    font-weight: 400 !important;
}

/* ---- nav arrows: thin grey chevron like the reference ---------------------- */
body.page-id-326672 .kapitel.tabs.tabs-pills .swiper-button-next::after,
body.page-id-326672 .kapitel.tabs.tabs-pills .swiper-button-prev::after,
body.page-id-304462 .kapitel.tabs.tabs-pills .swiper-button-next::after,
body.page-id-304462 .kapitel.tabs.tabs-pills .swiper-button-prev::after {
    font-family: "Font Awesome 6 Pro" !important;
    font-weight: 400 !important;
    font-size: 18px !important;
    color: #595959 !important;
}
body.page-id-326672 .kapitel.tabs.tabs-pills .swiper-button-next::after,
body.page-id-304462 .kapitel.tabs.tabs-pills .swiper-button-next::after {
    content: "\f054" !important; /* chevron-right */
}
body.page-id-326672 .kapitel.tabs.tabs-pills .swiper-button-prev::after,
body.page-id-304462 .kapitel.tabs.tabs-pills .swiper-button-prev::after {
    content: "\f053" !important; /* chevron-left */
}

/* Both arrows sit right at the edge of the white bar, with a 6px inner pad. */
body.page-id-326672 .kapitel.tabs.tabs-pills .swiper-button-prev,
body.page-id-304462 .kapitel.tabs.tabs-pills .swiper-button-prev {
    left: 0 !important;
    right: auto !important;
    padding-left: 6px !important;
}
body.page-id-326672 .kapitel.tabs.tabs-pills .swiper-button-next,
body.page-id-304462 .kapitel.tabs.tabs-pills .swiper-button-next {
    left: auto !important;
    right: 0 !important;
    padding-right: 6px !important;
}

/* ---- heading anchor chain-icons the ticket named --------------------------- */
body.page-id-326672 a.headline-link[href="#wachstumsbremse-2"],
body.page-id-326672 a.headline-link[href="#das-erwartet-dich"],
body.page-id-304462 a.headline-link[href="#wachstumsbremse-2"],
body.page-id-304462 a.headline-link[href="#das-erwartet-dich"] {
    display: none !important;
}

/* ---- "Das erwartet dich" -> dark blue -------------------------------------- */
body.page-id-326672 h3:has(> a.headline-link[href^="#das-erwartet-dich"]),
body.page-id-304462 h3:has(> a.headline-link[href^="#das-erwartet-dich"]) {
    color: #0b1b45 !important;
}