.player-portal-view {
  display: grid;
  gap: 20px;
  padding-bottom: 48px;
}

.player-portal-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 28px;
  align-items: end;
  padding: clamp(28px, 5vw, 54px) 0 12px;
}

.player-portal-hero h1 {
  margin: 4px 0 10px;
  max-width: 760px;
  font-size: clamp(2.1rem, 5vw, 4.8rem);
  line-height: .94;
  letter-spacing: -.055em;
}

.player-portal-hero > div > p:last-child {
  max-width: 680px;
  margin: 0;
  color: #5f6658;
  font-size: 1.02rem;
}

.player-portal-message {
  padding: 12px 15px;
  border: 1px solid #dfe4d7;
  border-radius: 12px;
  background: #fff;
}

.player-portal-message[data-type="success"] {
  border-color: #bcd6a9;
  background: #f3f9ed;
}

.player-portal-message[data-type="error"] {
  border-color: #e0b5ad;
  background: #fff3f0;
}

.player-auth-layout,
.player-dashboard-grid {
  display: grid;
  grid-template-columns:
    minmax(0, 1.35fr)
    minmax(280px, .65fr);
  gap: 16px;
  align-items: start;
}

/* Sin columna lateral: el acceso ocupa una sola columna de ancho cómodo. */
.player-auth-layout {
  grid-template-columns: minmax(0, 720px);
}

.player-auth-card {
  display: grid;
  gap: 18px;
}

.player-auth-switch {
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding: 4px;
  border: 1px solid #dfe4d7;
  border-radius: 13px;
  background: #eef1e9;
}

.player-auth-switch button {
  border: 0;
  border-radius: 9px;
  background: transparent;
}

.player-auth-switch button.active {
  background: #fff;
  box-shadow: 0 2px 8px rgba(25,31,21,.08);
}

/* Contraseña con botón para mostrar u ocultar. */
.player-password-field {
  position: relative;
  display: block;
}

.player-password-field input {
  padding-right: 52px;
}

.player-password-toggle {
  position: absolute;
  top: 50%;
  right: 6px;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  padding: 0;
  color: inherit;
  background: transparent;
  border: 0;
  border-radius: 10px;
  transform: translateY(-50%);
}

.player-password-toggle:hover:not(:disabled) {
  transform: translateY(-50%);
}

.player-password-toggle .player-eye-closed,
.player-password-toggle[aria-pressed="true"] .player-eye-open {
  display: none;
}

.player-password-toggle[aria-pressed="true"] .player-eye-closed {
  display: block;
}

.player-auth-switch[hidden],
.player-security-form[hidden],
.player-email-security[hidden] {
  display: none !important;
}

.player-auth-secondary-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 8px;
}

.player-link-button {
  padding: 4px 0;
  border: 0;
  background: transparent;
  color: #55614d;
  font: inherit;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}

.player-link-button:hover {
  color: #22271f;
}

.player-security-form:not([hidden]) {
  display: grid;
  gap: 18px;
}

.player-security-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.player-email-security:not([hidden]) {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-top: 10px;
  padding: 9px 11px;
  border: 1px solid #dfe4d7;
  border-radius: 11px;
  font-size: .86rem;
}

.player-email-security[data-status="pending"] {
  border-color: #e5d6a7;
  background: #fff9e8;
}

.player-email-security[data-status="verified"] {
  border-color: #bcd6a9;
  background: #f3f9ed;
}

.player-email-security span {
  font-weight: 700;
}

.player-dashboard {
  display: grid;
  gap: 16px;
}

.player-dashboard-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.player-dashboard-head h2 {
  margin: 3px 0;
}

.player-partner-mode {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 12px;
  border: 1px solid #dfe4d7;
  border-radius: 12px;
}

.player-partner-mode legend {
  padding: 0 5px;
  font-weight: 700;
}

.player-partner-mode label {
  display: flex;
  gap: 9px;
  align-items: center;
}

.player-category-info {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0 16px;
}

.player-category-info > div {
  display: grid;
  gap: 2px;
  min-width: 130px;
  padding: 10px 12px;
  border-radius: 11px;
  background: #f3f5ef;
}

