/* ============================================================
   GOLD BUTTON THEME — site-wide button colour override
   ------------------------------------------------------------
   Repaints every call-to-action button from the brand red
   (--primary #E22222) to the brand gold (--accent #e8a317).

   Loads after style.css / st-ui.css / st-ui-migration.css and
   uses !important so it also wins over the per-page <style>
   blocks that page templates print in the document body.

   Scope: buttons only. Brand red stays in place for links,
   headings, icons, chart series, status pills and section
   accents, so this is a button repaint, not a rebrand.

   To revert: dequeue 'st-gold-buttons' in functions.php.
   ============================================================ */

:root {
  --st-gold:        #e8a317;  /* fill — same token as --accent */
  --st-gold-hover:  #d4950f;  /* hover fill — same as --accent-hover */
  --st-gold-press:  #c9850d;  /* pressed / deep fill */
  --st-gold-ink:    #8a5e05;  /* gold text on light backgrounds (5.7:1 on white) */
  --st-gold-shadow: rgba(232, 163, 23, .32);
  --st-gold-on:     #1F1503;  /* label colour on a gold fill (8.3:1 on the gold) */
}

/* ------------------------------------------------------------
   1. SOLID / PRIMARY BUTTONS
   ------------------------------------------------------------ */
.btn-primary,
.btn-accent,
.btn-green,
.ph-btn-primary,
.st-btn--primary,
.st-shero-btn,
.st-quote-btn,
.st-cart-btn,
body.woocommerce-page .st-quote-btn,
body.woocommerce-page .st-cart-btn,
.newsletter-form button,
.am-btn-primary,
.amar-btn-primary,
.fm-btn-primary,
.crm-btn-primary,
.st-ai-btn-primary,
.ehc-osx-btn-primary,
.ehc-osx-tile-cta,
.ehc-mz-btn-primary,
.ehc-mz-btn,
.ehc-mil-btn,
.ehc-owms-btn,
.ehc-def-btn,
.ehc-sira-btn,
.ehc-ws-btn,
.ehc-wst-btn,
.ehc-cyb-btn,
.ehc-seccomp-btn,
.ehc-seccomp-cta .ehc-seccomp-btn {
  background: var(--st-gold) !important;
  border-color: var(--st-gold) !important;
  color: var(--st-gold-on) !important;
}

.btn-primary:hover,
.btn-accent:hover,
.btn-green:hover,
.ph-btn-primary:hover,
.st-btn--primary:hover,
.st-btn--primary:focus-visible,
.st-shero-btn:hover,
.st-quote-btn:hover,
.st-cart-btn:hover,
body.woocommerce-page .st-quote-btn:hover,
body.woocommerce-page .st-cart-btn:hover,
.newsletter-form button:hover,
.am-btn-primary:hover,
.amar-btn-primary:hover,
.fm-btn-primary:hover,
.crm-btn-primary:hover,
.st-ai-btn-primary:hover,
.ehc-osx-btn-primary:hover,
.ehc-osx-tile-cta:hover,
.ehc-mz-btn-primary:hover,
.ehc-mz-btn:hover,
.ehc-mil-btn:hover,
.ehc-owms-btn:hover,
.ehc-def-btn:hover,
.ehc-sira-btn:hover,
.ehc-ws-btn:hover,
.ehc-wst-btn:hover,
.ehc-cyb-btn:hover,
.ehc-seccomp-btn:hover {
  background: var(--st-gold-hover) !important;
  border-color: var(--st-gold-hover) !important;
  color: var(--st-gold-on) !important;
}

/* Drop shadows on the raised buttons were tinted red. */
.ph-btn-primary,
.st-shero-btn,
.am-btn-primary,
.amar-btn-primary,
.fm-btn-primary,
.crm-btn-primary,
.ehc-seccomp-btn,
.ehc-sira-btn {
  box-shadow: 0 10px 26px var(--st-gold-shadow) !important;
}

