/* OBEINSON FREQUENCY X — Donate and Share in the top banner.
 *
 * "Share Frequency X" was a cream pill floating over the bottom-right corner of
 * every screen, above the tab bar and the player's own controls, at 13.2px —
 * larger than anything in the header it was competing with. It now sits in the
 * banner with Menu, Stations, GeoMap, Free TV and World, and Donate sits beside
 * it, so the two things a visitor can do for the app are where the app's own
 * actions are instead of hovering over the content.
 *
 * They are deliberately a little smaller than their neighbours: these are
 * offers, not navigation, and they should not compete with Stations.
 *
 * banner-actions.js is what moves them. If it does not run, the floating pill
 * is untouched and still works — the rule that hides it is keyed to a class
 * that only the script adds.
 */

/* the floating pill steps aside only once the banner chip exists */
html.obnBannerShare #obnShareLaunch { display:none !important }

.obnBannerAct {
  min-height:38px !important;
  padding:6px 12px !important;
  font-size:9.3px !important;
  letter-spacing:.02em;
  border-radius:999px !important;
  cursor:pointer;
  white-space:nowrap;
}

/* Donate keeps the warm colour it has everywhere else in the app, at the
   weight of a chip rather than a call to action. */
.obnBannerAct.obnBannerDonate {
  border:1px solid rgba(255,207,77,.55) !important;
  background:rgba(255,207,77,.12) !important;
  color:#ffcf4d !important;
  -webkit-text-fill-color:#ffcf4d !important;
  font-weight:700 !important;
}
.obnBannerAct.obnBannerDonate:hover {
  background:rgba(255,207,77,.22) !important;
  border-color:rgba(255,207,77,.85) !important;
}
:root[data-theme="light"] .obnBannerAct.obnBannerDonate {
  border-color:rgba(176,116,0,.6) !important;
  background:rgba(240,168,30,.16) !important;
  color:#6b4400 !important;             /* 7.4:1 on the light banner */
  -webkit-text-fill-color:#6b4400 !important;
}

.obnBannerAct:focus-visible {
  outline:2px solid currentColor;
  outline-offset:2px;
}

/* touch screens still get a real target even though the chip is smaller */
html.obn-touch .obnBannerAct { min-height:40px !important }