/* Invitation de vote post-visionnage dans les cartes vidéo.
   Le composant reste dans le flux, sous les métadonnées : aucune partie de
   la vignette n'est masquée. Les classes KVS rate-like / rate-dislike et
   leurs data-* restent inchangées. */
html .thumb.vxg-thumb-card .vxg-card-vote-prompt{
  position:static!important;
  inset:auto!important;
  z-index:auto!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:3px!important;
  width:max-content!important;
  max-width:100%;
  height:36px!important;
  min-height:36px;
  margin:8px 0 0 auto!important;
  padding:3px 4px 3px 11px!important;
  overflow:hidden;
  border:1px solid color-mix(in oklab,var(--border) 78%,transparent)!important;
  border-radius:999px!important;
  background:color-mix(in oklab,var(--surface) 88%,transparent)!important;
  color:var(--muted-foreground);
  box-shadow:none!important;
  opacity:.82;
  transition:opacity .18s ease,border-color .18s ease,background .18s ease,transform .18s ease;
}

html .thumb.vxg-thumb-card .vxg-card-vote-label{
  flex:0 1 auto;
  min-width:0;
  margin-right:2px;
  overflow:hidden;
  color:inherit;
  font:700 11px/1 Inter,ui-sans-serif,sans-serif;
  text-overflow:ellipsis;
  white-space:nowrap;
}

html .thumb.vxg-thumb-card .vxg-card-vote-prompt .btn{
  position:static!important;
  display:inline-grid!important;
  place-items:center;
  flex:0 0 28px;
  width:28px!important;
  min-width:28px!important;
  height:28px!important;
  min-height:28px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:999px!important;
  background:transparent!important;
  color:var(--muted-foreground)!important;
  box-shadow:none!important;
  opacity:.72;
  touch-action:manipulation;
  transition:color .15s ease,background .15s ease,opacity .15s ease,transform .15s ease;
}

html .thumb.vxg-thumb-card .vxg-card-vote-prompt .btn i{
  display:grid!important;
  place-items:center;
  width:100%;
  height:100%;
  margin:0!important;
  padding:0!important;
}

html .thumb.vxg-thumb-card .vxg-card-vote-prompt .btn svg{
  width:16px!important;
  height:16px!important;
  padding:0!important;
  fill:currentColor!important;
}

html .thumb.vxg-thumb-card .vxg-card-vote-prompt .rate-like:hover,
html .thumb.vxg-thumb-card .vxg-card-vote-prompt .rate-like:focus-visible{
  background:color-mix(in oklab,var(--primary) 14%,transparent)!important;
  color:var(--primary-glow)!important;
}

html .thumb.vxg-thumb-card .vxg-card-vote-prompt .rate-dislike:hover,
html .thumb.vxg-thumb-card .vxg-card-vote-prompt .rate-dislike:focus-visible{
  background:oklch(1 0 0/.07)!important;
  color:var(--foreground)!important;
}

html .thumb.vxg-thumb-card .vxg-card-vote-prompt .btn:focus-visible{
  outline:2px solid var(--primary-glow)!important;
  outline-offset:1px;
}

html .thumb.vxg-thumb-card .vxg-card-vote-prompt.is-voting{
  pointer-events:none;
  opacity:.58;
}

html .thumb.vxg-thumb-card .vxg-card-vote-prompt.is-done{
  border-color:color-mix(in oklab,var(--success) 38%,var(--border))!important;
  color:var(--foreground);
  opacity:1;
}

html .thumb.vxg-thumb-card .vxg-card-vote-prompt.is-done .btn{display:none!important}

@media (hover:hover) and (pointer:fine){
  html .thumb.vxg-thumb-card .vxg-card-vote-prompt .btn{
    opacity:.52;
    transform:scale(.94);
  }
  html .thumb.vxg-thumb-card:hover .vxg-card-vote-prompt,
  html .thumb.vxg-thumb-card .vxg-card-vote-prompt:focus-within{
    border-color:color-mix(in oklab,var(--foreground) 18%,var(--border))!important;
    background:var(--surface)!important;
    opacity:1;
  }
  html .thumb.vxg-thumb-card:hover .vxg-card-vote-prompt .btn,
  html .thumb.vxg-thumb-card .vxg-card-vote-prompt:focus-within .btn{
    opacity:1;
    transform:none;
  }
}

@media (max-width:767px), (hover:none) and (pointer:coarse){
  html .thumb.vxg-thumb-card .vxg-card-vote-prompt{
    gap:0!important;
    height:44px!important;
    min-height:44px;
    margin:8px 0 0!important;
    padding:2px 2px 2px 8px!important;
    opacity:1;
  }
  html .thumb.vxg-thumb-card .vxg-card-vote-label{margin-right:0;font-size:10.5px}
  html .thumb.vxg-thumb-card .vxg-card-vote-prompt .btn{
    flex-basis:40px;
    width:40px!important;
    min-width:40px!important;
    height:40px!important;
    min-height:40px!important;
    opacity:1;
  }
}

@media (prefers-reduced-motion:reduce){
  html .thumb.vxg-thumb-card .vxg-card-vote-prompt,
  html .thumb.vxg-thumb-card .vxg-card-vote-prompt .btn{transition:none!important}
}