/* ------------------------------------------------------------
   2. OUTLINE / TEXT BUTTONS
   Gold at full brightness is unreadable as text on white, so
   these use the darker --st-gold-ink for the label and keep the
   bright gold for the border.
   ------------------------------------------------------------ */
.btn-outline-primary,
.st-ai-btn-ghost.is-primary {
  background: transparent !important;
  color: var(--st-gold-ink) !important;
  border-color: var(--st-gold) !important;
}
.btn-outline-primary:hover {
  background: var(--st-gold) !important;
  border-color: var(--st-gold) !important;
  color: var(--st-gold-on) !important;
}

.st-btn--text {
  color: var(--st-gold-ink) !important;
}
.st-btn--text:hover,
.st-btn--text:focus-visible {
  color: var(--st-gold-press) !important;
}

/* Ghost buttons only borrowed the red for their hover accent. */
.ehn-btn--ghost:hover,
.st-shero-btn-ghost:hover,
.ph-btn-ghost:hover {
  border-color: var(--st-gold) !important;
}

/* ------------------------------------------------------------
   3. WOOCOMMERCE + FORM SUBMIT BUTTONS
   ------------------------------------------------------------ */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt,
.wp-element-button,
.wp-block-button__link {
  background-color: var(--st-gold) !important;
  border-color: var(--st-gold) !important;
  color: var(--st-gold-on) !important;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce #respond input#submit.alt:hover,
.wp-element-button:hover,
.wp-block-button__link:hover {
  background-color: var(--st-gold-hover) !important;
  border-color: var(--st-gold-hover) !important;
  color: var(--st-gold-on) !important;
}

/* AI server configurator plugin (swedish-ai-server-configurator) —
   its own --aic-brand red, scoped to the button components only so the
   stepper, focus rings and inline links keep the brand red. */
.st-aic-btn-primary {
  background: var(--st-gold) !important;
  border-color: var(--st-gold) !important;
  color: var(--st-gold-on) !important;
  box-shadow: 0 7px 15px var(--st-gold-shadow) !important;
}
.st-aic-btn-primary:hover,
.st-aic-btn-primary:focus-visible {
  background: var(--st-gold-hover) !important;
  border-color: var(--st-gold-hover) !important;
  color: var(--st-gold-on) !important;
}
.st-aic-mobilebar-view {
  color: var(--st-gold-ink) !important;
}

/* wp-job-openings apply button (careers pages). */
.awsm-job-form-inner input[type="submit"],
.awsm-application-submit,
.awsm-job-item .awsm-job-more-container a,
a.awsm-job-form-btn {
  background-color: var(--st-gold) !important;
  border-color: var(--st-gold) !important;
  color: var(--st-gold-on) !important;
}

/* ------------------------------------------------------------
   4. STATE COLOURS THAT MUST SURVIVE THE REPAINT
   Success / brand-owned buttons keep their own colour.
   ------------------------------------------------------------ */
/* WhatsApp buttons keep the WhatsApp green. */
.hero-promo .whatsapp-btn,
.ehc-chat-cta,
.ehc-rail-wa {
  background: #25d366 !important;
  border-color: #25d366 !important;
}


/* ------------------------------------------------------------
   5. ST-AUTHORITY CATALOGUE — quote / cart buttons
   The plugin ships its own !important rules that paint these as a
   red outline at rest and only fill gold on hover. These selectors
   carry an html/body prefix purely to out-specify that layer.
   The disabled / already-added grey state is left to the plugin.
   ------------------------------------------------------------ */
html body .st-quote-btn,
html body .st-cart-btn,
html body .st-quote-btn.st-cart-btn,
html body .st-quote-btn.st-quote-primary,
html body .btn.st-quote-btn,
html body .btn.btn-primary.st-quote-btn,
html body .st-pcard .st-quote-btn,
html body .st-pcard-actions .st-quote-btn,
html body .st-pgrid .st-pcard .st-quote-btn,
html body .st-quote-panel .st-quote-btn,
html body .woocommerce .st-quote-btn,
html body .woocommerce ul.products li.product .st-quote-btn {
  background: var(--st-gold) !important;
  border: 1.5px solid var(--st-gold) !important;
  color: var(--st-gold-on) !important;
}

html body .st-quote-btn svg,
html body .st-quote-btn i,
html body .st-cart-btn svg,
html body .st-pcard .st-quote-btn svg,
html body .btn.btn-primary.st-quote-btn svg,
html body .st-quote-panel .st-quote-btn svg {
  color: var(--st-gold-on) !important;
}

html body .st-quote-btn:hover,
html body .st-cart-btn:hover,
html body .st-quote-btn.st-quote-primary:hover,
html body .btn.btn-primary.st-quote-btn:hover,
html body .st-pcard .st-quote-btn:hover,
html body .st-pcard-actions .st-quote-btn:hover,
html body .st-pgrid .st-pcard .st-quote-btn:hover,
html body .st-quote-panel .st-quote-btn:hover,
html body .woocommerce .st-quote-btn:hover {
  background: var(--st-gold-hover) !important;
  border-color: var(--st-gold-hover) !important;
  color: var(--st-gold-on) !important;
}
html body .st-quote-btn:hover svg,
html body .st-quote-btn:hover i,
html body .st-cart-btn:hover svg {
  color: var(--st-gold-on) !important;
}

html body .st-quote-btn:active,
html body .st-cart-btn:active,
html body .st-pcard .st-quote-btn:active,
html body .btn.btn-primary.st-quote-btn:active {
  background: var(--st-gold-press) !important;
  border-color: var(--st-gold-press) !important;
  color: var(--st-gold-on) !important;
}

/* Already-on-the-list / disabled stays grey and unclickable-looking. */
html body .st-quote-btn.is-added,
html body .st-quote-btn[disabled],
html body .st-quote-btn.is-added:hover,
html body .st-quote-btn[disabled]:hover,
html body .st-pcard .st-quote-btn.is-added,
html body .st-pcard .st-quote-btn.is-added:hover,
html body .st-pcard .st-quote-btn[disabled]:hover {
  background: #f5f4fa !important;
  border-color: #e8e8ef !important;
  color: #7a8aaa !important;
}
html body .st-quote-btn.is-added svg,
html body .st-quote-btn[disabled] svg,
html body .st-quote-btn.is-added:hover svg {
  color: #7a8aaa !important;
}

/* ------------------------------------------------------------
   6. HERO CAROUSEL INDICATOR
   A <button> element on the homepage hero. Left red it would be
   the only red control sitting next to the now-gold hero CTAs.
   ------------------------------------------------------------ */
.hero-dot.active {
  background: var(--st-gold) !important;
  border-color: var(--st-gold) !important;
}

/* ------------------------------------------------------------
   7. BUTTONS WITHOUT "btn" IN THEIR CLASS NAME
   Real CTAs whose selectors don't follow the btn-* convention,
   so they don't fall out of a class-name sweep.
   ------------------------------------------------------------ */

/* Sticky quote bar on the catalogue: "Next: request a quotation". */
html body .st-quote-bar-next {
  background: var(--st-gold) !important;
  border-color: var(--st-gold) !important;
  color: var(--st-gold-on) !important;
  box-shadow: 0 5px 14px var(--st-gold-shadow) !important;
}
html body .st-quote-bar-next:hover {
  background: var(--st-gold-hover) !important;
  border-color: var(--st-gold-hover) !important;
  color: var(--st-gold-on) !important;
}

/* Cart panel submit. */
.st-cart-submit {
  background: var(--st-gold) !important;
  color: var(--st-gold-on) !important;
}
.st-cart-submit:hover {
  background: var(--st-gold-hover) !important;
  color: var(--st-gold-on) !important;
}

/* Book-an-appointment form submit (red gradient). */
.ehc-rd-submit {
  background: linear-gradient(135deg, var(--st-gold), var(--st-gold-press)) !important;
  color: var(--st-gold-on) !important;
}
.ehc-rd-submit:hover {
  box-shadow: 0 14px 32px rgba(232, 163, 23, .40) !important;
}

/* Floating chat launcher in the contact rail. */
.ehc-rail-chat {
  background: linear-gradient(135deg, var(--st-gold) 0%, var(--st-gold-press) 100%) !important;
}

/* Chat quick-question chips (buttons) turn red on hover. */
.ehc-chat-q:hover {
  background: var(--st-gold) !important;
  border-color: var(--st-gold) !important;
  color: var(--st-gold-on) !important;
}

/* Circular social icon buttons in the contact block. */
.social-links a {
  background: var(--st-gold) !important;
  color: var(--st-gold-on) !important;
}
.social-links a:hover {
  background: var(--st-gold-hover) !important;
  color: var(--st-gold-on) !important;
}

/* Contact/partner social icons use each platform's recognizable brand colour.
   The shared .social-link classes are emitted by ehc_socials(), while the
   top-bar and footer keep their deliberately neutral treatment. */
.social-links a.social-link-facebook {
  background: #1877f2 !important;
  color: #fff !important;
}
.social-links a.social-link-linkedin {
  background: #0a66c2 !important;
  color: #fff !important;
}
.social-links a.social-link-x,
.social-links a.social-link-tiktok {
  background: #111 !important;
  color: #fff !important;
}
.social-links a.social-link-youtube {
  background: #ff0000 !important;
  color: #fff !important;
}
.social-links a.social-link-facebook:hover { background: #125dcc !important; color: #fff !important; }
.social-links a.social-link-linkedin:hover { background: #084f96 !important; color: #fff !important; }
.social-links a.social-link-x:hover,
.social-links a.social-link-tiktok:hover { background: #333 !important; color: #fff !important; }
.social-links a.social-link-youtube:hover { background: #cc0000 !important; color: #fff !important; }

/* Brochure library plugin (st-brochure-library) — card "Read online"
   button. Its viewer-bar buttons were already gold; this brings the
   card buttons onto the same fill. */
html body .stbl-btn-primary {
  background: var(--st-gold) !important;
  border-color: var(--st-gold) !important;
  color: var(--st-gold-on) !important;
}
html body .stbl-btn-primary:hover {
  background: var(--st-gold-hover) !important;
  border-color: var(--st-gold-hover) !important;
  color: var(--st-gold-on) !important;
}

/* ------------------------------------------------------------
   8. NAV MENU ACTIVE / HOVER LINK
   style.css:353 gives hover and the current-page item the same
   red, so both move together — leaving hover red would flash
   the old brand colour over a gold current-page marker.
   Desktop and mobile share this selector.
   ------------------------------------------------------------ */
.nav-links > li > a:hover,
.nav-links > li > a.active {
  color: var(--st-gold) !important;
}


/* ------------------------------------------------------------
   9. GOLD BUTTONS THAT PREDATE THIS SHEET
   The nav phone CTA was already gold in style.css, so it was not
   part of the repaint — but it carries `color:#fff !important`
   there and would be the only white-on-gold button left.
   ------------------------------------------------------------ */
.nav-cta-phone,
.nav-cta-phone:hover {
  color: var(--st-gold-on) !important;
}
.nav-cta-phone :is(.lucide, svg, [data-lucide]) {
  color: var(--st-gold-on) !important;
}

/* Floating chat launcher: gold gradient fill, so its icon follows the
   same label colour as every other gold button. */
.ehc-rail-chat,
.ehc-rail-chat :is(.lucide, svg, [data-lucide]) {
  color: var(--st-gold-on) !important;
}
