/* Tag Component Styles - Pure CSS */
.tag-button {
  transition: all 0.3s ease !important;
}

.tag-button:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1) !important;
}

.tag-button.bg-\[\#E65C00\] {
  background-color: #e65c00 !important;
  color: white !important;
}

.tag-button.bg-\[\#F8C8A9\] {
  background-color: #f8c8a9 !important;
  color: #333 !important;
}

.tag-content {
  transition: opacity 0.3s ease, transform 0.3s ease !important;
}

.tag-content.hidden {
  display: none !important;
  opacity: 0 !important;
}

.tag-content:not(.hidden) {
  opacity: 1 !important;
}

/* Responsive design */
@media (max-width: 768px) {
  .tag-button {
    width: 100% !important;
    max-width: 200px !important;
  }
}