/* US Regional Maps (usmaps, us_county_module.py): the harmonized look of the idea apps (2026-10-16) - toolbar
   buttons, the Browse drawer, the Map options popover, the date slider. Loaded globally: every rule is usm- scoped.
   Tokens: panels rgba(0,0,0,.6), chips rgba(255,255,255,.06), radius 10px, text #e8e8e8, muted #9fb3c8,
   headings #cfefff, accent #f0a030, glow #4be9fa. */

.usm-tool { display: inline-flex; align-items: center; gap: 7px; height: 36px; padding: 0 13px; border-radius: 10px; cursor: pointer;
  font-size: .84rem; color: #e8e8e8; background: rgba(0, 0, 0, 0.6); border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: 0 0 24px rgba(75, 233, 250, 0.08); }
.usm-tool:hover { border-color: rgba(240, 160, 48, 0.7); color: #fff; }
.usm-tool i { color: #9fd8e6; }
.usm-tool.acc { border-color: rgba(240, 160, 48, 0.6); background: rgba(240, 160, 48, 0.12); color: #f5d6a3; }
.usm-tool.acc i { color: #f0a030; }
.usm-panel .usm-tool { margin-top: 10px; }

.usm-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.usm-title { color: #cfefff; font-size: 1rem; font-weight: 650; }
.usm-title i { color: #f0a030; }
.usm-x { width: 32px; height: 32px; border-radius: 8px; border: 1px solid rgba(255, 255, 255, 0.14); background: rgba(255, 255, 255, 0.05);
  color: #cfdcea; cursor: pointer; }
.usm-x:hover { border-color: #f0a030; color: #f5d6a3; }
.usm-k { color: #9fb3c8; font-size: .64rem; text-transform: uppercase; letter-spacing: .07em; margin: 10px 0 5px; }
.usm-pills label { font-size: .78rem; }
.usm-crumbs { margin: 12px 0 8px; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: .8rem; }
.usm-crumb { border: none; background: none; color: #f5d6a3; cursor: pointer; padding: 0; }
.usm-crumb:hover { color: #fff; text-decoration: underline; }
.usm-sep { color: #5f7286; font-size: .6rem; }
.usm-search { display: flex; align-items: center; gap: 8px; height: 34px; padding: 0 10px; margin-bottom: 8px; color: #9fb3c8;
  background: rgba(0, 0, 0, 0.45); border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 10px; }
.usm-search:focus-within { border-color: rgba(240, 160, 48, 0.7); }
.usm-search-in { flex: 1; min-width: 0; background: transparent !important; border: none !important; outline: none;
  color: #e8e8e8 !important; font-size: .84rem; }
.usm-search-in::placeholder { color: #6f8295; }
.usm-browser { height: 52vh; overflow-y: auto; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 10px; background: rgba(0, 0, 0, 0.3);
  scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, 0.18) transparent; }
.usm-row { display: block; width: 100%; text-align: left; border: none; background: none; padding: 7px 10px; cursor: pointer; color: #e8e8e8;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06); font-size: .84rem; }
.usm-row:hover { background: rgba(240, 160, 48, 0.08); }
.usm-ico { color: #f0a030; margin-right: 8px; width: 14px; text-align: center; }
.usm-ico.leaf { color: #4be9fa; }
.usm-count { float: right; color: #9fb3c8; font-size: .7rem; background: rgba(255, 255, 255, 0.06); border-radius: 8px; padding: 0 7px; line-height: 1.7; }
.usm-meta { font-size: .7rem; color: #9fb3c8; margin: 2px 0 0 22px; }
.usm-sub { color: #f5d6a3; }
.usm-status { margin-top: 8px; font-size: .74rem; color: #9fb3c8; }

/* the colour-palette dropdown: dark like the app's dropdowns */
.usm-dd .Select-control { background: rgba(0, 0, 0, 0.5) !important; border: 1px solid rgba(255, 255, 255, 0.14) !important; border-radius: 10px !important; }
.usm-dd .Select-value-label, .usm-dd .Select-placeholder { color: #e8e8e8 !important; }
.usm-dd .Select-arrow { border-top-color: #9fb3c8 !important; }
.usm-dd .Select-menu-outer { background: #0f171f !important; border: 1px solid rgba(255, 255, 255, 0.15) !important; }
.usm-dd .VirtualizedSelectOption { color: #cfdcea; background: transparent; }
.usm-dd .VirtualizedSelectFocusedOption { background: rgba(240, 160, 48, 0.18); color: #fff; }

/* the date slider: a dark bar, an amber track */
.usm-slider { background: rgba(0, 0, 0, 0.6); border: 1px solid rgba(255, 255, 255, 0.10); border-radius: 10px; padding: 8px 16px 2px; }
.usm-slider .rc-slider-rail { background: rgba(255, 255, 255, 0.12); }
.usm-slider .rc-slider-track { background: #f0a030; }
.usm-slider .rc-slider-handle { border-color: #f0a030; background: #0b1016; box-shadow: 0 0 10px rgba(240, 160, 48, 0.6); opacity: 1; }
.usm-slider .rc-slider-dot { background: #0b1016; border-color: rgba(255, 255, 255, 0.3); }
.usm-slider .rc-slider-dot-active { border-color: #f0a030; }
.usm-slider .rc-slider-mark-text { color: #9fb3c8; font-size: .66rem; }
