/* TV PLAY V1.64 — configurador más legible y resumen comercial refinado.
   Solo presentación dentro de #planes; no altera precio, cálculo ni WhatsApp. */

/* Izquierda: jerarquía tipográfica y controles más cómodos */
#planes .selector-zone {
  padding: 38px 42px 36px;
}
#planes .selector-caption {
  display: inline-block;
  color: #69d9f5;
  font-size: 13px;
  font-weight: 850;
  letter-spacing: 1.7px;
  line-height: 1.35;
}
#planes .selector-heading h3 {
  color: #f7fbff;
  font-size: 24px;
  font-weight: 790;
  letter-spacing: -.045em;
  line-height: 1.23;
  margin-top: 9px;
}
#planes .selector-heading.second-selector,
#planes .selector-heading.third-selector {
  margin-top: 30px;
}
#planes #planCountry {
  display: block;
  width: 100%;
  height: 59px;
  min-height: 59px;
  margin-top: 15px;
  padding: 14px 46px 14px 20px;
  border-radius: 13px;
  border-color: #41638b;
  font-size: 18px;
  font-weight: 650;
  line-height: 1.25;
}
#planes #planCountry option {
  font-size: 17px;
}
#planes .option-row,
#planes .duration-row {
  margin-top: 15px;
  gap: 11px;
}
#planes .option-button {
  height: 58px;
  min-height: 58px;
  border-radius: 12px;
  font-size: 23px;
  font-weight: 850;
}
#planes .duration-button {
  height: 56px;
  min-height: 56px;
  border-radius: 12px;
  font-size: 16px;
  line-height: 1.15;
  font-weight: 760;
  padding: 11px 6px;
}
#planes #selectorFootnote {
  margin-top: 17px;
  margin-bottom: 0;
  color: #a9c1de;
  font-size: 13px;
  line-height: 1.58;
  max-width: 100%;
}

