/* Each provider is one native link, including its logo, status and schedule. */
.voting-content .page-heading .vote-reward {
  position: relative;
  isolation: isolate;
  color: #fff;
  text-shadow: 0 0 14px #b7eaff4d, 0 0 28px #53c8ed2e;
}

.voting-content .page-heading .vote-reward::before {
  content: "";
  position: absolute;
  inset: -.12em -.25em;
  z-index: -1;
  border-radius: 50%;
  background: #53c8ed1a;
  filter: blur(9px);
  pointer-events: none;
}

.voting-layout #vote-providers .vote-card {
  --vote-face: linear-gradient(125deg, #735723, #554524);
  --vote-accent: #f4cf86;
  --vote-glow: #c99b3855;
  --vote-cta-face: #f3bd35;
  --vote-cta-ink: #342607;
  display: flex;
  grid-template-columns: none;
  grid-template-areas: none;
  gap: 0;
  align-items: stretch;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
  overflow: visible;
}

.voting-layout #vote-providers [data-vote-provider="minecraft-mp"] {
  --vote-face: linear-gradient(125deg, #853660, #532b4a);
  --vote-accent: #ffbddd;
  --vote-glow: #ed69b155;
  --vote-cta-face: #ef73b9;
  --vote-cta-ink: #39102a;
}

.voting-layout #vote-providers [data-vote-provider="minecraftservers"] {
  --vote-face: linear-gradient(125deg, #195f8d, #203e68);
  --vote-accent: #a5dcff;
  --vote-glow: #49b5f455;
  --vote-cta-face: #35b8f3;
  --vote-cta-ink: #07364f;
}

.voting-layout #vote-providers [data-vote-provider="topminecraftservers"] {
  --vote-face: linear-gradient(125deg, #884725, #613722);
  --vote-accent: #ffcca4;
  --vote-glow: #ed944955;
  --vote-cta-face: #f68c36;
  --vote-cta-ink: #3d1e07;
}

.voting-layout #vote-providers [data-vote-provider="topg"] {
  --vote-face: linear-gradient(125deg, #246e55, #244b3d);
  --vote-accent: #a4f1cb;
  --vote-glow: #59d69b55;
  --vote-cta-face: #2ed99c;
  --vote-cta-ink: #083329;
}

.voting-layout #vote-providers .vote-card > .vote-card-link {
  position: relative;
  isolation: isolate;
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  min-width: 0;
  min-height: 100%;
  width: 100%;
  margin: 0;
  padding: 20px 24px;
  border: 1px solid color-mix(in srgb, var(--vote-accent) 35%, transparent);
  border-radius: 12px;
  background: var(--vote-face);
  color: #fff8f0;
  box-shadow: 0 8px 24px #0002, 0 0 26px transparent;
  text-decoration: none;
  cursor: pointer;
  transition: transform 280ms ease, border-color 280ms ease, box-shadow 280ms ease;
}

.voting-layout #vote-providers .vote-card-link::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  background: var(--vote-face);
  filter: saturate(1.6);
  opacity: 0;
  pointer-events: none;
  transition: opacity 280ms ease;
}

.voting-layout #vote-providers .vote-card-link:not([aria-disabled="true"]):focus-visible {
  outline: 3px solid var(--vote-accent);
  outline-offset: 4px;
  border-color: var(--vote-accent);
}

@media (hover: hover) {
  .voting-layout #vote-providers .vote-card:hover > .vote-card-link:not([aria-disabled="true"]) {
    transform: scale(1.018);
    border-color: var(--vote-accent);
    box-shadow: 0 14px 42px var(--vote-glow), 0 0 26px color-mix(in srgb, var(--vote-accent) 14%, transparent);
  }
  .voting-layout #vote-providers .vote-card:hover > .vote-card-link:not([aria-disabled="true"])::before {
    opacity: 1;
  }
  .voting-layout #vote-providers .vote-card:hover > .vote-card-link:not([aria-disabled="true"]) .vote-index,
  .voting-layout #vote-providers .vote-card:hover > .vote-card-link:not([aria-disabled="true"]) .provider-domain,
  .voting-layout #vote-providers .vote-card:hover > .vote-card-link:not([aria-disabled="true"]) .vote-frequency,
  .voting-layout #vote-providers .vote-card:hover > .vote-card-link:not([aria-disabled="true"]) .vote-frequency > small {
    color: #fff8f0;
  }
}

