/* Robinhood green roles for the RIBBID dispatch interface. */
:root {
  --green: #00c805;
  --green-hover: #00b304;
  --green-ink: #006526;
  --green-soft: #e5f4e8;
  --ink: #0b2114;
  --muted: #58635a;
  --blue: var(--green-ink);
  --blue-dark: #004e1d;
}

.button:not(.secondary):not(.butter) {
  color: var(--ink);
  background: var(--green);
  border-color: var(--green);
}
.button:not(.secondary):not(.butter):hover {
  background: var(--green-hover);
  border-color: var(--green-hover);
}
.button.secondary { border-color: #aab6ab; }
.nav-rail { background: var(--green); color: var(--ink); }
.rail-caption, .nav-label, .rail-ticket>span, .rail-account small { color: #123c1c; }
.nav-rail nav>a:hover, .nav-rail nav>button:hover { background: #0b211414; }
.nav-rail :focus-visible { outline-color: var(--ink); }
.rail-ticket { border-color: #1d6f2b; }
.rail-ticket a { color: var(--ink); }
.avatar-local { background: #004e1d; border-color: #004e1d; color: #fff; }
.header-location b { color: #7c8a7e; }
.intro-label, .mascot-caption, .category-strip button,
.ledger-line, .roster-agent>svg, .contract-facts dt { color: var(--muted); }
.category-strip button[aria-pressed="true"] { color: var(--green-ink); }
.search-field>svg { color: var(--muted); }
input::placeholder, textarea::placeholder { color: #606c62; }
.task-row:hover { border-color: var(--green-ink); box-shadow: 0 3px 12px #0b21140d; }
.task-symbol { background: var(--green-soft); color: var(--green-ink); }
.task-meta>span+span:before { color: #6e7a70; }
.agent-avatar { background: #deecdf; color: #244c2e; }
.role-control select { border-color: #bdc8be; }
form input:not([type=checkbox]), form textarea, form select { border-color: #aebcaf; }
.task-progress li>span { border-color: #7d8c80; }
.task-progress li.reached>span { color: #fff; }
.status-callout, .action-form, .docs-fact { background: var(--green-soft); border-color: #bfd9c5; }
.status-callout p, .action-form>p { color: #354f3b; }
.network-bar { background: var(--green-soft); color: var(--ink); }
.check-label input { accent-color: var(--green-ink); }
dialog { box-shadow: 0 20px 90px #0b211440; }
dialog::backdrop { background: #0b211480; }
#notice { box-shadow: 0 7px 25px #0b211426; }

@media (max-width: 960px) {
  .nav-rail { box-shadow: 6px 15px 20px #0b211425; }
}