.bookmark-toolbar {
  --item-padding-x: 0.25rem;
  .btn {
    /* --bs-btn-padding-y: 0.25rem; */
    --bs-btn-padding-x: var(--item-padding-x);
  }
  .nav-link {
    --bs-nav-link-padding-y: 0.25rem;
    --bs-nav-link-padding-x: var(--item-padding-x);
  }
}

.bookmark-toggle {
  --bl-icon-color: var(--bs-primary);
  color: var(--stanford-80-black);

  input[type="submit"] {
    display: none;
  }

  .toggle-bookmark {
    cursor: pointer;

    .toggle-bookmark-label {
      cursor: pointer;
      font-weight: inherit;
      --bookmark-width-height: 1rem;

      .blacklight-icons svg {
        height: var(--bookmark-width-height);
        width: var(--bookmark-width-height);
        overflow: visible;
        fill: var(--bl-icon-color);
        vertical-align: sub;
      }

      .bookmark-text {
        cursor: pointer;
      }
    }

    .bookmark-hover-icon, .bookmark-checked-icon {
      display: none;
    }

    &:has(input[type="checkbox"]:checked) {
       .bookmark-checked-icon {
         display: inline;
       }

      .blacklight-icons-bookmark:hover {
        .bookmark-checked-icon {
          display: none;
        }

        .bookmark-hover-icon {
          display: inline;
        }
      }

       .bookmark-unchecked-icon {
         display: none;
       }
    }

    .bookmark-hover-icon {
      --bl-icon-color: var(--stanford-digital-red-light);
    }

    .bookmark-unchecked-icon {
      --bl-icon-color: var(--bs-nav-link-color);
    }

    .bookmark-checked-icon {
      --bl-icon-color: var(--stanford-cardinal);
    }
  }
  

  /* override for line 21.
      Creates weird spacing in toolbar when min-width is set to 8rem */
  .header-tools .toggle-bookmark-label {
    min-width: 2rem;
  }
}

.record-browse-nearby {
  .bookmark-text {
    display: none;
  }

  .blacklight-icons svg {
    --bookmark-width-height: 1.25rem;
  }

  .btn-preview {
    margin-top: -0.125em;
  }
}