.voting-layout #vote-providers .vote-card-link:not([aria-disabled="true"]):active {
  transform: scale(1);
}

.voting-layout #vote-providers .vote-index {
  margin: 0 0 8px;
  color: var(--vote-accent);
  transition: color 280ms ease;
}

.voting-layout #vote-providers .provider-identity {
  margin: 0 0 16px;
}

.voting-layout #vote-providers .provider-domain {
  color: #f8eee2d9;
  transition: color 280ms ease;
}

.voting-layout #vote-providers .vote-action {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  margin-top: auto;
}

.voting-layout #vote-providers .vote-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  min-height: 48px;
  width: fit-content;
  max-width: 100%;
  margin: 0;
  padding: 12px 16px;
  border: 1px solid color-mix(in srgb, var(--vote-cta-face) 65%, white);
  border-radius: 14px;
  background: var(--vote-cta-face);
  color: var(--vote-cta-ink);
  font-family: 'Poppins', Arial, sans-serif;
  font-size: 1rem;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.35;
  text-transform: uppercase;
  box-shadow: 0 3px 10px #00000012;
}

.voting-layout #vote-providers .vote-frequency,
.voting-layout #vote-providers .vote-frequency > small {
  color: #fff3e3e6;
  transition: color 280ms ease;
}

.voting-layout #vote-providers .vote-frequency > .icon {
  color: var(--vote-accent);
}

.voting-layout #vote-providers .vote-player-state {
  color: #f5ece2d9;
}

.voting-layout #vote-providers .vote-player-state[data-vote-state="available"] {
  color: #cdffde;
}

.voting-layout #vote-providers .vote-player-state[data-vote-state="cooldown"] {
  color: #ffdf9a;
}

.voting-layout #vote-providers .vote-card:first-child > .vote-card-link {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-areas: "index actions" "provider actions";
  align-items: center;
  gap: 8px 24px;
  min-height: 188px;
  padding-top: 44px;
}

.voting-layout #vote-providers .vote-card:first-child .vote-index {
  grid-area: index;
  margin: 0;
}

.voting-layout #vote-providers .vote-card:first-child .provider-identity {
  grid-area: provider;
  margin: 0;
}

.voting-layout #vote-providers .vote-card:first-child .vote-action {
  grid-area: actions;
  justify-self: start;
  align-self: center;
  width: 240px;
  max-width: 100%;
  margin: 0;
}

.voting-layout #vote-providers .vote-card:first-child .vote-frequency {
  grid-area: auto;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  gap: 3px;
  width: 100%;
  align-items: center;
  justify-content: center;
  text-align: center;
  margin: 10px 0 0;
}

.voting-layout #vote-providers .vote-card:first-child .vote-frequency-main {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.voting-layout #vote-providers .vote-frequency-main > .icon {
  width: 16px;
  height: 16px;
  color: var(--vote-accent);
}

.voting-layout #vote-providers .vote-card:first-child .vote-frequency > small {
  display: block;
  max-width: 100%;
  align-self: center;
  flex-basis: auto;
  text-align: center;
}

.voting-layout #vote-providers .vote-card:first-child .vote-player-state {
  grid-area: auto;
  margin: 8px 0 0;
  text-align: center;
}

.voting-layout #vote-providers .vote-pending {
  align-self: center;
  width: auto;
  min-height: 48px;
  margin: 0;
  padding: 12px 22px;
  border-radius: 9px;
  background: #080a0e26;
  color: #fff3e3;
  text-align: center;
}

.voting-layout #vote-providers .vote-card-link[aria-disabled="true"] {
  cursor: default;
  transform: none;
  box-shadow: 0 8px 24px #0002;
}

/* Quiet highlights sit behind content and never intercept the full-card link. */
.voting-layout #vote-providers .vote-sparkles {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}

