/* Everything expressible as Tailwind utilities lives inline in templates or in
   base.html's `@layer components` block. This file only holds the one thing
   that genuinely can't be a utility: the pure-CSS star-rating widget's
   sibling-hover cascade, plus the default link color (Tailwind has no
   base/reset-layer default link color, light/dark aware). */

a { color: #4f46e5; }
a:hover { color: #4338ca; }
html.dark a { color: #818cf8; }
html.dark a:hover { color: #a5b4fc; }

html { scroll-behavior: smooth; }

::selection { background: #c7d2fe; color: #1e1b4b; }
html.dark ::selection { background: #4338ca; color: #eef2ff; }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #d1d5db; border-radius: 999px; border: 2px solid transparent; background-clip: content-box; }
::-webkit-scrollbar-thumb:hover { background: #9ca3af; background-clip: content-box; }
html.dark ::-webkit-scrollbar-thumb { background: #4b5563; background-clip: content-box; }
html.dark ::-webkit-scrollbar-thumb:hover { background: #6b7280; background-clip: content-box; }

/* Pure-CSS star rating: display */
.star-display { display: inline-flex; font-size: 1.1rem; letter-spacing: 1px; color: #d1d5db; }
html.dark .star-display { color: #4b5563; }
.star-display .filled { color: #f59e0b; }

/* Pure-CSS star rating: input */
.star-input {
  display: inline-flex;
  flex-direction: row-reverse;
  justify-content: flex-end;
}
.star-input input { display: none; }
.star-input label {
  font-size: 1.6rem;
  color: #d1d5db;
  cursor: pointer;
  padding: 0 0.05em;
  transition: color 0.1s ease;
}
html.dark .star-input label { color: #4b5563; }
.star-input input:checked ~ label,
.star-input label:hover,
.star-input label:hover ~ label {
  color: #f59e0b;
}