/*
 * PromXAI Theme 1.4.15.66 — Unified Card Action Color Owner
 *
 * Single late owner for card-level favorite actions across desktop, laptop,
 * tablet and phone. Page-level sharing inside details is not changed.
 */

/* --------------------------------------------------------------------------
   Prompt cards — Homepage remains the visual reference
   -------------------------------------------------------------------------- */
.px-prompt-card .px-card-actions {
  direction: ltr !important;
  grid-template-columns: minmax(0, 1fr) 36px !important;
  gap: 5px !important;
}

.px-prompt-card .px-card-view {
  grid-column: 1 !important;
  grid-row: 1 !important;
  direction: rtl;
}

html[data-ui-lang="en"] .px-prompt-card .px-card-view {
  direction: ltr;
}

.px-prompt-card .px-card-favorite-action {
  position: relative !important;
  inset: auto !important;
  grid-column: 2 !important;
  grid-row: 1 !important;
  width: 36px !important;
  min-width: 36px !important;
  max-width: 36px !important;
  height: 39px !important;
  min-height: 39px !important;
  padding: 0 !important;
  border: 1px solid rgb(255 255 255 / .16) !important;
  border-radius: 12px !important;
  display: inline-grid !important;
  place-items: center !important;
  color: #fff !important;
  background: linear-gradient(180deg, rgb(255 255 255 / .10), rgb(255 255 255 / .05)) !important;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .12), 0 8px 20px rgb(9 14 29 / .18) !important;
  -webkit-backdrop-filter: blur(12px) saturate(135%) !important;
  backdrop-filter: blur(12px) saturate(135%) !important;
  cursor: pointer;
}

.px-prompt-card .px-card-favorite-action:hover,
.px-prompt-card .px-card-favorite-action:focus-visible {
  color: #fff !important;
  border-color: rgb(169 139 255 / .48) !important;
  background: linear-gradient(180deg, rgb(124 58 237 / .25), rgb(37 99 235 / .20)) !important;
  transform: translateY(-1px);
}

.px-prompt-card .px-card-favorite-action.is-saved {
  color: #fff !important;
  border-color: transparent !important;
  background: var(--px-accent-gradient) !important;
  box-shadow: 0 9px 22px rgb(124 58 237 / .28), inset 0 1px 0 rgb(255 255 255 / .18) !important;
}

/* The shared icon reset keeps card icons outlined. Restore the filled white
   heart only for the saved Homepage state, matching Library and Favorites. */
.px-prompt-card .px-card-favorite-action.is-saved .px-icon,
.px-prompt-card .px-card-favorite-action.is-saved svg,
.px-prompt-card .px-card-favorite-action[aria-pressed="true"] .px-icon,
.px-prompt-card .px-card-favorite-action[aria-pressed="true"] svg {
  fill: currentColor !important;
  stroke: currentColor !important;
}

.px-prompt-card .px-card-favorite-action .px-icon,
.px-prompt-card .px-card-favorite-action svg {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  min-height: 18px !important;
}

html[data-theme="light"] .px-prompt-card .px-card-favorite-action {
  color: #6451cf !important;
  border-color: rgb(91 69 175 / .16) !important;
  background: linear-gradient(180deg, #fff, #f2f5ff) !important;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .95), 0 9px 20px rgb(70 82 118 / .11) !important;
}

html[data-theme="light"] .px-prompt-card .px-card-favorite-action.is-saved {
  color: #fff !important;
  border-color: transparent !important;
  background: var(--px-accent-gradient) !important;
}

/* Favorites prompt cards must use the same primary-action color as Homepage. */
body.promxai-favorites-modern-page .px-prompt-card .px-card-view {
  color: #fff !important;
  border-color: transparent !important;
  background: var(--px-accent-gradient) !important;
  box-shadow: 0 10px 22px rgb(84 76 220 / .22), inset 0 1px 0 rgb(255 255 255 / .16) !important;
}

/* --------------------------------------------------------------------------
   AI Hub cards/details — exact canonical heart surface and saved language
   -------------------------------------------------------------------------- */
.px-ai-favorite-action {
  position: relative !important;
  inset: auto !important;
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  border: 1px solid rgb(255 255 255 / .18) !important;
  border-radius: 11px !important;
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 38px !important;
  color: #fff !important;
  background: linear-gradient(180deg, rgb(255 255 255 / .13), rgb(255 255 255 / .07)) !important;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .15), 0 8px 20px rgb(4 8 20 / .16) !important;
  -webkit-backdrop-filter: blur(12px) saturate(135%) !important;
  backdrop-filter: blur(12px) saturate(135%) !important;
  cursor: pointer;
}

.px-ai-favorite-action:hover,
.px-ai-favorite-action:focus-visible {
  color: #fff !important;
  border-color: rgb(169 139 255 / .48) !important;
  background: linear-gradient(180deg, rgb(124 58 237 / .25), rgb(37 99 235 / .20)) !important;
  transform: translateY(-1px);
}

