peritus_obsidian-interactive-ratings/styles.css

/* Interactive Ratings Plugin - Editor Mode Only */

/* Editor Widget Styles - For Editing Mode Only */
.interactive-rating-editor-widget {
  display: inline;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  color: inherit;
  background: transparent;
  border: none;
  padding: 0;
  margin: 0;
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

.interactive-rating-editor-widget:hover {
  /* No visual changes on hover */
}

/* Editor widget symbols container */
.interactive-rating-editor-widget .interactive-rating-symbols {
  display: inline;
  cursor: pointer;
  padding: 0;
  margin: 0;
  background: transparent;
}

/* Editor widget rating text */
.interactive-rating-editor-widget .interactive-rating-text {
  display: inline;
  cursor: default;
  padding: 0;
  margin: 0;
  color: inherit;
}

/* Individual symbol spans in editor widget with half-symbol support */
.interactive-rating-editor-widget .interactive-rating-symbols span {
  position: relative;
  cursor: pointer;
  display: inline-block;
}

/* Enhanced hover effect for symbols with half-symbol visual feedback */
.interactive-rating-editor-widget .interactive-rating-symbols span:hover {
  /* No visual changes on hover */
}

/* Half-symbol visual feedback - subtle indicator for symbols that support halves */
.interactive-rating-editor-widget[data-supports-half="true"] .interactive-rating-symbols span {
  /* No visual changes */
}

.interactive-rating-editor-widget[data-supports-half="true"] .interactive-rating-symbols span:hover {
  /* No visual changes */
}

/* Visual hint for half-symbol positioning */
.interactive-rating-editor-widget[data-supports-half="true"] .interactive-rating-symbols span::before {
  /* No visual elements */
}

/* Show the half-symbol divider on hover when half symbols are supported */
.interactive-rating-editor-widget[data-supports-half="true"]:hover .interactive-rating-symbols span::before {
  /* No visual elements */
}

/* Additional visual enhancement for half-symbol interactions */
.interactive-rating-editor-widget[data-supports-half="true"] .interactive-rating-symbols span:hover::after {
  /* No visual elements */
}

/* Mobile/touch enhancements for editor */
@media (max-width: 768px) {
  .interactive-rating-editor-widget {
    padding: 0;
    display: inline;
  }
}

/* High contrast accessibility for editor */
@media (prefers-contrast: high) {
  .interactive-rating-editor-widget:hover {
    /* No visual changes */
  }

  /* Enhanced visibility for half-symbol indicators in high contrast */
  .interactive-rating-editor-widget[data-supports-half="true"] .interactive-rating-symbols span::before {
    /* No visual elements */
  }

  .interactive-rating-editor-widget[data-supports-half="true"]:hover .interactive-rating-symbols span::before {
    /* No visual elements */
  }
}

/* Reduced motion accessibility */
@media (prefers-reduced-motion: reduce) {
  .interactive-rating-editor-widget,
  .interactive-rating-editor-widget .interactive-rating-symbols span,
  .interactive-rating-editor-widget .interactive-rating-symbols span::before,
  .interactive-rating-editor-widget .interactive-rating-symbols span::after {
    /* No transitions to remove */
  }
}

/* Animation for rating transitions */
.interactive-rating-editor-widget .interactive-rating-symbols {
  /* No transitions */
}

.interactive-rating-editor-widget .interactive-rating-text {
  /* No transitions */
}

/* Smooth symbol transitions during preview */
.interactive-rating-editor-widget .interactive-rating-symbols span {
  /* No transitions */
}