/*
 * Pulsante «Compra su Bayora» — https://bayora.eu/it/info/brand
 * Si collega così: <link rel="stylesheet" href="https://bayora.eu/brand/bayora-button.css">
 * oppure si copia questo file nel proprio sito. Nessun font esterno: se il sito
 * non ha IBM Plex Sans si usa il carattere di sistema.
 * Le proprietà che i temi (WordPress e simili) impongono ai link dei contenuti
 * sono marcate !important: il pulsante deve restare uguale su ogni sito.
 */
.bb{--bb-bg:#fff;--bb-fg:#09090b;--bb-mut:#52525b;--bb-line:#d4d4d8;--bb-hov:#09090b;--bb-ar:#0f7d91;--bb-ok:#17803d;--bb-warn:#b45309;
  font-family:var(--font-plex-sans,"IBM Plex Sans"),"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif!important;
  box-sizing:border-box!important;display:inline-flex!important;align-items:center;gap:14px;
  height:56px!important;min-width:min(320px,100%);max-width:100%;margin:0;padding:0 14px 0 0!important;
  background:var(--bb-bg)!important;color:var(--bb-fg)!important;border:1px solid var(--bb-line)!important;border-radius:0!important;
  box-shadow:none!important;text-decoration:none!important;text-transform:none!important;letter-spacing:normal!important;
  font-style:normal!important;font-weight:400!important;font-size:15px!important;text-shadow:none!important;text-align:left;
  line-height:1.2!important;vertical-align:middle;cursor:pointer;transition:border-color .15s,background-color .15s,filter .15s}
.bb *{box-sizing:border-box;margin:0;padding:0;background:transparent!important;text-decoration:none!important;text-transform:none!important;letter-spacing:normal!important;font-style:normal!important;text-shadow:none!important;border:0}
.bb:hover,.bb:focus,.bb:visited,.bb:active{color:var(--bb-fg)!important;background:var(--bb-bg)!important;text-decoration:none!important;box-shadow:none!important}
.bb:hover{border-color:var(--bb-hov)!important}
.bb:active{transform:translateY(1px)}
.bb:focus-visible{outline:2px solid var(--bb-ar)!important;outline-offset:2px}
.bb--dark{--bb-bg:#18181b;--bb-fg:#fff;--bb-mut:#a1a1aa;--bb-line:#3f3f46;--bb-hov:#fff;--bb-ar:#36b9cf;--bb-ok:#4ade80;--bb-warn:#fbbf24}
.bb svg{display:block!important;flex:none;max-width:none!important;width:26px!important;height:26px!important}
.bb .bb-tile{width:56px;height:56px;margin:-1px 0 -1px -1px;display:flex!important;align-items:center;justify-content:center;flex:none;background:linear-gradient(135deg,#36b9cf 38%,#f99c00 78%)!important}
.bb .bb-tx{display:flex!important;flex-direction:column;flex:1;min-width:0;overflow:hidden}
.bb .bb-t{display:block!important;font-size:15px!important;font-weight:500!important;color:var(--bb-fg)!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bb .bb-sub{display:block!important;font-size:12px!important;font-weight:400!important;color:var(--bb-mut)!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bb .bb-sub--ok{color:var(--bb-ok)!important}
.bb .bb-sub--warn{color:var(--bb-warn)!important}
.bb .bb-dot{display:inline-block!important;width:7px;height:7px;border-radius:50%!important;background:var(--bb-mut)!important;margin-right:6px;vertical-align:1px}
.bb .bb-sub--ok .bb-dot{background:var(--bb-ok)!important}
.bb .bb-sub--warn .bb-dot{background:var(--bb-warn)!important}
.bb .bb-ar{display:block!important;margin-left:auto;color:var(--bb-ar)!important;font-size:20px;line-height:1;padding-left:6px}
.bb .bb-price{border-left:1px solid var(--bb-line)!important;margin:-1px -15px -1px auto;align-self:stretch;display:flex!important;align-items:center;gap:6px;padding:0 14px 0 16px;color:var(--bb-fg)!important;font-size:16px!important;font-weight:600!important;white-space:nowrap;transition:border-color .15s}
.bb .bb-price .bb-ar{padding-left:0;margin-left:0}
.bb:hover .bb-price{border-left-color:var(--bb-hov)!important}
.bb--priced{min-width:min(360px,100%)}
.bb--compact{height:44px!important;min-width:0}
.bb--compact .bb-tile{width:44px;height:44px}
.bb--compact .bb-tile svg{width:20px!important;height:20px!important}
.bb--icon{min-width:0;width:44px;height:44px!important;padding:0!important;border:0!important;gap:0}
.bb--icon .bb-tile{width:44px;height:44px;margin:0}
.bb--icon .bb-tile svg{width:22px!important;height:22px!important}
.bb--icon:hover{filter:brightness(1.08)}