.dnd5e-item-loading {
  width: 1rem;
  height: 1rem;
}

.item-detail-container {
  padding: 10px;
  color: #fff!important;
  position: relative;
  border-radius: 8px;
  overflow: hidden;
}

/* Rarity background gradients */
.item-detail-container.rarity-mundane {
  border-bottom: 2px solid #757575;
  background: linear-gradient(90deg, rgba(0,0,0,1) 66%, rgba(117,117,117,0.3) 100%);
}

.item-detail-container.rarity-common {
  border-bottom: 2px solid #b0bec5;
  background: linear-gradient(90deg, rgba(0,0,0,1) 66%, rgba(176,190,197,0.3) 100%);
}

.item-detail-container.rarity-uncommon {
  border-bottom: 2px solid #4caf50;
  background: linear-gradient(90deg, rgba(0,0,0,1) 66%, rgba(76,175,80,0.3) 100%);
}

.item-detail-container.rarity-rare {
  border-bottom: 2px solid #2196f3;
  background: linear-gradient(90deg, rgba(0,0,0,1) 66%, rgba(33,150,243,0.3) 100%);
}

.item-detail-container.rarity-very-rare {
  border-bottom: 2px solid #9c27b0;
  background: linear-gradient(90deg, rgba(0,0,0,1) 66%, rgba(156,39,176,0.3) 100%);
}

.item-detail-container.rarity-legendary {
  border-bottom: 2px solid #f57c00;
  background: linear-gradient(90deg, rgba(0,0,0,1) 66%, rgba(245,124,0,0.3) 100%);
  background-color: rgba(0, 0, 0, 0);
}

.item-detail-container.rarity-artifact {
  border-bottom: 2px solid #d50000;
  background: linear-gradient(90deg, rgba(0,0,0,1) 66%, rgba(213,0,0,0.3) 100%);
}

/* Rarity badges */
.rarity-badge {
  display: inline-block;
  padding: 5px 10px;
  border-radius: 4px;
  margin-bottom: 10px;
  font-weight: bold;
  text-align: center;
  width: max-content;
}

.rarity-badge.rarity-mundane {
  background-color: rgba(100, 150, 100, 0.3);
  color: #b0bec5;
  border: 1px solid #b0bec5;
}

.rarity-badge.rarity-common {
  background-color: rgba(100, 150, 100, 0.3);
  color: #b0bec5;
  border: 1px solid #b0bec5;
}

.rarity-badge.rarity-uncommon {
  background-color: rgba(100, 150, 100, 0.3);
  color: #8aff8a;
  border: 1px solid #8aff8a;
}

.rarity-badge.rarity-rare {
  background-color: rgba(100, 100, 220, 0.3);
  color: #8a8aff;
  border: 1px solid #8a8aff;
}

.rarity-badge.rarity-very-rare {
  background-color: rgba(150, 50, 220, 0.3);
  color: #c28aff;
  border: 1px solid #c28aff;
}

.rarity-badge.rarity-legendary {
  background-color: rgba(255, 165, 0, 0.3);
  color: #ffa500;
  border: 1px solid #ffa500;
}

.rarity-badge.rarity-artifact {
  background-color: rgba(255, 50, 100, 0.3);
  color: #ff5064;
  border: 1px solid #ff5064;
}

.accordion-body {
  padding-left: 0px!important;
  padding-right: 0px!important;
}

.accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E");
}

.accordion-button::after {
  background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E");
}

.accordion-button:not(.collapsed) {
  color: #fff;
}

.accordion-button:focus {
  box-shadow: 0 0 0 0.25rem rgba(189, 154, 0, 0.25);
}

/* Override button transformations for accordion buttons */
#dnd5eAccordion .accordion-button {
  transform: none !important;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
              border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out,
              border-radius 0.15s ease;
}

#dnd5eAccordion .accordion-button:hover {
  transform: none !important;
}

.add-to-inventory-form {
  background-color: rgba(33, 37, 41, 0.5);
}