/* Derecha: marca pequeña arriba; selección con dos etiquetas claras */
#planes .plan-summary-premium {
  padding: 30px 36px 29px;
}
#planes .summary-premium-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 38px;
  gap: 12px;
}
#planes .summary-premium-top .summary-mini {
  color: #85e3ff;
  font-size: 11.5px;
  font-weight: 840;
  letter-spacing: 1.25px;
  line-height: 1.35;
}
#planes .summary-corner-logo {
  display: grid;
  flex: 0 0 41px;
  place-items: center;
  width: 41px;
  height: 41px;
  background: transparent;
  border: 0;
  border-radius: 0;
}
#planes .summary-corner-logo img {
  display: block;
  height: 39px;
  width: 39px;
  object-fit: contain;
  filter: drop-shadow(0 4px 7px rgba(24,105,225,.18));
}
#planes .plan-summary-premium .summary-plan-hero {
  display: block;
  margin: 23px 0 24px;
  gap: 0;
}
#planes .plan-summary-premium .summary-plan-identification {
  min-width: 0;
  width: 100%;
}
#planes .plan-summary-premium .summary-plan-identification .summary-title {
  display: block;
  margin: 0;
  font-size: 37px;
  font-weight: 870;
  letter-spacing: -.052em;
  line-height: 1.1;
  color: #fcfdff;
}
#planes .plan-summary-premium .summary-inline-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 9px;
  margin-top: 16px;
  line-height: 1.35;
  font-size: 13.5px;
  color: #dcecff;
  overflow-wrap: normal;
}
#planes .summary-inline-meta .summary-duration-pill,
#planes .summary-inline-meta .summary-locale-group {
  display: inline-flex;
  align-items: center;
  flex: 0 1 auto;
  width: max-content;
  max-width: 100%;
  min-height: 35px;
  margin: 0;
  padding: 7px 11px;
  border: 1px solid rgba(112,167,221,.27);
  border-radius: 10px;
  background: rgba(9,34,64,.44);
  white-space: nowrap;
  font-weight: 670;
  line-height: 1.25;
  color: #daeaff;
  vertical-align: middle;
  box-shadow: inset 0 1px 0 rgba(200,234,255,.025);
}
#planes .summary-inline-meta .summary-duration-pill {
  gap: 8px;
}
#planes .summary-inline-meta .summary-duration-pill svg {
  display: block;
  flex: none;
  width: 16px;
  height: 16px;
  color: #8bd7fd;
}
#planes .summary-inline-meta .summary-locale-group {
  gap: 5px;
}
#planes .summary-inline-meta .summary-country-with-flag {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  color: #edf6ff;
  min-width: 0;
}
#planes .summary-inline-meta .summary-meta-sep,
#planes .summary-inline-meta .summary-locale-group > .summary-meta-sep {
  display: inline;
  margin: 0;
  padding: 0 1px;
  color: #6e99c6;
  font-weight: 650;
}
#planes .summary-inline-meta #summaryCurrency {
  font-size: 12.5px;
  font-weight: 760;
  color: #9bcaed;
}
#planes .summary-inline-meta.summary-long-country .summary-locale-group {
  display: inline-flex;
  margin-top: 0;
}
#planes .summary-inline-meta .summary-country-flag {
  display: block;
  width: 21px;
  height: 15.75px;
  border-radius: 3px;
  object-fit: cover;
}
#planes .summary-inline-meta .summary-country-globe {
  display: block;
  width: 17px;
  height: 17px;
}
#planes .summary-inline-meta .summary-country-flag[hidden],
#planes .summary-inline-meta .summary-country-globe[hidden] {
  display: none !important;
}
#planes .plan-summary-premium .summary-price-card {
  margin-top: 0;
  border-radius: 16px;
  padding: 22px 21px 23px;
}
#planes .summary-price-topline #summaryPriceLabel {
  font-size: 11.5px;
  letter-spacing: 1px;
}
#planes .plan-summary-premium #summaryPrice {
  margin-top: 15px;
  margin-bottom: 3px;
  font-size: clamp(39px,3.6vw,51px);
}
#planes .plan-summary-premium #summaryPrice.summary-price-compact {
  font-size: clamp(30px,3vw,39px);
}
#planes .plan-summary-premium #summaryPrice.summary-price-long {
  font-size: clamp(25px,2.6vw,34px);
}
#planes .plan-summary-premium .plan-comparison {
  margin-top: 12px;
}
#planes .plan-summary-premium .summary-payment-note {
  margin-top: 19px;
  gap: 11px;
}
#planes .summary-payment-note #priceInfo {
  font-size: 12.5px !important;
  line-height: 1.55 !important;
  color: #c1d5eb !important;
}
#planes .plan-summary-premium button.summary-primary-cta {
  min-height: 57px;
  margin-top: 22px;
  font-size: 15.5px;
}
#planes .summary-footer-notes {
  font-size: 11px;
  margin-top: 13px;
}

/* Pantallas medianas: dos columnas, controles sin desbordes */
@media (min-width:861px) and (max-width:1060px) {
  #planes .selector-zone {padding: 31px 29px 30px;}
  #planes .selector-caption {font-size:12px;}
  #planes .selector-heading h3 {font-size:22px;}
  #planes .selector-heading.second-selector,
  #planes .selector-heading.third-selector {margin-top:26px;}
  #planes #planCountry {height:55px;min-height:55px;font-size:17px;}
  #planes .option-row,#planes .duration-row {gap:8px;margin-top:13px;}
  #planes .option-button {height:53px;min-height:53px;font-size:21px;}
  #planes .duration-button {height:52px;min-height:52px;font-size:14.5px;}
  #planes .plan-summary-premium {padding:27px 25px 25px;}
  #planes .plan-summary-premium .summary-plan-identification .summary-title {font-size:34px;}
  #planes .plan-summary-premium .summary-inline-meta {font-size:12.5px;gap:7px;}
  #planes .summary-inline-meta .summary-duration-pill,
  #planes .summary-inline-meta .summary-locale-group {padding:7px 9px;}
}

