/* ==========================================================================
   BCLWEB - MODERN PLAYER PROFILE & BALLON D'OR GALA SUITE (PHASE 3)
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. BALLON D'OR & GALA CEREMONY MOBILE-FIRST ENHANCEMENTS
   -------------------------------------------------------------------------- */
.ballon-dor-screen {
  padding: 12px 10px calc(var(--bcl-bottom-nav-height) + 24px) !important;
}

.bd-header-banner {
  background: radial-gradient(circle at 80% 20%, rgba(255, 215, 0, 0.22), transparent 50%),
              radial-gradient(circle at 20% 80%, rgba(245, 158, 11, 0.15), transparent 45%),
              linear-gradient(135deg, #090b10 0%, #121824 50%, #06090e 100%) !important;
  border: 1px solid rgba(255, 215, 0, 0.35) !important;
  border-radius: var(--bcl-radius-lg) !important;
  padding: 20px 16px !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.8), 0 0 25px rgba(255, 215, 0, 0.15) !important;
  margin-bottom: 18px !important;
}

.bd-title {
  font-family: var(--bcl-font-display) !important;
  font-size: 1.85rem !important;
  font-weight: 900 !important;
  background: linear-gradient(135deg, #ffffff 10%, #fff2a3 50%, #ffd700 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: 0 0 20px rgba(255, 215, 0, 0.25);
}

.bd-filter-bar {
  background: var(--bcl-bg-surface-glass) !important;
  backdrop-filter: var(--bcl-glass-blur) !important;
  -webkit-backdrop-filter: var(--bcl-glass-blur) !important;
  border: 1px solid var(--bcl-border-subtle) !important;
  border-radius: var(--bcl-radius-md) !important;
  padding: 12px 14px !important;
  gap: 10px !important;
}

/* --------------------------------------------------------------------------
   2. PLAYER PROFILE & RICH CARDS MOBILE REFINEMENTS
   -------------------------------------------------------------------------- */
@media (max-width: 900px) {
  .jr-root {
    flex-direction: column !important;
    min-height: auto !important;
    border-radius: var(--bcl-radius-md) !important;
    margin-bottom: calc(var(--bcl-bottom-nav-height) + 16px);
  }

  .jr-left-panel {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    max-height: 280px !important;
    border-right: none !important;
    border-bottom: 1px solid var(--bcl-border-subtle) !important;
  }

  .jr-center-panel {
    padding: 16px 12px !important;
    width: 100% !important;
  }

  .jr-right-panel {
    width: 100% !important;
    padding: 14px 12px !important;
  }

  .jr-fut-card-container {
    transform: scale(0.92);
    margin: 0 auto;
  }
}

/* Card Holográfico & Detalhes de Estatísticas */
.jr-fut-card-preview-wrap {
  perspective: 1200px;
}

.jr-stats-overview-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 10px;
}

.jr-stat-box {
  background: linear-gradient(160deg, rgba(18, 32, 54, 0.75) 0%, rgba(9, 16, 28, 0.85) 100%);
  border: 1px solid var(--bcl-border-subtle);
  border-radius: var(--bcl-radius-sm);
  padding: 10px 12px;
  text-align: center;
}

.jr-stat-box .jr-stat-val {
  font-family: var(--bcl-font-display);
  font-size: 1.15rem;
  font-weight: 800;
  color: var(--bcl-neon-cyan);
}

.jr-stat-box .jr-stat-lbl {
  font-size: 0.68rem;
  font-weight: 700;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* Modais em Bottom-Sheet Deslizante */
@media (max-width: 768px) {
  .jr-variacoes-modal-overlay {
    align-items: flex-end !important;
    padding: 0 !important;
  }

  .jr-variacoes-modal-sheet {
    width: 100% !important;
    max-width: 100% !important;
    max-height: 88vh !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    border-top: 1px solid var(--bcl-neon-cyan) !important;
    padding-bottom: var(--bcl-safe-bottom);
  }
}