/* ── Feedback-knop ── */
#myCustomTrigger {
  font-family: "Albert Sans", sans-serif;
  position: fixed;
  bottom: 20px;
  right: 20px;
  background: #ff8c02;
  color: #fff;
  border: 0;
  border-radius: 9999px;
  padding: 12px 20px;
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 6px 14px rgba(0,0,0,.2);
  z-index: 2147483000;
  transition: transform .06s ease-out, background-color .15s ease-in-out;
}
#myCustomTrigger:hover  { background: #ef4864; }
#myCustomTrigger:active { transform: translateY(1px); }
#myCustomTrigger:disabled {
  background: #bbb !important;
  cursor: not-allowed !important;
  transform: none !important;
  box-shadow: none !important;
}
@media (max-width: 480px) {
  #myCustomTrigger { bottom: 16px; right: 16px; padding: 10px 16px; font-size: 15px; }
}

/* ==========================================================================
   Overig
   ========================================================================== */

ai-actions {
  display: none;
}

/*
 * Tag badge — basisvorm
 * Scroll Sites → Site Settings → Custom CSS
 *
 * Scroll Sites rendert de Confluence Status-macro als:
 *   <span class="status" data-component="status" data-color="grey">Label</span>
 *
 * De "Tag-injectie" in het JS-bestand zoekt spans op tekst, zet data-tag
 * en past de juiste achtergrond- en tekstkleur inline toe. Deze CSS bepaalt
 * alleen de vorm.
 *
 *  span[data-component="status"][data-tag]
 *    — Status-macro's die door het JS zijn herkend. Niet-herkende spans
 *      (bv. gewone "On track"-macro's) blijven onaangetast.
 *
 *  .tag
 *    — losse <span class="tag"> in HTML-macro's of templates.
 */

span[data-component="status"][data-tag],
.tag {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 11px;
  line-height: 16px;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  border: none;
  vertical-align: middle;
  margin: 2px 3px 2px 0;
  box-shadow: none;
  text-decoration: none;
}

/* ── Print ── */
@media print {
  span[data-component="status"][data-tag] {
    border: 1px solid currentColor !important;
    background-color: transparent !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}

/* ── Fallback: conf-badge-klassen (badge_variant=css / zonder Scroll Sites) ── */
.conf-badge { display: inline-block; padding: 2px 8px; border-radius: 3px; font-size: 0.72em; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; white-space: nowrap; vertical-align: middle; margin-right: 4px; line-height: 1.6; }
.conf-badge-grey   { background-color: #dfe1e6; color: #42526e; }
.conf-badge-red    { background-color: #ffebe6; color: #bf2600; }
.conf-badge-yellow { background-color: #fffae6; color: #974f0c; }
.conf-badge-green  { background-color: #e3fcef; color: #006644; }
.conf-badge-blue   { background-color: #deebff; color: #0052cc; }
.conf-badge-purple { background-color: #eae6ff; color: #403294; }
.conf-badge-teal   { background-color: #e6fcff; color: #505f79; }
.conf-badge-orange { background-color: #fca700; color: #172b4d; }
.conf-badge-lime   { background-color: #b3df72; color: #172b4d; }
.conf-badge-pink   { background-color: #f797d2; color: #ffffff; }
.conf-badge-dark   { background-color: #42526e; color: #ffffff; }
.conf-badge-navy   { background-color: #0747a6; color: #ffffff; }
.conf-badge-amber  { background-color: #fff0b3; color: #7a4f00; }
.conf-badge-coral  { background-color: #ffd5cc; color: #ae2e24; }
.conf-badge-sky    { background-color: #b3f5ff; color: #206b74; }