/* widgets/reviews/reviews.css */

/* Attributed-card palette (RV-card design). Tunable in one place; each value
 * falls back to the mock defaults approved on the direction board. */
:root, :host {
  --hr-rv-star: #f09f1f;
  --hr-rv-avatar-bg: #e7efe9;
  --hr-rv-avatar-ink: #2c5f52;
  --hr-rv-source-bg: #fdf3f2;
  --hr-rv-source-border: #edd6d4;
  --hr-rv-source-ink: #b3443f;
}

.text-yellow-500 {
  color: var(--hr-rv-star, #f09f1f) !important;
}

.reviews-bg-gray {
  background-color: #f9fafb;
}

:root, :host {
  background-color: transparent !important;
}

.homerunner-reviews-container {
  background-color: transparent !important;
}

/* Dark Theme Support */
.homerunner-reviews-container.dark {
  color-scheme: dark;
  color: var(--foreground) !important;
}

.homerunner-reviews-container.dark * {
  color: inherit;
}

.dark .homerunner-review-card {
  background-color: var(--card) !important;
  color: var(--card-foreground) !important;
  border-color: var(--border) !important;
}

.homerunner-reviews-container.dark .homerunner-reviews-header-content {
  background-color: var(--muted) !important;
}

.homerunner-reviews-container.dark .homerunner-reviews-header-title {
  color: var(--foreground) !important;
}

.homerunner-reviews-container.dark .homerunner-reviews-header-label {
  color: var(--foreground) !important;
}

.homerunner-reviews-container.dark .homerunner-reviews-header-average-rating {
  color: var(--foreground) !important;
}

.homerunner-reviews-container.dark .homerunner-reviews-header-review-count {
  color: var(--muted-foreground) !important;
}

.homerunner-reviews-container.dark .homerunner-review-card-property-label {
  color: var(--foreground) !important;
}

.homerunner-reviews-container.dark .homerunner-review-card-title {
  color: var(--foreground) !important;
}

.homerunner-reviews-container.dark .homerunner-review-card-feedback {
  color: var(--foreground) !important;
}

.homerunner-reviews-container.dark .homerunner-reviews-badge {
  background-color: var(--card) !important;
  color: var(--card-foreground) !important;
  border-color: var(--border) !important;
}

.homerunner-reviews-container.dark .homerunner-reviews-badge-label {
  color: var(--card-foreground) !important;
}

.homerunner-reviews-container.dark .homerunner-reviews-badge-average-rating {
  color: var(--card-foreground) !important;
}

.homerunner-reviews-container.dark .homerunner-reviews-badge-count {
  color: var(--muted-foreground) !important;
}

/* Reviews Badge Modal Dark Theme Support */
.homerunner-reviews-container.dark .homerunner-reviews-badge-backdrop {
  background-color: rgba(0, 0, 0, 0.8) !important;
  backdrop-filter: blur(8px) !important;
}

.homerunner-reviews-container.dark .homerunner-reviews-badge-modal {
  background-color: var(--background) !important;
  color: var(--foreground) !important;
  border-color: var(--border) !important;
}

.homerunner-reviews-container.dark .homerunner-reviews-badge-modal-header {
  background-color: var(--card) !important;
  color: var(--card-foreground) !important;
  border-color: var(--border) !important;
}

.homerunner-reviews-container.dark .homerunner-reviews-badge-modal-title {
  color: var(--card-foreground) !important;
}

.homerunner-reviews-container.dark .homerunner-reviews-badge-modal-close {
  color: var(--card-foreground) !important;
}

.homerunner-reviews-container.dark .homerunner-reviews-badge-modal-close:hover {
  opacity: 1 !important;
}

.homerunner-reviews-container.dark .homerunner-reviews-badge-modal-average-rating {
  color: var(--card-foreground) !important;
}

.homerunner-reviews-container.dark .homerunner-reviews-badge-modal-review-count {
  color: var(--muted-foreground) !important;
}

.homerunner-reviews-container.dark .homerunner-reviews-badge-modal-content {
  background-color: var(--background) !important;
  color: var(--foreground) !important;
}

.homerunner-reviews-container.dark .homerunner-reviews-badge-modal-reviews-list {
  color: var(--foreground) !important;
}

.homerunner-reviews-container.dark .homerunner-reviews-badge-modal-review-item {
  color: var(--foreground) !important;
}

.homerunner-reviews-container.dark .homerunner-reviews-badge-modal-load-more {
  color: var(--foreground) !important;
}

/* ----------------------------------------------------------------------------
 * Review attribution (shared header: avatar initials + name + subline + badge)
 * Used inside cards, list rows, and the review-details modal — this file is
 * cloned into every elevated dialog shadow root, so the styles reach all of
 * them.
 * -------------------------------------------------------------------------- */

.homerunner-review-attribution {
  width: 100%;
}

.homerunner-review-attribution-avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 9999px;
  background-color: var(--hr-rv-avatar-bg, #e7efe9);
  color: var(--hr-rv-avatar-ink, #2c5f52);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  flex-shrink: 0;
  user-select: none;
}

.homerunner-review-attribution-author-name {
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1.3;
  color: var(--foreground);
}

.homerunner-review-attribution-subline {
  font-size: 0.78rem;
  line-height: 1.4;
  color: var(--muted-foreground);
}

.homerunner-review-attribution-source {
  margin-left: auto;
  align-self: flex-start;
  flex-shrink: 0;
  font-size: 0.7rem;
  font-weight: 700;
  color: var(--hr-rv-source-ink, #b3443f);
  background-color: var(--hr-rv-source-bg, #fdf3f2);
  border: 1px solid var(--hr-rv-source-border, #edd6d4);
  border-radius: 6px;
  padding: 0.14rem 0.45rem;
  white-space: nowrap;
  max-width: 9rem;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Dark mode: neutralize the tinted chips so they sit on dark cards. */
.homerunner-reviews-container.dark .homerunner-review-attribution-avatar,
.homerunner-review-details-modal.dark .homerunner-review-attribution-avatar,
.homerunner-all-reviews-modal.dark .homerunner-review-attribution-avatar {
  background-color: var(--muted) !important;
  color: var(--foreground) !important;
}

.homerunner-reviews-container.dark .homerunner-review-attribution-source,
.homerunner-review-details-modal.dark .homerunner-review-attribution-source,
.homerunner-all-reviews-modal.dark .homerunner-review-attribution-source {
  background-color: var(--muted) !important;
  border-color: var(--border) !important;
  color: var(--foreground) !important;
}

.homerunner-reviews-container.dark .homerunner-review-attribution-author-name,
.homerunner-review-details-modal.dark .homerunner-review-attribution-author-name,
.homerunner-all-reviews-modal.dark .homerunner-review-attribution-author-name {
  color: var(--foreground) !important;
}

.homerunner-reviews-container.dark .homerunner-review-attribution-subline,
.homerunner-review-details-modal.dark .homerunner-review-attribution-subline,
.homerunner-all-reviews-modal.dark .homerunner-review-attribution-subline {
  color: var(--muted-foreground) !important;
}

/* Review Details Modal Positioning Fix */
.homerunner-review-details-modal.hr-dialog-content {
  top: auto;
  transform: none;
}

/* Ensure review details modal stacks above all-reviews modal */
.hr-dialog-wrapper:has(.homerunner-review-details-modal) {
  z-index: 100001 !important;
}

.hr-dialog-overlay:has(+ .hr-dialog-wrapper .homerunner-review-details-modal) {
  z-index: 100000 !important;
}

/* Review Details Modal Dark Theme Support */
.homerunner-review-details-modal.dark, .homerunner-all-reviews-modal.dark {
  background-color: var(--card) !important;
  color: var(--card-foreground) !important;
  border-color: var(--border) !important;
}

.homerunner-review-details-modal.dark *, .homerunner-all-reviews-modal.dark * {
  color: inherit;
}

.homerunner-review-details-modal.dark .homerunner-review-details-modal-header, .homerunner-all-reviews-modal.dark .homerunner-all-reviews-modal-header {
  background-color: var(--card) !important;
  color: var(--card-foreground) !important;
  border-color: var(--border) !important;
}

.homerunner-review-details-modal.dark .homerunner-review-details-modal-title, .homerunner-all-reviews-modal.dark .homerunner-all-reviews-modal-title {
  color: var(--card-foreground) !important;
}

.homerunner-review-details-modal.dark .homerunner-review-details-modal-content, .homerunner-all-reviews-modal.dark .homerunner-all-reviews-modal-content {
  color: var(--card-foreground) !important;
}

.homerunner-review-details-modal.dark .homerunner-review-details-modal-header-left {
  color: var(--card-foreground) !important;
}

.homerunner-review-details-modal.dark .homerunner-review-details-modal-rating {
  color: var(--card-foreground) !important;
}

.homerunner-review-details-modal.dark .homerunner-review-details-modal-property {
  color: var(--foreground) !important;
}

.homerunner-review-details-modal.dark .homerunner-review-details-modal-property-icon {
  color: var(--foreground) !important;
}

.homerunner-review-details-modal.dark .homerunner-review-details-modal-property-label {
  color: var(--foreground) !important;
}

.homerunner-review-details-modal.dark .homerunner-review-details-modal-property-name {
  color: var(--primary) !important;
}

.homerunner-review-details-modal.dark .homerunner-review-details-modal-title-text {
  color: var(--foreground) !important;
}

.homerunner-review-details-modal.dark .homerunner-review-details-modal-feedback {
  color: var(--foreground) !important;
}

/* Tooltip Dark Theme Support */
.homerunner-reviews-container.dark .homerunner-review-details-modal .tooltip-content {
  background-color: var(--popover) !important;
  color: var(--popover-foreground) !important;
  border-color: var(--border) !important;
}

/* Sheet slide animations */
@keyframes slide-in-from-left {
  from { transform: translateX(-100%); }
  to { transform: translateX(0); }
}

@keyframes slide-out-to-left {
  from { transform: translateX(0); }
  to { transform: translateX(-100%); }
}

@keyframes slide-in-from-right {
  from { transform: translateX(100%); }
  to { transform: translateX(0); }
}

@keyframes slide-out-to-right {
  from { transform: translateX(0); }
  to { transform: translateX(100%); }
}

@keyframes slide-in-from-top {
  from { transform: translateY(-100%); }
  to { transform: translateY(0); }
}

@keyframes slide-in-from-bottom {
  from { transform: translateY(100%); }
  to { transform: translateY(0); }
}

@keyframes slide-out-to-top {
  from { transform: translateY(0); }
  to { transform: translateY(-100%); }
}

@keyframes slide-out-to-bottom {
  from { transform: translateY(0); }
  to { transform: translateY(100%); }
}

.slide-in-from-left { animation: slide-in-from-left 0.3s ease-out; }
.slide-out-to-left { animation: slide-out-to-left 0.3s ease-in; }
.slide-in-from-right { animation: slide-in-from-right 0.3s ease-out; }
.slide-out-to-right { animation: slide-out-to-right 0.3s ease-in; }
.slide-in-from-top { animation: slide-in-from-top 0.3s ease-out; }
.slide-out-to-top { animation: slide-out-to-top 0.3s ease-in; }
.slide-in-from-bottom { animation: slide-in-from-bottom 0.3s ease-out; }
.slide-out-to-bottom { animation: slide-out-to-bottom 0.3s ease-in; }

/* Masonry Grid Layout */
.masonry-grid {
  grid-template-rows: masonry;
  align-tracks: start;
}

@supports not (grid-template-rows: masonry) {
  .masonry-grid {
    display: block;
    column-count: var(--masonry-columns-desktop, 3);
    column-gap: 1rem;
  }

  .masonry-grid > * {
    break-inside: avoid;
    margin-bottom: 1rem;
  }

  @media (max-width: 640px) {
    .masonry-grid {
      column-count: var(--masonry-columns-mobile, 1);
    }
  }

  @media (min-width: 641px) and (max-width: 780px) {
    .masonry-grid {
      column-count: var(--masonry-columns-tablet, 2);
    }
  }

  @media (min-width: 781px) and (max-width: 1200px) {
    .masonry-grid {
      column-count: var(--masonry-columns-tablet, 2);
    }
  }

  @media (min-width: 1201px) {
    .masonry-grid {
      column-count: var(--masonry-columns-desktop, 3);
    }
  }
}

/* Line clamp utility */
.line-clamp-4 {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* All Reviews Modal Styles */
.homerunner-all-reviews-modal.hr-dialog-content {
  max-width: min(1280px, 95vw);
}

.homerunner-all-reviews-modal {
  display: flex;
  flex-direction: column;
  height: 90vh;
  background: var(--background);
  border-radius: 0.5rem;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

.homerunner-all-reviews-modal .homerunner-review-card {
  height: auto;
  min-height: 200px;
}

.homerunner-all-reviews-modal [data-radix-dialog-content] {
  display: flex;
  flex-direction: column;
  height: 90vh;
  max-height: 90vh;
  background: var(--background);
  border-radius: 0.5rem;
}

@media (max-width: 640px) {
  .homerunner-all-reviews-modal {
    border-radius: 0;
    height: 100vh;
    padding: 0.75rem;
  }

  .homerunner-all-reviews-modal [data-radix-dialog-content] {
    border-radius: 0;
    height: 100vh;
  }

  .homerunner-all-reviews-modal [data-radix-dialog-header] {
    padding: 0.75rem 0.75rem 0 0.75rem;
  }

  .homerunner-all-reviews-modal .flex-1 {
    padding: 0 0.5rem 0.5rem 0.5rem;
  }
}

.homerunner-all-reviews-modal .flex-1 {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: 0 1rem 1rem 1rem;
  scrollbar-width: thin;
  scrollbar-color: var(--border) transparent;
}

.homerunner-all-reviews-modal .flex-1::-webkit-scrollbar {
  width: 6px;
}

.homerunner-all-reviews-modal .flex-1::-webkit-scrollbar-track {
  background: transparent;
}

.homerunner-all-reviews-modal .flex-1::-webkit-scrollbar-thumb {
  background-color: var(--border);
  border-radius: 3px;
}

.homerunner-all-reviews-modal.dark .flex-1 {
  scrollbar-color: var(--muted-foreground) transparent;
}

.homerunner-all-reviews-modal.dark .flex-1::-webkit-scrollbar-thumb {
  background-color: var(--muted-foreground);
}

.homerunner-all-reviews-modal .homerunner-reviews-grid-wrapper {
  padding: 0;
}

.homerunner-all-reviews-modal [data-radix-dialog-header] {
  padding: 1.5rem 1.5rem 0 1.5rem;
}

/* Page-level card layouts get a small edge inset so card borders/shadows and
 * the carousel arrows don't sit flush against the embed container. The
 * all-reviews modal keeps its own tighter padding (rule below wins on
 * specificity). */
.homerunner-reviews-carousel-wrapper,
.homerunner-reviews-grid-wrapper {
  padding: 0 0.5rem;
}

/* Keep the nav arrows fully inside the container: the shared ui/carousel
 * component defaults them to -start-12/-end-12 (off-canvas), and the
 * single-class tailwind overrides passed in JSX lose that merge. Two-class
 * specificity here settles it. Logical properties (#712) — physical left/
 * right here would pin both arrows to the LTR side on an RTL host page,
 * on top of the higher specificity that already makes this the actual
 * positioning authority regardless of what the JSX class list resolves to. */
.homerunner-reviews-carousel-container .homerunner-reviews-carousel-prev {
  inset-inline-start: 0.25rem;
}

.homerunner-reviews-carousel-container .homerunner-reviews-carousel-next {
  inset-inline-start: auto;
  inset-inline-end: 0.25rem;
}

/* Grid column layout using CSS variables (non-masonry only) */
.homerunner-reviews-grid-container:not(.masonry-grid) {
  grid-template-columns: repeat(var(--grid-columns-mobile, 1), 1fr);
}

@media (min-width: 641px) and (max-width: 1200px) {
  .homerunner-reviews-grid-container:not(.masonry-grid) {
    grid-template-columns: repeat(var(--grid-columns-tablet, 2), 1fr);
  }
}

@media (min-width: 1201px) {
  .homerunner-reviews-grid-container:not(.masonry-grid) {
    grid-template-columns: repeat(var(--grid-columns-desktop, 4), 1fr);
  }
}

/* ----------------------------------------------------------------------------
 * List layout
 * Stacked vertical list of attributed reviews: attribution header, then
 * stars + optional title + body, plus an optional Show More pill button.
 * -------------------------------------------------------------------------- */

.homerunner-reviews-list-wrapper {
  width: 100%;
}

.homerunner-reviews-list-items {
  list-style: none;
  margin: 0;
  padding: 0;
}

.homerunner-reviews-list-item {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 2rem 1.25rem;
}

.homerunner-reviews-list-attribution {
  display: flex;
}

.homerunner-reviews-list-item--divided {
  border-bottom: 1px solid var(--border);
}

.homerunner-reviews-list-item:first-child {
  padding-top: 0.5rem;
}

.homerunner-reviews-list-body {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  min-width: 0;
}

.homerunner-reviews-list-title {
  margin: 0;
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.3;
  color: var(--foreground);
}

.homerunner-reviews-list-rating {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.homerunner-reviews-list-content {
  margin: 0;
  font-size: 1rem;
  line-height: 1.65;
  color: var(--foreground);
  white-space: pre-wrap;
}

.homerunner-reviews-list-actions {
  display: flex;
  justify-content: center;
  margin-top: 1.5rem;
}

.homerunner-reviews-list-actions--left {
  justify-content: flex-start;
}

.homerunner-reviews-list-actions--center {
  justify-content: center;
}

.homerunner-reviews-list-actions--right {
  justify-content: flex-end;
}

/* Background color comes from the `bg-accent` Tailwind class applied in JSX,
 * which useReviewsCss overrides at runtime with the configured accent color. */
.homerunner-reviews-list-show-more {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.75rem 2rem;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--primary-foreground, #ffffff);
  border: none;
  border-radius: 9999px;
  cursor: pointer;
  transition: opacity 0.15s ease, background-color 0.15s ease;
}

.homerunner-reviews-list-show-more:hover:not(:disabled) {
  opacity: 0.92;
}

.homerunner-reviews-list-show-more:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

@media (max-width: 640px) {
  .homerunner-reviews-list-item {
    gap: 0.75rem;
    padding: 1.5rem 1rem;
  }
  .homerunner-reviews-list-title {
    font-size: 1.05rem;
  }
  .homerunner-reviews-list-content {
    font-size: 0.95rem;
  }
}

/* Dark mode */
.homerunner-reviews-container.dark .homerunner-reviews-list-title,
.homerunner-reviews-container.dark .homerunner-reviews-list-content {
  color: var(--foreground);
}

.homerunner-reviews-container.dark .homerunner-reviews-list-item--divided {
  border-bottom-color: var(--border);
}

/* List layout — modal scroll container & sentinel */

.homerunner-reviews-list-modal .homerunner-reviews-list-items {
  padding: 0 0.25rem;
}

.homerunner-reviews-list-modal-scroll {
  scroll-behavior: smooth;
}

.homerunner-reviews-list-modal-scroll::-webkit-scrollbar {
  width: 8px;
}

.homerunner-reviews-list-modal-scroll::-webkit-scrollbar-thumb {
  background-color: var(--border);
  border-radius: 4px;
}

.homerunner-reviews-list-modal-loading {
  padding: 3rem 1.5rem;
  text-align: center;
  color: var(--muted-foreground);
}

/* Load More buttons inside the dialogs (grid + list "All Reviews" modals).
 * Styled here in reviews.css — which is cloned into the elevated dialog
 * shadow root — rather than with Tailwind utilities, which do NOT reach the
 * portal. Same pattern as .homerunner-reviews-list-show-more: layout/shape
 * from this rule, background from the `bg-accent` class (overridden at
 * runtime by useReviewsCss with the configured accent color). */
.homerunner-reviews-grid-load-more-wrapper,
.homerunner-reviews-list-modal-load-more {
  display: flex;
  justify-content: center;
  margin-top: 1.5rem;
}

.homerunner-reviews-grid-load-more-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.75rem 2rem;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--primary-foreground, #ffffff);
  border: none;
  border-radius: 9999px;
  cursor: pointer;
  transition: opacity 0.15s ease, background-color 0.15s ease;
}

.homerunner-reviews-grid-load-more-button:hover:not(:disabled) {
  opacity: 0.92;
}

.homerunner-reviews-grid-load-more-button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

@media (max-width: 640px) {
  .homerunner-reviews-list-modal .homerunner-reviews-list-items {
    padding: 0;
  }
}

/* ----------------------------------------------------------------------------
 * Section heading (shared across content widgets)
 * Bold title on the left + horizontal divider line filling remaining width.
 * -------------------------------------------------------------------------- */

.hr-widget-section {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin-bottom: 2rem;
  width: 100%;
}

.hr-widget-section-title {
  margin: 0;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--foreground);
  white-space: nowrap;
  flex-shrink: 0;
}

.hr-widget-section-line {
  flex: 1;
  height: 1px;
  background-color: currentColor;
  opacity: 0.18;
  display: block;
}

@media (max-width: 640px) {
  .hr-widget-section-title { font-size: 1.25rem; }
  .hr-widget-section { gap: 1rem; margin-bottom: 1.5rem; }
}

/* ----------------------------------------------------------------------------
 * Dark FIRST-PAINT (#900) — CSS mirror of the JS-driven `.dark` rules above.
 *
 * The `.dark`-keyed rules above only fire once the runtime resolves the theme
 * and stamps the `.dark` class on the container — too late to paint dark at
 * parse. These append-only siblings reuse the EXACT same declarations under
 * the shadow-host markers instead, so an `auto` widget on a dark OS paints
 * dark AT PARSE:
 *   - `:host([data-hr-theme="dark"])` — the runtime marker (explicit dark +
 *     post-hydration auto), plus the mirrored elevated-dialog host. Since the
 *     host marker covers the whole shadow tree, the per-container `.dark`
 *     scoping (`.homerunner-reviews-container` / `.homerunner-review-details-modal`
 *     / `.homerunner-all-reviews-modal`) collapses to one prefix.
 *   - inside `@media (prefers-color-scheme: dark)`,
 *     `:host([data-hr-scheme="auto"]:not([data-hr-theme]))` — a server-stamped
 *     auto widget with NO theme marker, painting dark with no JS/cookie; the
 *     `:not([data-hr-theme])` (kept INSIDE `:host(...)`) drops this block the
 *     instant the runtime stamps the marker at hydration, handing off to the
 *     block above. The tokens themselves (`--foreground`, `--card`, …) already
 *     flip under these same host selectors in styles/common.css.
 * The `.dark` rules above are left untouched; light rendering is unchanged.
 * -------------------------------------------------------------------------- */

:host([data-hr-theme="dark"]) .homerunner-reviews-container {
  color-scheme: dark;
  color: var(--foreground) !important;
}

:host([data-hr-theme="dark"]) .homerunner-reviews-container *,
:host([data-hr-theme="dark"]) .homerunner-review-details-modal *,
:host([data-hr-theme="dark"]) .homerunner-all-reviews-modal * {
  color: inherit;
}

:host([data-hr-theme="dark"]) .homerunner-review-card,
:host([data-hr-theme="dark"]) .homerunner-reviews-badge,
:host([data-hr-theme="dark"]) .homerunner-reviews-badge-modal-header,
:host([data-hr-theme="dark"]) .homerunner-review-details-modal,
:host([data-hr-theme="dark"]) .homerunner-all-reviews-modal,
:host([data-hr-theme="dark"]) .homerunner-review-details-modal-header,
:host([data-hr-theme="dark"]) .homerunner-all-reviews-modal-header {
  background-color: var(--card) !important;
  color: var(--card-foreground) !important;
  border-color: var(--border) !important;
}

:host([data-hr-theme="dark"]) .homerunner-reviews-header-content {
  background-color: var(--muted) !important;
}

:host([data-hr-theme="dark"]) .homerunner-reviews-header-title,
:host([data-hr-theme="dark"]) .homerunner-reviews-header-label,
:host([data-hr-theme="dark"]) .homerunner-reviews-header-average-rating,
:host([data-hr-theme="dark"]) .homerunner-review-card-property-label,
:host([data-hr-theme="dark"]) .homerunner-review-card-title,
:host([data-hr-theme="dark"]) .homerunner-review-card-feedback,
:host([data-hr-theme="dark"]) .homerunner-reviews-badge-modal-reviews-list,
:host([data-hr-theme="dark"]) .homerunner-reviews-badge-modal-review-item,
:host([data-hr-theme="dark"]) .homerunner-reviews-badge-modal-load-more,
:host([data-hr-theme="dark"]) .homerunner-review-attribution-author-name,
:host([data-hr-theme="dark"]) .homerunner-review-details-modal-property,
:host([data-hr-theme="dark"]) .homerunner-review-details-modal-property-icon,
:host([data-hr-theme="dark"]) .homerunner-review-details-modal-property-label,
:host([data-hr-theme="dark"]) .homerunner-review-details-modal-title-text,
:host([data-hr-theme="dark"]) .homerunner-review-details-modal-feedback {
  color: var(--foreground) !important;
}

:host([data-hr-theme="dark"]) .homerunner-reviews-header-review-count,
:host([data-hr-theme="dark"]) .homerunner-reviews-badge-count,
:host([data-hr-theme="dark"]) .homerunner-reviews-badge-modal-review-count,
:host([data-hr-theme="dark"]) .homerunner-review-attribution-subline {
  color: var(--muted-foreground) !important;
}

:host([data-hr-theme="dark"]) .homerunner-reviews-badge-label,
:host([data-hr-theme="dark"]) .homerunner-reviews-badge-average-rating,
:host([data-hr-theme="dark"]) .homerunner-reviews-badge-modal-title,
:host([data-hr-theme="dark"]) .homerunner-reviews-badge-modal-close,
:host([data-hr-theme="dark"]) .homerunner-reviews-badge-modal-average-rating,
:host([data-hr-theme="dark"]) .homerunner-review-details-modal-title,
:host([data-hr-theme="dark"]) .homerunner-all-reviews-modal-title,
:host([data-hr-theme="dark"]) .homerunner-review-details-modal-content,
:host([data-hr-theme="dark"]) .homerunner-all-reviews-modal-content,
:host([data-hr-theme="dark"]) .homerunner-review-details-modal-header-left,
:host([data-hr-theme="dark"]) .homerunner-review-details-modal-rating {
  color: var(--card-foreground) !important;
}

:host([data-hr-theme="dark"]) .homerunner-reviews-badge-backdrop {
  background-color: rgba(0, 0, 0, 0.8) !important;
  backdrop-filter: blur(8px) !important;
}

:host([data-hr-theme="dark"]) .homerunner-reviews-badge-modal {
  background-color: var(--background) !important;
  color: var(--foreground) !important;
  border-color: var(--border) !important;
}

:host([data-hr-theme="dark"]) .homerunner-reviews-badge-modal-content {
  background-color: var(--background) !important;
  color: var(--foreground) !important;
}

:host([data-hr-theme="dark"]) .homerunner-review-details-modal-property-name {
  color: var(--primary) !important;
}

:host([data-hr-theme="dark"]) .homerunner-review-details-modal .tooltip-content {
  background-color: var(--popover) !important;
  color: var(--popover-foreground) !important;
  border-color: var(--border) !important;
}

:host([data-hr-theme="dark"]) .homerunner-review-attribution-avatar {
  background-color: var(--muted) !important;
  color: var(--foreground) !important;
}

:host([data-hr-theme="dark"]) .homerunner-review-attribution-source {
  background-color: var(--muted) !important;
  border-color: var(--border) !important;
  color: var(--foreground) !important;
}

:host([data-hr-theme="dark"]) .homerunner-reviews-list-title,
:host([data-hr-theme="dark"]) .homerunner-reviews-list-content {
  color: var(--foreground);
}

:host([data-hr-theme="dark"]) .homerunner-reviews-list-item--divided {
  border-bottom-color: var(--border);
}

:host([data-hr-theme="dark"]) .homerunner-all-reviews-modal .flex-1 {
  scrollbar-color: var(--muted-foreground) transparent;
}

:host([data-hr-theme="dark"]) .homerunner-all-reviews-modal .flex-1::-webkit-scrollbar-thumb {
  background-color: var(--muted-foreground);
}

@media (prefers-color-scheme: dark) {
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-container {
    color-scheme: dark;
    color: var(--foreground) !important;
  }

  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-container *,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-review-details-modal *,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-all-reviews-modal * {
    color: inherit;
  }

  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-review-card,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-badge,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-badge-modal-header,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-review-details-modal,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-all-reviews-modal,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-review-details-modal-header,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-all-reviews-modal-header {
    background-color: var(--card) !important;
    color: var(--card-foreground) !important;
    border-color: var(--border) !important;
  }

  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-header-content {
    background-color: var(--muted) !important;
  }

  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-header-title,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-header-label,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-header-average-rating,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-review-card-property-label,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-review-card-title,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-review-card-feedback,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-badge-modal-reviews-list,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-badge-modal-review-item,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-badge-modal-load-more,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-review-attribution-author-name,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-review-details-modal-property,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-review-details-modal-property-icon,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-review-details-modal-property-label,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-review-details-modal-title-text,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-review-details-modal-feedback {
    color: var(--foreground) !important;
  }

  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-header-review-count,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-badge-count,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-badge-modal-review-count,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-review-attribution-subline {
    color: var(--muted-foreground) !important;
  }

  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-badge-label,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-badge-average-rating,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-badge-modal-title,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-badge-modal-close,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-badge-modal-average-rating,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-review-details-modal-title,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-all-reviews-modal-title,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-review-details-modal-content,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-all-reviews-modal-content,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-review-details-modal-header-left,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-review-details-modal-rating {
    color: var(--card-foreground) !important;
  }

  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-badge-backdrop {
    background-color: rgba(0, 0, 0, 0.8) !important;
    backdrop-filter: blur(8px) !important;
  }

  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-badge-modal {
    background-color: var(--background) !important;
    color: var(--foreground) !important;
    border-color: var(--border) !important;
  }

  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-badge-modal-content {
    background-color: var(--background) !important;
    color: var(--foreground) !important;
  }

  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-review-details-modal-property-name {
    color: var(--primary) !important;
  }

  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-review-details-modal .tooltip-content {
    background-color: var(--popover) !important;
    color: var(--popover-foreground) !important;
    border-color: var(--border) !important;
  }

  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-review-attribution-avatar {
    background-color: var(--muted) !important;
    color: var(--foreground) !important;
  }

  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-review-attribution-source {
    background-color: var(--muted) !important;
    border-color: var(--border) !important;
    color: var(--foreground) !important;
  }

  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-list-title,
  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-list-content {
    color: var(--foreground);
  }

  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-reviews-list-item--divided {
    border-bottom-color: var(--border);
  }

  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-all-reviews-modal .flex-1 {
    scrollbar-color: var(--muted-foreground) transparent;
  }

  :host([data-hr-scheme="auto"]:not([data-hr-theme])) .homerunner-all-reviews-modal .flex-1::-webkit-scrollbar-thumb {
    background-color: var(--muted-foreground);
  }
}