/* it-green-actions-v1.css — the way out of a tool is green, everywhere.

   The button that produces the file was a different colour on every page:
   green on the invoice generator, white on the quote generator, a plain link
   on the receipt maker, purchase order and work order, orange on the cost
   estimator, and a third green on the template studios. A person who has used
   one tool learns nothing that helps them in the next.

   So every action that ends in a file is #047857, which is the green the
   invoice generator's Review & Export already used. Nothing else on the site
   uses it, so green means one thing: this is how you get your document.

   Secondary actions beside it (Print or save PDF, Copy link) stay quiet. Two
   equal buttons is a choice a person has to make; one clear one is not.

   Applied as a stylesheet rather than by editing each page, so the colour has
   one definition and a new tool inherits it by using the same ids. */

:root { --it-action-green: #047857; --it-action-green-dark: #036249; }

/* the primary export or download control on every tool */
#wizardReviewBtn,
.qg-fin-top,
#pngBtn,
#ceCsv,
.tg-dl-btn,
.it-dl-fab,
#itDlFab,
[data-it-action="download"] {
  background: var(--it-action-green) !important;
  border-color: var(--it-action-green) !important;
  color: #fff !important;
}

#wizardReviewBtn:hover,
.qg-fin-top:hover,
#pngBtn:hover,
#ceCsv:hover,
.tg-dl-btn:hover,
[data-it-action="download"]:hover {
  background: var(--it-action-green-dark) !important;
  border-color: var(--it-action-green-dark) !important;
}

#wizardReviewBtn:focus-visible,
.qg-fin-top:focus-visible,
#pngBtn:focus-visible,
#ceCsv:focus-visible,
.tg-dl-btn:focus-visible,
[data-it-action="download"]:focus-visible {
  outline: 3px solid #9FD7B9;
  outline-offset: 2px;
}

/* an icon inside the button follows the text colour rather than staying dark */
.tg-dl-btn .tg-dl-ico { filter: brightness(0) invert(1); }
#pngBtn svg, #ceCsv svg, .qg-fin-top svg, #wizardReviewBtn svg { color: #fff; stroke: currentColor; }

/* The plain-link downloads on the receipt maker, purchase order and work order
   were text among other text. They become a real button so the way out of the
   page is as visible there as it is everywhere else. */
#pngBtn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 46px; padding: 0 20px; border-radius: 12px; border: 1px solid var(--it-action-green);
  font-weight: 700; text-decoration: none; cursor: pointer;
}

/* the companion print action stays secondary, so the green one reads as the answer */
#printBtn, #cePrint {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 46px; padding: 0 18px; border-radius: 12px;
  background: #fff; border: 1px solid #E4DFD4; color: #15151A;
  font-weight: 600; text-decoration: none; cursor: pointer;
}
#printBtn:hover, #cePrint:hover { border-color: #C9C2B4; }

@media print { #wizardReviewBtn, .qg-fin-top, #pngBtn, #ceCsv, .tg-dl-btn, #printBtn, #cePrint { display: none !important; } }