/* ---- selectpicker styles ---- */
  .sp { position: relative; display: inline-block; min-width: 140px; font-size: 14px; }
  .sp-toggle {
    width: 100%; display: flex; justify-content: space-between; align-items: center;
    padding: 8px 12px; background: #fff; border: 1px solid #b8b8b8; border-radius: 4px;
    cursor: pointer; text-align: left; font: inherit; color: #222;
  }
  .sp-toggle:focus-visible { outline: 2px solid #2f6fed; outline-offset: 1px; }
  .sp-toggle .sp-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sp-toggle .sp-text.placeholder { color: #767676; }
  .sp-caret { margin-left: 10px; border: 5px solid transparent; border-top-color: #555; border-bottom: 0; }
  .sp.open .sp-caret { transform: rotate(180deg); }
  .sp-menu {
    display: none !important; position: absolute; left: 0; right: 0; top: calc(100% + 2px); z-index: 1000;
    margin: 0; padding: 4px 0; list-style: none; background: #fff;
    border: 1px solid #b8b8b8; border-radius: 4px; max-height: 240px; overflow-y: auto;
    box-shadow: 0 4px 12px rgba(0,0,0,.15);
  }
  .sp.open .sp-menu { display: block !important; }
  .sp-item { display: flex !important; align-items: center; gap: 8px; padding: 7px 12px !important; cursor: pointer; }
  .sp-item:hover, .sp-item.active { background: #eef3ff; }
  .sp-item.selected { font-weight: 600; }
  .sp-item.disabled { color: #999; cursor: not-allowed; }
  .sp-check { width: 14px; height: 14px; border: 1px solid #888; border-radius: 3px; flex: none; position: relative; }
  .sp-item.selected .sp-check { background: #2f6fed; border-color: #2f6fed; }
  .sp-item.selected .sp-check::after {
    content: ""; position: absolute; left: 4px; top: 1px; width: 3px; height: 7px;
    border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg);
  }