/* Tablet: una columna */
@media (max-width:860px) {
  #planes .selector-zone {padding: 34px 34px 35px;}
  #planes .selector-caption {font-size:13px;}
  #planes .selector-heading h3 {font-size:24px;}
  #planes #planCountry {font-size:18px;}
  #planes .option-button {font-size:23px;}
  #planes .duration-button {font-size:16px;}
  #planes .plan-summary-premium {padding:31px 34px 30px;}
  #planes .plan-summary-premium .summary-plan-identification .summary-title {font-size:37px;}
  #planes .plan-summary-premium .summary-inline-meta {font-size:14px;}
}
@media (max-width:600px) {
  #planes .selector-zone {padding:28px 21px 29px;}
  #planes .selector-caption {font-size:12px;letter-spacing:1.45px;}
  #planes .selector-heading h3 {font-size:21px;line-height:1.25;margin-top:8px;}
  #planes .selector-heading.second-selector,
  #planes .selector-heading.third-selector {margin-top:26px;}
  #planes #planCountry {font-size:17px;height:55px;min-height:55px;margin-top:13px;padding-left:16px;}
  #planes #planCountry option {font-size:16px;}
  #planes .option-row,#planes .duration-row {margin-top:13px;gap:7px;}
  #planes .option-button {min-height:52px;height:52px;font-size:21px;border-radius:10px;}
  #planes .duration-button {min-height:51px;height:51px;font-size:15px;border-radius:10px;}
  #planes #selectorFootnote {font-size:12px;margin-top:15px;}
  #planes .plan-summary-premium {padding:25px 22px 25px;}
  #planes .summary-premium-top .summary-mini {font-size:10.5px;}
  #planes .summary-corner-logo,#planes .summary-corner-logo img {width:34px;height:34px;}
  #planes .summary-corner-logo {flex-basis:34px;}
  #planes .plan-summary-premium .summary-plan-hero {margin:18px 0 20px;}
  #planes .plan-summary-premium .summary-plan-identification .summary-title {font-size:32px;}
  #planes .plan-summary-premium .summary-inline-meta {gap:8px;margin-top:13px;font-size:12.5px;}
  #planes .summary-inline-meta .summary-duration-pill,
  #planes .summary-inline-meta .summary-locale-group {min-height:34px;padding:7px 9px;border-radius:9px;}
  #planes .summary-inline-meta .summary-country-with-flag {gap:5px;}
  #planes .summary-inline-meta #summaryCurrency {font-size:11.5px;}
  #planes .summary-inline-meta .summary-country-flag {width:18px;height:13.5px;}
  #planes .plan-summary-premium .summary-price-card {padding:19px 17px 20px;}
  #planes .plan-summary-premium #summaryPrice {font-size:42px;}
  #planes .plan-summary-premium #summaryPrice.summary-price-compact {font-size:34px;}
  #planes .plan-summary-premium #summaryPrice.summary-price-long {font-size:28px;}
  #planes .summary-payment-note #priceInfo {font-size:12px !important;}
  #planes .plan-summary-premium button.summary-primary-cta {font-size:14px;min-height:53px;}
  #planes .summary-footer-notes {font-size:10px;}
}
@media (max-width:365px) {
  #planes .selector-zone {padding-inline:18px;}
  #planes .selector-heading h3 {font-size:20px;}
  #planes .option-button {font-size:20px;}
  #planes .duration-button {font-size:14px;}
  #planes .plan-summary-premium {padding-inline:18px;}
  #planes .summary-inline-meta .summary-locale-group {padding:6px 7px;font-size:12px;}
  #planes .summary-inline-meta .summary-locale-group > .summary-meta-sep {padding:0;}
  #planes .summary-inline-meta .summary-country-flag {width:17px;height:12.75px;}
}