.px-ai-favorite-action.is-saved,
.px-ai-favorite-action[aria-pressed="true"] {
  color: #fff !important;
  border-color: transparent !important;
  background: var(--px-accent-gradient) !important;
  box-shadow: 0 9px 22px rgb(124 58 237 / .28), inset 0 1px 0 rgb(255 255 255 / .18) !important;
}

.px-ai-favorite-action .px-icon,
.px-ai-favorite-action svg {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  min-height: 18px !important;
}

.px-ai-favorite-action.is-saved .px-icon,
.px-ai-favorite-action.is-saved svg,
.px-ai-favorite-action.is-saved path,
.px-ai-favorite-action[aria-pressed="true"] .px-icon,
.px-ai-favorite-action[aria-pressed="true"] svg,
.px-ai-favorite-action[aria-pressed="true"] path {
  fill: currentColor !important;
  stroke: currentColor !important;
}

html[data-theme="light"] .px-ai-favorite-action {
  color: #6451cf !important;
  border-color: rgb(91 69 175 / .16) !important;
  background: linear-gradient(180deg, #fff, #f2f5ff) !important;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .96), 0 9px 20px rgb(70 82 118 / .11) !important;
}

html[data-theme="light"] .px-ai-favorite-action.is-saved,
html[data-theme="light"] .px-ai-favorite-action[aria-pressed="true"] {
  color: #fff !important;
  border-color: transparent !important;
  background: var(--px-accent-gradient) !important;
}

/* --------------------------------------------------------------------------
   Favorites page — prompt and library kinds
   -------------------------------------------------------------------------- */
.px-fav-card__actions {
  direction: ltr !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 38px !important;
  gap: 5px !important;
}

.px-fav-card__view {
  grid-column: 1 !important;
  grid-row: 1 !important;
  direction: rtl;
  color: #fff !important;
  border-color: transparent !important;
  background: var(--px-accent-gradient) !important;
  box-shadow: 0 10px 22px rgb(84 76 220 / .22), inset 0 1px 0 rgb(255 255 255 / .16) !important;
}

html[data-ui-lang="en"] .px-fav-card__view {
  direction: ltr;
}

.px-fav-card__view:hover,
.px-fav-card__view:focus-visible {
  color: #fff !important;
  filter: brightness(1.06);
  transform: translateY(-1px);
}

.px-fav-card__favorite-action {
  position: relative !important;
  inset: auto !important;
  grid-column: 2 !important;
  grid-row: 1 !important;
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  min-height: 38px !important;
  height: 38px !important;
  padding: 0 !important;
  border: 1px solid rgb(255 255 255 / .18) !important;
  border-radius: 11px !important;
  display: inline-grid !important;
  place-items: center !important;
  color: #fff !important;
  background: linear-gradient(180deg, rgb(255 255 255 / .13), rgb(255 255 255 / .07)) !important;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .15), 0 8px 20px rgb(4 8 20 / .16) !important;
  -webkit-backdrop-filter: blur(12px) saturate(135%) !important;
  backdrop-filter: blur(12px) saturate(135%) !important;
  cursor: pointer;
}

.px-fav-card__favorite-action.is-saved {
  color: #fff !important;
  border-color: transparent !important;
  background: var(--px-accent-gradient) !important;
  box-shadow: 0 9px 22px rgb(124 58 237 / .28), inset 0 1px 0 rgb(255 255 255 / .18) !important;
}

.px-fav-card__favorite-action .px-icon,
.px-fav-card__favorite-action svg {
  width: 18px !important;
  height: 18px !important;
}

html[data-theme="light"] .px-fav-card__favorite-action {
  color: #6451cf !important;
  border-color: rgb(91 69 175 / .16) !important;
  background: linear-gradient(180deg, #fff, #f2f5ff) !important;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .96), 0 9px 20px rgb(70 82 118 / .11) !important;
}

html[data-theme="light"] .px-fav-card__favorite-action.is-saved {
  color: #fff !important;
  border-color: transparent !important;
  background: var(--px-accent-gradient) !important;
}

/* --------------------------------------------------------------------------
   Library archive — exact action placement and state language
   -------------------------------------------------------------------------- */
.px-library-modern-card__actions {
  direction: ltr !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 40px !important;
  align-items: stretch !important;
  gap: 5px !important;
}

.px-library-modern-card__actions > a {
  grid-column: 1 !important;
  grid-row: 1 !important;
  direction: rtl;
  color: #fff !important;
  border-color: transparent !important;
  background: var(--px-accent-gradient) !important;
  box-shadow: 0 10px 22px rgb(84 76 220 / .22), inset 0 1px 0 rgb(255 255 255 / .16) !important;
}

html[data-ui-lang="en"] .px-library-modern-card__actions > a {
  direction: ltr;
}

.px-library-modern-card__actions > a:hover,
.px-library-modern-card__actions > a:focus-visible {
  color: #fff !important;
  filter: brightness(1.06);
  transform: translateY(-1px);
}

.px-library-modern-card__favorite-action {
  position: relative !important;
  inset: auto !important;
  grid-column: 2 !important;
  grid-row: 1 !important;
  width: 40px !important;
  min-width: 40px !important;
  max-width: 40px !important;
  min-height: 40px !important;
  height: 40px !important;
  padding: 0 !important;
  border: 1px solid rgb(255 255 255 / .18) !important;
  border-radius: 12px !important;
  display: inline-grid !important;
  place-items: center !important;
  color: #fff !important;
  background: linear-gradient(180deg, rgb(255 255 255 / .13), rgb(255 255 255 / .07)) !important;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .15), 0 8px 20px rgb(4 8 20 / .16) !important;
  -webkit-backdrop-filter: blur(12px) saturate(135%) !important;
  backdrop-filter: blur(12px) saturate(135%) !important;
  cursor: pointer;
}