.player-category-info span {
  color: #73796e;
  font-size: .74rem;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.player-registration-list {
  display: grid;
  gap: 10px;
}

.player-registration-item {
  display: grid;
  gap: 12px;
  padding: 15px;
  border: 1px solid #e0e4db;
  border-radius: 14px;
  background: #fff;
}

.player-registration-item header {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: start;
}

.player-registration-item header > div {
  display: grid;
  gap: 3px;
}

.player-registration-category {
  color: #687063;
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .07em;
}

.player-status {
  padding: 5px 8px;
  border-radius: 999px;
  background: #eef1e9;
  color: #52594d;
  font-size: .7rem;
  font-weight: 800;
}

.player-status-approved {
  background: #e7f5dc;
  color: #38522d;
}

.player-status-rejected,
.player-status-cancelled {
  background: #fae8e4;
  color: #7b392f;
}

.player-registration-meta {
  display: grid;
  gap: 8px;
  color: #636a5d;
  font-size: .88rem;
}

/* Compañero confirmado dentro de Mis inscripciones. */
.player-registration-partner {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 10px;
  align-items: baseline;
  padding: 10px 12px;
  border: 1px solid rgba(152, 217, 0, .35);
  border-radius: 12px;
  background: rgba(152, 217, 0, .1);
}

.player-registration-partner small {
  flex-basis: 100%;
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.player-registration-partner strong {
  font-size: 1rem;
}

.player-empty-state {
  display: grid;
  gap: 5px;
  padding: 24px;
  border: 1px dashed #d5dacf;
  border-radius: 14px;
  text-align: center;
}

.player-empty-state span {
  color: #747b70;
}

@media (max-width: 900px) {
  .player-portal-hero,
  .player-auth-layout,
  .player-dashboard-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 620px) {
  .player-portal-hero {
    padding-top: 20px;
  }

  .player-dashboard-head,
  .player-registration-item header {
    align-items: stretch;
    flex-direction: column;
  }

  .player-dashboard-head {
    display: grid;
  }
}

/* V3.7-A2 · compañero e invitaciones */

.player-partner-grid {
  margin-top: 16px;
}

.player-partner-actions {
  display: flex;
  justify-content: flex-start;
  margin-top: 12px;
}

.player-partner-results,
.player-invitations-list {
  display: grid;
  gap: 9px;
  margin-top: 14px;
}

.player-partner-result,
.player-invitation-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 13px 14px;
  border: 1px solid #e0e4db;
  border-radius: 13px;
  background: #fff;
}

.player-partner-result > div,
.player-invitation-item header > div {
  display: grid;
  gap: 3px;
}

.player-partner-result span,
.player-invitation-meta > span {
  color: #6e7568;
  font-size: .82rem;
}

.player-partner-empty {
  margin-top: 12px;
}

.player-invitation-item {
  display: grid;
}

.player-invitation-item header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.player-invitation-meta {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

.player-invitation-actions {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
}

.player-invitation-status-accepted {
  background: #e7f5dc;
  color: #38522d;
}

.player-invitation-status-rejected,
.player-invitation-status-cancelled,
.player-invitation-status-expired {
  background: #fae8e4;
  color: #7b392f;
}

@media (max-width: 620px) {
  .player-partner-result,
  .player-invitation-item header,
  .player-invitation-meta {
    align-items: stretch;
  }

  .player-partner-result,
  .player-invitation-meta {
    display: grid;
  }

  .player-partner-result button,
  .player-invitation-actions button {
    width: 100%;
  }

  .player-invitation-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
}

/* V3.7-A3.2 · pagos y comprobantes */

.player-payment-section {
  margin-top: 16px;
}

.player-payments-list {
  display: grid;
  gap: 12px;
}

.player-payment-item {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid #e0e4db;
  border-radius: 14px;
  background: #fff;
}

.player-payment-item header {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: flex-start;
}

.player-payment-item header > div {
  display: grid;
  gap: 3px;
}

.player-payment-summary {
  display: grid;
  grid-template-columns:
    repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.player-payment-summary > div {
  display: grid;
  gap: 3px;
  padding: 11px 12px;
  border-radius: 11px;
  background: #f3f5ef;
}

.player-payment-summary span {
  color: #73796e;
  font-size: .73rem;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.player-payment-description {
  margin: 0;
  color: #62695d;
}

.player-payment-upload {
  display: grid;
  grid-template-columns:
    minmax(0, 1fr)
    auto;
  gap: 12px;
  align-items: end;
}

.player-payment-upload label {
  display: grid;
  gap: 6px;
}

.player-payment-upload input[type="file"] {
  width: 100%;
}

.player-payment-receipt-info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid #e0e4db;
  border-radius: 11px;
  background: #fafbf8;
  color: #646b5f;
  font-size: .84rem;
}

.player-payment-warning {
  margin: 0;
  padding: 11px 12px;
  border: 1px solid #e4d9a9;
  border-radius: 11px;
  background: #fff9e5;
  color: #695b29;
}

.player-payment-status-submitted {
  background: #fff3cf;
  color: #6b5620;
}

.player-payment-status-approved,
.player-payment-status-waived {
  background: #e7f5dc;
  color: #38522d;
}

.player-payment-status-rejected {
  background: #fae8e4;
  color: #7b392f;
}

.player-payment-methods {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.player-payment-method-option {
  min-height: 44px;
  border: 1px solid #d9ded2;
  border-radius: 11px;
  background: #fff;
  color: #2f342b;
  font-weight: 800;
}

.player-payment-method-option.is-active,
.player-payment-method-option.is-active:hover:not(:disabled) {
  border-color: #98d900;
  background: #11120f;
  color: #98d900;
}

.player-payment-method-panel {
  display: grid;
  gap: 12px;
}

.player-payment-bank {
  display: grid;
  gap: 6px;
  margin: 0;
}

.player-payment-bank > div {
  display: grid;
  grid-template-columns: minmax(110px, 160px) minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 9px 12px;
  border-radius: 11px;
  background: #f3f5ef;
}

.player-payment-bank dt {
  color: #73796e;
  font-size: .73rem;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.player-payment-bank dd {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin: 0;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.player-payment-whatsapp {
  display: grid;
  gap: 6px;
  justify-items: start;
}

.player-payment-whatsapp small {
  color: #73796e;
}

.player-payment-whatsapp-link {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 9px 14px;
  border: 1px solid #1f9d55;
  border-radius: 11px;
  background: #ecfbf1;
  color: #14532d;
  font-weight: 800;
  text-decoration: none;
}

.player-payment-cash-note {
  margin: 0;
  padding: 11px 12px;
  border: 1px solid #d9ead0;
  border-radius: 11px;
  background: #f1f8ea;
  color: #38522d;
}

@media (max-width: 620px) {
  .player-payment-item header,
  .player-payment-receipt-info {
    display: grid;
  }

  .player-payment-summary,
  .player-payment-upload,
  .player-payment-bank > div {
    grid-template-columns: 1fr;
  }

  .player-payment-upload button,
  .player-payment-receipt-info button {
    width: 100%;
  }
}

/* V3.7-C0
 * El atributo hidden siempre debe tener prioridad.
 * Evita que Portal PLAYER, login y dashboard
 * queden visibles simultáneamente.
 */

#playerView[hidden],
#playerView [hidden] {
  display: none !important;
}


/* ==================================================
   CELULAR / WHATSAPP PARAGUAY
   ================================================== */

.player-phone-field {
  min-width: 0;
}

.player-phone-label-text {
  display: block;
}

.player-phone-input {
  display: grid;
  grid-template-columns:
    auto minmax(0, 1fr);
  width: 100%;
  min-width: 0;
}

.player-phone-prefix {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 .85rem;
  border:
    1px solid rgba(30, 48, 42, .18);
  border-right: 0;
  border-radius:
    10px 0 0 10px;
  background:
    rgba(30, 48, 42, .055);
  font-weight: 700;
  white-space: nowrap;
  user-select: none;
}

.player-phone-input > input {
  width: 100%;
  min-width: 0;
  margin: 0;
  border-radius:
    0 10px 10px 0;
}

.player-phone-input:focus-within
.player-phone-prefix {
  border-color:
    var(--accent, #7baa32);
}

.player-phone-error,
.player-field-error {
  display: block;
  color:
    var(--danger, #c94040);
  font-weight: 600;
}

.player-phone-error[hidden],
.player-field-error[hidden] {
  display: none !important;
}

#playerRegisterForm input[aria-invalid="true"] {
  border-color:
    var(--danger, #c94040);
}

#playerRegisterForm label {
  align-content: start;
  scroll-margin-top: 140px;
}

@media (max-width: 520px) {
  .player-phone-prefix {
    padding-inline: .7rem;
  }
}

/* ==================================================
   MOBILE UX M1B1 - TU TORNEO / PROXIMO PASO
   ================================================== */

.player-next-action-card {
  display: grid;
  gap: 14px;
  border-color: #cfd8c3;
  background:
    linear-gradient(
      145deg,
      #ffffff 0%,
      #f5f8f1 100%
    );
}

.player-next-action-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.player-next-action-head .eyebrow {
  margin-bottom: 3px;
}

.player-next-action-step {
  color: #62695d;
  font-size: .86rem;
  font-weight: 700;
}

.player-next-action-badge {
  flex: 0 0 auto;
  padding: 6px 9px;
  border-radius: 999px;
  background: #eef1e9;
  color: #52594d;
  font-size: .72rem;
  font-weight: 800;
}

.player-next-action-card[data-state="COMPLETE"]
.player-next-action-badge,
.player-next-action-card[data-state="PAIR_READY"]
.player-next-action-badge,
.player-next-action-card[data-state="CHOOSE_PARTNER_MODE"]
.player-next-action-badge {
  background: #e7f5dc;
  color: #38522d;
}

.player-next-action-card[data-state="PAYMENT_REVIEW"]
.player-next-action-badge {
  background: #fff3cf;
  color: #6b5620;
}

.player-next-action-card[data-state="PAYMENT_REJECTED"]
.player-next-action-badge,
.player-next-action-card[data-state="REGISTRATION_REJECTED"]
.player-next-action-badge,
.player-next-action-card[data-state="REGISTRATION_CANCELLED"]
.player-next-action-badge {
  background: #fae8e4;
  color: #7b392f;
}

.player-next-action-progress {
  overflow: hidden;
  height: 7px;
  border-radius: 999px;
  background: #e5e9df;
}

.player-next-action-progress > span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: #789b3c;
  transition: width .25s ease;
}

.player-next-action-category {
  width: max-content;
  max-width: 100%;
  margin: 0;
  padding: 5px 8px;
  border-radius: 8px;
  background: #eef1e9;
  color: #596252;
  font-size: .76rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .055em;
}

.player-next-action-card h2 {
  margin: 0;
  font-size:
    clamp(
      1.45rem,
      4vw,
      2rem
    );
  line-height: 1.08;
}

.player-next-action-description {
  max-width: 680px;
  margin: 0;
  color: #62695d;
  line-height: 1.5;
}

.player-next-action-button {
  justify-self: start;
}

@media (max-width: 620px) {
  .player-next-action-card {
    gap: 12px;
    padding: 18px;
  }

  .player-next-action-head {
    align-items: center;
  }

  .player-next-action-card h2 {
    font-size: 1.45rem;
  }

  .player-next-action-button {
    width: 100%;
  }
}

/* Inscripción guiada: una categoría y una acción a la vez. */
.player-flow-nav, .player-flow-context, .player-registration-actions { display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; }
.player-flow-context { position: relative; scroll-margin-top: 120px; }
.player-flow-context > span { font-weight: 700; overflow-wrap: anywhere; }
#playerDashboard [hidden] { display: none !important; }
#playerDashboard .player-dashboard-grid { grid-template-columns: minmax(0, 1fr); }
#playerDashboard .player-dashboard-grid:has(> :not([hidden])) { margin: 0; }
#playerDashboard .player-dashboard-grid:not(:has(> :not([hidden]))) { display: none; }
#playerDashboard .player-payment-section:not(:has(> :not([hidden]))) { display: none; }
#playerDashboard[data-registration-screen="detail"] #playerNextActionButton { display: none; }
#playerNewRegistrationCard, #playerRegistrationOverview, #playerNextActionCard { scroll-margin-top: 125px; }
.player-registration-actions { margin-top: 1rem; }
.player-registration-actions > button { min-height: 44px; }
@media (max-width: 700px) {
  .player-flow-nav, .player-registration-actions { display: grid; grid-template-columns: minmax(0, 1fr); }
  .player-flow-nav button, .player-registration-actions button { width: 100%; white-space: normal; }
  #playerDashboard .player-next-action-card { gap: .65rem; padding: 1rem; }
  #playerDashboard .player-next-action-card h2 { font-size: 1.2rem; }
}

body:has(#playerView:not([hidden]) #playerDashboard:not([hidden])) #registerCta { display: none; }
#playerDashboard[data-registration-screen="list"] #playerFlowHome { font-weight: 800; }

#playerView[data-logged-in="true"] > .player-portal-hero { padding: 0; margin-bottom: 0; }
#playerView[data-logged-in="true"] > .player-portal-hero h1 { font-size: 1.5rem; margin: 0; }
#playerView[data-logged-in="true"] > .player-portal-hero p { display: none; }
#playerDashboard .player-dashboard-head { flex-direction: row; padding: .85rem; gap: .75rem; }
#playerDashboard .player-dashboard-head > div { min-width: 0; }
#playerDashboard .player-dashboard-head .eyebrow { display: none; }
#playerDashboard .player-dashboard-head h2 { font-size: 1rem; }
#playerDashboard .player-dashboard-head .card-description { font-size: .8rem; overflow-wrap: anywhere; }
#playerDashboard #playerLogoutBtn { width: auto; flex: 0 0 auto; font-size: .8rem; padding: .65rem; }