.voting-layout #vote-providers .vote-sparkles > span {
  --star-peak: .65;
  position: absolute;
  width: 13px;
  height: 13px;
  background: #ffe5a6;
  clip-path: polygon(50% 0, 61% 39%, 100% 50%, 61% 61%, 50% 100%, 39% 61%, 0 50%, 39% 39%);
  opacity: 0;
  animation: vote-star-glimmer 3.6s ease-in-out infinite;
}

.voting-layout #vote-providers .vote-sparkles > span:nth-child(1) {
  left: 34%;
  top: 12px;
  width: 16px;
  height: 16px;
  animation-delay: -.9s;
}

.voting-layout #vote-providers .vote-sparkles > span:nth-child(2) {
  left: 53%;
  top: 38%;
  width: 10px;
  height: 10px;
  animation-delay: -2.6s;
}

.voting-layout #vote-providers .vote-sparkles > span:nth-child(3) {
  --star-peak: .45;
  right: 5%;
  top: 52%;
  width: 9px;
  height: 9px;
  animation-delay: -.3s;
}

.voting-layout #vote-providers .vote-sparkles > span:nth-child(4) {
  left: 14%;
  bottom: 14px;
  animation-delay: -1.7s;
}

.voting-layout #vote-providers .vote-sparkles > span:nth-child(5) {
  --star-peak: .45;
  left: 56%;
  bottom: 12px;
  width: 8px;
  height: 8px;
  animation-delay: -3s;
}

.voting-layout #vote-providers .vote-top {
  position: absolute;
  top: 11px;
  right: 14px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 9px;
  border: 1px solid #ffe8a469;
  border-radius: 999px;
  background: #f3bd35;
  color: #342607;
  font-size: .625rem;
  font-weight: 800;
  line-height: 1.4;
  letter-spacing: .4px;
  pointer-events: none;
}

.voting-layout #vote-providers .vote-top > svg {
  width: 11px;
  height: 11px;
  fill: currentColor;
}

@keyframes vote-star-glimmer {
  0%, 100% { opacity: 0; }
  45%, 55% { opacity: var(--star-peak); }
}

@media (max-width: 1000px) {
  .voting-layout #vote-providers .vote-card > .vote-card-link {
    padding: 20px;
  }
  .voting-layout #vote-providers .vote-card:first-child > .vote-card-link {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 16px;
  }
}

@media (max-width: 540px) {
  .voting-layout #vote-providers .vote-card:first-child > .vote-card-link {
    display: flex;
    gap: 0;
    align-items: stretch;
  }
  .voting-layout #vote-providers .vote-card:first-child .vote-index {
    margin-bottom: 8px;
  }
  .voting-layout #vote-providers .vote-card:first-child .provider-identity {
    margin-bottom: 16px;
  }
  .voting-layout #vote-providers .vote-card:first-child .vote-action {
    align-self: center;
  }
  .voting-layout #vote-providers .vote-card:first-child .vote-frequency {
    justify-content: center;
    text-align: center;
    margin-top: 10px;
  }
  .voting-layout #vote-providers .vote-card:first-child .vote-frequency > small {
    flex-basis: auto;
  }
  .voting-layout #vote-providers .vote-card:first-child .vote-player-state {
    margin-top: 8px;
    text-align: center;
  }
}

@media (prefers-reduced-motion: reduce) {
  .voting-layout #vote-providers .vote-card-link,
  .voting-layout #vote-providers .vote-card:hover > .vote-card-link,
  .voting-layout #vote-providers .vote-card-link:is(:hover, :focus-visible, :active) {
    transform: none !important;
    transition: none;
  }
  .voting-layout #vote-providers .vote-card-link::before {
    transition: none;
  }
  .voting-layout #vote-providers .vote-index,
  .voting-layout #vote-providers .provider-domain,
  .voting-layout #vote-providers .vote-frequency,
  .voting-layout #vote-providers .vote-frequency > small {
    transition: none;
  }
  .voting-layout #vote-providers .vote-sparkles > span {
    animation: none;
    opacity: .24;
  }
}
