/* TV PLAY V1.125 — refinamiento visual de Revendedores con tarjetas.
   Solo #revendedores; no cambia precios, lógica ni otros apartados. */

/* 1. Más legibilidad sin aumentar el tamaño de las tarjetas. */
#revendedores .reseller-card-head h3{
  font-size:clamp(18px,1.43vw,20px);
  line-height:1.16;
  font-weight:850;
  letter-spacing:-.4px;
}
#revendedores .reseller-card-subtitle{
  font-size:12.2px;
  font-weight:670;
  line-height:1.37;
  color:#afd7ec;
}
#revendedores .reseller-card-includes div{
  font-size:12.35px;
  line-height:1.38;
  font-weight:575;
  gap:6px;
}
#revendedores .reseller-card-includes svg{
  width:15px;
  height:15px;
  flex:0 0 15px;
  margin-top:1px;
}
#revendedores .reseller-price-caption{
  font-size:10.8px;
  letter-spacing:.52px;
}
#revendedores .reseller-card-price{
  font-variant-numeric:tabular-nums;
}

/* 2. CTA individual y visible en cada tarjeta. */
#revendedores .reseller-card-cta{
  min-height:42px;
  gap:7px;
  font-size:12.6px;
  font-weight:825;
  letter-spacing:-.1px;
  padding:9px 7px;
  border-radius:10px;
}
#revendedores .reseller-card-cta-text{
  display:inline-block;
  white-space:nowrap;
}
#revendedores .reseller-card-cta>span[aria-hidden]{
  display:inline-block;
  flex:0 0 auto;
  line-height:1;
}

/* 3. Flechas laterales compactas con chevron vectorial perfectamente centrado. */
#revendedores .reseller-cards-stage .reseller-edge-arrow{
  display:grid;
  place-items:center;
  width:35px;
  height:46px;
  padding:0;
  border-radius:12px;
  border:1px solid #6297bc;
  background:linear-gradient(145deg,#214b71,#153654);
  color:#ebfaff;
}
#revendedores .reseller-cards-stage .reseller-edge-arrow svg{
  display:block;
  width:21px;
  height:21px;
  pointer-events:none;
}
#revendedores .reseller-cards-stage .reseller-edge-arrow:hover:not(:disabled){
  background:linear-gradient(145deg,#28628b,#1a4568);
  border-color:#79deeb;
}
#revendedores .reseller-cards-stage .reseller-edge-arrow:disabled{
  opacity:.29;
  background:#12263c;
  border-color:#375472;
  box-shadow:none;
}
#revendedores .reseller-cards-stage .reseller-edge-arrow:focus-visible{
  outline:3px solid #7ce6f1;
  outline-offset:3px;
}

/* 4. Los dos distintivos mantienen los colores corporativos con un acabado fino. */
#revendedores .reseller-price-card.is-recommended .reseller-card-tag{
  border:1px solid rgba(135,225,243,.36);
  background:linear-gradient(125deg,#2e87ae,#236f97);
  color:#fff;
  box-shadow:0 5px 12px rgba(12,91,159,.18);
}
#revendedores .reseller-price-card.is-premium .reseller-card-tag{
  border:1px solid rgba(122,179,234,.35);
  background:linear-gradient(125deg,#245a8d,#1c4776);
  color:#e8f6ff;
}
#revendedores .reseller-card-tag{
  border-radius:7px;
  font-size:9.3px;
  letter-spacing:.53px;
  font-weight:860;
  padding:4px 7px;
}

/* 5. Pie visual equilibrado: la explicación es una acción compacta,
   la aclaración de precios y el enlace quedan a la derecha. */
@media(min-width:980px){
  #revendedores .reseller-credits-trigger{
    width:100%;
    max-width:455px;
    min-height:42px;
    padding:10px 14px;
    justify-self:start;
    align-self:center;
  }
  #revendedores .reseller-pricing-note{
    width:100%;
    max-width:445px;
    justify-self:end;
    align-self:center;
    font-size:11.7px;
    line-height:1.55;
  }
  #revendedores .reseller-pricing-note p{
    line-height:1.5;
  }
  #revendedores .reseller-pricing-note a{
    font-size:11.8px;
    line-height:1.5;
  }
  #revendedores .reseller-price-card{
    padding-inline:12px;
  }
  #revendedores .reseller-card-includes{
    gap:5px;
    margin-bottom:7px;
  }
  #revendedores .reseller-card-head{
    margin-bottom:5px;
  }
  #revendedores .reseller-card-cta{
    min-height:42px;
  }
}
@media(min-width:980px) and (max-width:1279px){
  #revendedores .reseller-credits-trigger{max-width:395px;}
  #revendedores .reseller-pricing-note{max-width:395px;}
  #revendedores .reseller-cards-stage .reseller-edge-arrow{
    width:32px;
    height:44px;
    border-radius:11px;
  }
  #revendedores .reseller-cards-stage .reseller-edge-arrow svg{
    width:19px;
    height:19px;
  }
}
@media(min-width:980px) and (max-height:690px){
  #revendedores .reseller-card-includes div{
    font-size:11.9px;
    line-height:1.3;
  }
  #revendedores .reseller-card-head h3{font-size:17.6px;}
  #revendedores .reseller-card-cta{min-height:39px;padding-block:7px;}
  #revendedores .reseller-credits-trigger{min-height:39px;padding-block:8px;}
}

/* Flechas siempre visibles en móvil, sin quitar espacio útil al carrusel. */
@media(max-width:979px){
  #revendedores .reseller-card-head h3{font-size:18.8px;}
  #revendedores .reseller-card-subtitle{font-size:12.2px;}
  #revendedores .reseller-card-includes div{font-size:12.25px;}
  #revendedores .reseller-card-cta{
    min-height:44px;
    font-size:12.4px;
  }
  #revendedores .reseller-credits-trigger{
    width:100%;
    max-width:none;
  }
  #revendedores .reseller-cards-stage .reseller-edge-arrow{
    width:31px;
    height:43px;
    border-radius:10px;
  }
  #revendedores .reseller-cards-stage .reseller-edge-arrow svg{
    width:19px;
    height:19px;
  }
}
@media(max-width:370px){
  #revendedores .reseller-cards-stage .reseller-edge-arrow{
    width:27px;
    height:41px;
    border-radius:9px;
  }
  #revendedores .reseller-cards-stage .reseller-edge-arrow svg{
    width:18px;
    height:18px;
  }
  #revendedores .reseller-card-cta{font-size:12px;}
}
@media(prefers-reduced-motion:reduce){
  #revendedores .reseller-cards-stage .reseller-edge-arrow{
    transition:none;
  }
}