.px-library-modern-card__favorite-action.is-saved {
  color: #fff !important;
  border-color: transparent !important;
  background: var(--px-accent-gradient) !important;
  box-shadow: 0 9px 22px rgb(124 58 237 / .28), inset 0 1px 0 rgb(255 255 255 / .18) !important;
}

.px-library-modern-card__favorite-action .px-icon,
.px-library-modern-card__favorite-action svg {
  width: 18px !important;
  height: 18px !important;
}

html[data-theme="light"] .px-library-modern-card__favorite-action {
  color: #6451cf !important;
  border-color: rgb(91 69 175 / .16) !important;
  background: linear-gradient(180deg, #fff, #f2f5ff) !important;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .96), 0 9px 20px rgb(70 82 118 / .11) !important;
}

html[data-theme="light"] .px-library-modern-card__favorite-action.is-saved {
  color: #fff !important;
  border-color: transparent !important;
  background: var(--px-accent-gradient) !important;
}

/* --------------------------------------------------------------------------
   Active Favorites navigation — visible white heart in every theme
   -------------------------------------------------------------------------- */
.px-unified-floating-dock > a.px-favorites-counter.is-active,
.px-unified-floating-dock > a.px-favorites-counter.is-active .px-icon,
.px-mobile-nav > a.is-active[data-favorites-link],
.px-mobile-nav > a.is-active[data-favorites-link] .px-icon,
.px-mobile-nav > a.is-active[data-favorites-link] .px-mobile-nav__icon,
html[data-theme="light"] .px-unified-floating-dock > a.px-favorites-counter.is-active,
html[data-theme="light"] .px-unified-floating-dock > a.px-favorites-counter.is-active .px-icon,
html[data-theme="light"] .px-mobile-nav > a.is-active[data-favorites-link],
html[data-theme="light"] .px-mobile-nav > a.is-active[data-favorites-link] .px-icon {
  color: #fff !important;
  stroke: #fff !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Tablet/touch browse routes cannot depend on hover. This owner starts at
 * 761px; the phone homepage has a separate quiet-feed owner and must never
 * receive this action panel, even when the runtime device class is absent. */
@media (min-width: 761px) and (max-width: 1049px), (min-width: 761px) and (hover: none), (min-width: 761px) and (pointer: coarse) {
  html:not(.px-phone-ui) .px-prompt-card .px-card-actions,
  html:not(.px-phone-ui) body.home .px-browse--home-concept .px-prompt-card .px-card-actions {
    display: grid !important;
    inset: auto 7px 7px !important;
    min-height: 44px !important;
    padding: 4px !important;
    grid-template-columns: minmax(0, 1fr) 34px !important;
    gap: 4px !important;
    border-radius: 13px !important;
    opacity: 1 !important;
    transform: none !important;
    pointer-events: auto !important;
  }

  html:not(.px-phone-ui) .px-prompt-card .px-card-favorite-action {
    width: 34px !important;
    min-width: 34px !important;
    max-width: 34px !important;
    height: 36px !important;
    min-height: 36px !important;
    border-radius: 10px !important;
  }

  html:not(.px-phone-ui) .px-prompt-card .px-card-view {
    display: inline-flex !important;
    height: 36px !important;
    min-height: 36px !important;
    border-radius: 10px !important;
    padding-inline: 6px !important;
  }

  html:not(.px-phone-ui) .px-prompt-card .px-card-view__label { font-size: 9.5px !important; }

  html:not(.px-phone-ui) .px-prompt-card .px-duration,
  html:not(.px-phone-ui) body.home .px-browse--home-concept .px-prompt-card .px-duration { bottom: 58px !important; }

  html:not(.px-phone-ui) .px-fav-card__actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 36px !important;
    opacity: 1 !important;
    transform: none !important;
    pointer-events: auto !important;
  }

  html:not(.px-phone-ui) .px-fav-card__favorite-action,
  html:not(.px-phone-ui) .px-library-modern-card__favorite-action {
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    border-radius: 11px !important;
  }

  html:not(.px-phone-ui) .px-fav-card--library .px-fav-card__title,
  html:not(.px-phone-ui) .px-fav-card__duration { bottom: 64px !important; }

  html:not(.px-phone-ui) .px-library-modern-card__actions { grid-template-columns: minmax(0, 1fr) 36px !important; }
}