/**
 * jp-818-hardware-store-button-color.css — POS "Zum Hardware-Store" button.
 *
 * Ticket: JP-818 — the "ZUM HARDWARE-STORE" / "TO THE HARDWARE STORE" button text
 *         renders GRAY (#333) instead of dark blue (#0b1b45).
 * Pages:  https://b376u019-a.myrdbx.io/de/pos-system/ (page-id 96380)
 *         https://b376u019-a.myrdbx.io/en/pos-system/ (page-id 263000)
 *
 * The button is the PLAIN outline variant `.product-button-group__button--with-icon
 * .no-icon` (transparent bg, 2px #0b1b45 border). Its intended label colour is the
 * widget base `#0b1b45`, but that base rule (specificity 0,1,0) loses to the theme's
 * product-landing link rule `.page-template-product-landing a { color:#333 }`
 * (0,1,1) — so this <a>-button reads gray. The section's OTHER two buttons already
 * set their own colour (.has-wawi-gradient primary, .is-inverted secondary), so only
 * the plain outline one is affected.
 *
 * Fix: pin the plain outline button's resting label to #0b1b45 (colour + text-fill,
 * the theme paints via -webkit-text-fill-color). The :not() chain excludes the
 * gradient/inverted/white/primary variants so their own treatment is untouched. A
 * matching :hover rule keeps the widget's invert (white label on the #0b1b45 fill)
 * so hover is not broken. Page-scoped (rule 4b).
 */

/* Resting: dark-blue label (override product-landing a{color:#333}). */
body:is(.page-id-96380, .page-id-263000)
    section.product-support-section
    .product-button-group__button--with-icon.no-icon:not(.is-inverted):not(.has-wawi-gradient):not(.is-primary):not(.is-white),
body:is(.page-id-96380, .page-id-263000)
    section.product-support-section
    .product-button-group__button--with-icon.no-icon:not(.is-inverted):not(.has-wawi-gradient):not(.is-primary):not(.is-white) span,
body:is(.page-id-96380, .page-id-263000)
    section.product-support-section
    .product-button-group__button--with-icon.no-icon:not(.is-inverted):not(.has-wawi-gradient):not(.is-primary):not(.is-white) i {
    color: #0b1b45 !important;
    -webkit-text-fill-color: #0b1b45 !important;
}

/* Hover: preserve the widget invert — white label on the #0b1b45 fill (the extra
   :hover out-specifies the resting rule above so hover is not broken). */
body:is(.page-id-96380, .page-id-263000)
    section.product-support-section
    .product-button-group__button--with-icon.no-icon:not(.is-inverted):not(.has-wawi-gradient):not(.is-primary):not(.is-white):hover,
body:is(.page-id-96380, .page-id-263000)
    section.product-support-section
    .product-button-group__button--with-icon.no-icon:not(.is-inverted):not(.has-wawi-gradient):not(.is-primary):not(.is-white):hover span,
body:is(.page-id-96380, .page-id-263000)
    section.product-support-section
    .product-button-group__button--with-icon.no-icon:not(.is-inverted):not(.has-wawi-gradient):not(.is-primary):not(.is-white):hover i {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}
