/* =======================================================================
   PADEL PRO PICKS — Global Design System CSS
   Matches the React/Tailwind dark sports-tech theme exactly.
   Include this in all 3 plugins and the theme template.
   ======================================================================= */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=Manrope:wght@400;500;600;700&display=swap');

/* -----------------------------------------------------------------------
   CSS Custom Properties — mirrors React index.css design tokens
----------------------------------------------------------------------- */
:root {
  --padel-bg:        #090e18;    /* hsl(216 30% 6%) */
  --padel-card:      #111827;    /* hsl(215 28% 10%) */
  --padel-surface1:  #111827;
  --padel-surface2:  #161e2e;    /* hsl(215 25% 13%) */
  --padel-surface3:  #1b2438;    /* hsl(215 22% 16%) */
  --padel-border:    #1f2d45;    /* hsl(215 20% 18%) */
  --padel-foreground:#ffffff;
  --padel-text-sec:  #a8b3c7;    /* hsl(214 12% 70%) */
  --padel-text-muted:#606d82;    /* hsl(215 12% 47%) */

  --padel-green:     #00ff87;    /* hsl(156 100% 50%) primary */
  --padel-teal:      #00e5ff;    /* hsl(192 100% 50%) */
  --padel-blue:      #3b82f6;    /* hsl(217 91% 60%) */
  --padel-purple:    #8b5cf6;    /* hsl(258 90% 66%) */
  --padel-red:       #ef4444;

  --padel-grad-hero: linear-gradient(135deg, #00ff87 0%, #00e5ff 100%);
  --padel-grad-card: linear-gradient(135deg, rgba(0,255,135,.08), rgba(0,229,255,.05));
  --padel-grad-cta:  linear-gradient(135deg, #00ff87 0%, #00d975 100%);
  --padel-grad-glow: radial-gradient(circle at top right, rgba(0,255,135,.15), transparent 60%);

  --padel-shadow-card:  0 2px 8px rgba(5,8,15,.4);
  --padel-shadow-hover: 0 12px 32px rgba(5,8,15,.6), 0 0 0 1px rgba(0,255,135,.08);
  --padel-shadow-glow:  0 0 24px rgba(0,255,135,.25);

  --padel-radius: 14px;
  --padel-font-display: 'Inter', system-ui, sans-serif;
  --padel-font-body: 'Manrope', system-ui, sans-serif;
}

/* -----------------------------------------------------------------------
   Base resets scoped to .padel-main
----------------------------------------------------------------------- */
.padel-main *,
.padel-grid *,
.padel-page-hero *,
.padel-app-wrap * {
  box-sizing: border-box;
}

.padel-main {
  background: var(--padel-bg);
  color: var(--padel-foreground);
  font-family: var(--padel-font-body);
  min-height: 60vh;
}

/* Full-page dark bg for page template */
body.page-template-page-padel,
body.post-type-archive-padel_prediction,
body.post-type-archive-padel_tournament,
body.post-type-archive-padel_betting,
body.single-padel_prediction,
body.single-padel_tournament,
body.single-padel_betting {
  background: var(--padel-bg) !important;
  color: var(--padel-foreground) !important;
}

/* -----------------------------------------------------------------------
   Scrollbar
----------------------------------------------------------------------- */
.padel-main ::-webkit-scrollbar { width:6px; height:6px; }
.padel-main ::-webkit-scrollbar-track { background: var(--padel-bg); }
.padel-main ::-webkit-scrollbar-thumb { background: var(--padel-border); border-radius:3px; }

/* -----------------------------------------------------------------------
   Layout Containers
----------------------------------------------------------------------- */
.padel-container {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 1.25rem;
}
.padel-narrow {
  max-width: 768px;
}
@media (min-width: 640px) {
  .padel-container { padding: 0 1.5rem; }
}

/* -----------------------------------------------------------------------
   Grid System
----------------------------------------------------------------------- */
.padel-grid {
  display: grid;
  gap: 1.25rem;
}
.padel-grid-1 { grid-template-columns: 1fr; }
.padel-grid-2 { grid-template-columns: 1fr; }
.padel-grid-3 { grid-template-columns: 1fr; }
.padel-grid-4 { grid-template-columns: 1fr 1fr; }

@media (min-width: 640px) {
  .padel-grid-2 { grid-template-columns: 1fr 1fr; }
  .padel-grid-3 { grid-template-columns: 1fr 1fr; }
  .padel-grid-4 { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1024px) {
  .padel-grid-3 { grid-template-columns: 1fr 1fr 1fr; }
  .padel-grid-4 { grid-template-columns: 1fr 1fr 1fr 1fr; }
}

/* -----------------------------------------------------------------------
   Section Spacing
----------------------------------------------------------------------- */
.padel-section {
  padding: 4rem 0;
}
@media (min-width: 640px)  { .padel-section { padding: 5rem 0; } }
@media (min-width: 1024px) { .padel-section { padding: 6rem 0; } }

/* -----------------------------------------------------------------------
   Page Hero Band
----------------------------------------------------------------------- */
.padel-page-hero {
  padding: 2.5rem 0;
  background: var(--padel-surface1);
  border-bottom: 1px solid var(--padel-border);
}
.padel-eyebrow {
  display: block;
  font-family: var(--padel-font-display);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .08em;
  margin-bottom: .25rem;
}
.padel-green  { color: var(--padel-green); }
.padel-teal   { color: var(--padel-teal); }
.padel-blue   { color: var(--padel-blue); }
.padel-purple { color: var(--padel-purple); }

.padel-page-title {
  font-family: var(--padel-font-display);
  font-size: clamp(1.6rem, 4vw, 2.25rem);
  font-weight: 800;
  letter-spacing: -.025em;
  color: var(--padel-foreground);
  margin: 0 0 .5rem;
}
.padel-page-subtitle {
  font-size: .875rem;
  color: var(--padel-text-muted);
  margin: 0;
}

/* -----------------------------------------------------------------------
   Cards
----------------------------------------------------------------------- */
.padel-card {
  position: relative;
  border-radius: var(--padel-radius);
  border: 1px solid var(--padel-border);
  background: var(--padel-card);
  box-shadow: var(--padel-shadow-card);
  transition: transform .2s ease, box-shadow .2s ease;
  overflow: hidden;
}
.padel-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--padel-shadow-hover);
}
.padel-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--padel-grad-card);
  opacity: 0;
  transition: opacity .3s;
  pointer-events: none;
}
.padel-card:hover::before { opacity: 1; }

.padel-card-inner {
  position: relative;
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: .75rem;
  height: 100%;
}
.padel-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.padel-card-title {
  font-family: var(--padel-font-display);
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--padel-foreground);
  margin: 0;
  line-height: 1.3;
}
.padel-card-title a {
  color: inherit;
  text-decoration: none;
}
.padel-card-title a:hover { color: var(--padel-green); }

.padel-card-excerpt {
  font-size: .875rem;
  color: var(--padel-text-sec);
  line-height: 1.6;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.padel-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: auto;
  padding-top: .75rem;
  gap: .5rem;
}

/* card-surface (non-card static boxes) */
.padel-card-surface {
  border-radius: var(--padel-radius);
  border: 1px solid var(--padel-border);
  background: var(--padel-card);
  box-shadow: var(--padel-shadow-card);
  padding: 1.5rem;
}
.padel-card-surface h2 {
  font-family: var(--padel-font-display);
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--padel-foreground);
  margin: 0 0 1rem;
}
.padel-card-surface p {
  font-size: .95rem;
  color: var(--padel-text-sec);
  line-height: 1.7;
  margin: 0;
}
.padel-content p,
.padel-content li,
.padel-content ul,
.padel-content ol {
  font-size: .95rem;
  color: var(--padel-text-sec);
  line-height: 1.7;
}

/* -----------------------------------------------------------------------
   Badges & Pills
----------------------------------------------------------------------- */
.padel-badge {
  display: inline-flex;
  align-items: center;
  border-radius: 6px;
  padding: .25rem .625rem;
  font-family: var(--padel-font-display);
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
}
.padel-badge-type {
  background: rgba(0,229,255,.1);
  color: var(--padel-teal);
}
.padel-badge-pro {
  background: var(--padel-surface3);
  color: var(--padel-text-sec);
}

/* Status badges */
.padel-status {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: .2rem .7rem;
  font-family: var(--padel-font-display);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.padel-status-won,    .padel-status-active    { background: rgba(0,255,135,.12); color: var(--padel-green); }
.padel-status-lost,   .padel-status-cancelled { background: rgba(239,68,68,.12); color: var(--padel-red); }
.padel-status-pending,.padel-status-upcoming  { background: var(--padel-surface3); color: var(--padel-text-muted); }
.padel-status-completed { background: rgba(139,92,246,.12); color: var(--padel-purple); }
.padel-status-void    { background: var(--padel-surface3); color: var(--padel-text-muted); }

/* Odds pill */
.padel-odds {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: .25rem .75rem;
  font-family: var(--padel-font-display);
  font-size: 12px;
  font-weight: 800;
  background: rgba(0,255,135,.12);
  color: var(--padel-green);
  letter-spacing: .02em;
}
.padel-odds-lg {
  font-size: 1rem;
  padding: .35rem 1rem;
}

/* Rating badge */
.padel-rating-badge {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  border-radius: 8px;
  padding: .3rem .6rem;
  background: rgba(0,255,135,.1);
  color: var(--padel-green);
  font-family: var(--padel-font-display);
  font-size: 13px;
  font-weight: 800;
}
.padel-rating-inline {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  color: var(--padel-green);
  font-weight: 700;
  font-size: 13px;
}

/* -----------------------------------------------------------------------
   Confidence Bar
----------------------------------------------------------------------- */
.padel-confidence { display: flex; flex-direction: column; gap: .4rem; }
.padel-confidence-labels {
  display: flex;
  justify-content: space-between;
  font-family: var(--padel-font-display);
  font-size: 12px;
  color: var(--padel-text-muted);
}
.padel-confidence-value { font-weight: 700; color: var(--padel-foreground); }
.padel-bar-track {
  height: 6px;
  border-radius: 999px;
  background: var(--padel-surface3);
  overflow: hidden;
}
.padel-bar-fill {
  height: 100%;
  border-radius: 999px;
  background: var(--padel-grad-hero);
  transition: width .8s ease;
}
.padel-bar-lg { height: 10px; }

/* Confidence block in single */
.padel-confidence-block {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: var(--padel-font-display);
  font-size: 13px;
  color: var(--padel-text-muted);
  margin-bottom: 1rem;
}
.padel-conf-pct {
  font-size: 1.8rem;
  font-weight: 900;
  background: var(--padel-grad-hero);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* -----------------------------------------------------------------------
   Buttons
----------------------------------------------------------------------- */
.padel-btn-primary {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  border-radius: 10px;
  padding: .75rem 1.5rem;
  font-family: var(--padel-font-display);
  font-size: .875rem;
  font-weight: 700;
  background: var(--padel-grad-cta);
  color: #050c14;
  border: none;
  cursor: pointer;
  text-decoration: none;
  transition: transform .2s, box-shadow .2s, filter .2s;
}
.padel-btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: var(--padel-shadow-glow);
  filter: brightness(1.1);
  color: #050c14;
  text-decoration: none;
}
.padel-btn-sm { padding: .45rem .9rem; font-size: .8rem; }

.padel-btn-secondary {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  border-radius: 10px;
  padding: .75rem 1.5rem;
  font-family: var(--padel-font-display);
  font-size: .875rem;
  font-weight: 700;
  background: transparent;
  color: var(--padel-foreground);
  border: 1px solid var(--padel-border);
  cursor: pointer;
  text-decoration: none;
  transition: background .2s, border-color .2s;
}
.padel-btn-secondary:hover {
  background: var(--padel-surface2);
  color: var(--padel-foreground);
  text-decoration: none;
}

/* Card CTA link */
.padel-card-cta {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-family: var(--padel-font-display);
  font-size: 13px;
  font-weight: 700;
  color: var(--padel-green);
  text-decoration: none;
  margin-top: auto;
  opacity: 0;
  transition: opacity .2s, transform .2s;
}
.padel-card:hover .padel-card-cta,
.padel-card-cta:focus { opacity: 1; }
.padel-card-cta:hover { text-decoration: none; }
.padel-cta-ghost { color: var(--padel-text-muted); }
.padel-cta-ghost:hover { color: var(--padel-foreground); }

/* -----------------------------------------------------------------------
   Bookmaker / Prediction Meta
----------------------------------------------------------------------- */
.padel-bookmaker-tag {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  background: rgba(0,255,135,.1);
  color: var(--padel-green);
  border-radius: 8px;
  padding: .35rem .75rem;
  font-family: var(--padel-font-display);
  font-size: 12px;
  font-weight: 700;
}
.padel-card-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .5rem;
}

/* Tournament meta rows */
.padel-tournament-meta { display: flex; flex-direction: column; gap: .4rem; }
.padel-meta-row {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-family: var(--padel-font-display);
  font-size: 13px;
  color: var(--padel-text-muted);
}

/* Betting */
.padel-bookmaker-logo {
  display: flex;
  align-items: center;
  gap: .75rem;
}
.padel-bookmaker-logo img {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  object-fit: contain;
  background: var(--padel-surface2);
}
.padel-logo-fallback {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  background: var(--padel-surface3);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--padel-font-display);
  font-weight: 800;
  font-size: 14px;
  color: var(--padel-text-sec);
  text-transform: uppercase;
}
.padel-bonus-box {
  border-radius: 10px;
  border: 1px solid var(--padel-border);
  background: var(--padel-surface2);
  padding: .75rem 1rem;
}
.padel-bonus-label {
  display: block;
  font-family: var(--padel-font-display);
  font-size: 11px;
  color: var(--padel-text-muted);
  margin-bottom: .2rem;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.padel-bonus-value {
  font-family: var(--padel-font-display);
  font-size: 1rem;
  font-weight: 800;
  color: var(--padel-foreground);
  margin: 0;
}
.padel-pros {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
}
.padel-featured { border-color: rgba(0,255,135,.25); }

/* -----------------------------------------------------------------------
   Filter Bar
----------------------------------------------------------------------- */
.padel-filter-bar {
  position: sticky;
  top: 0;
  z-index: 40;
  border-bottom: 1px solid var(--padel-border);
  background: rgba(9,14,24,.9);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  padding: .75rem 0;
}
.padel-filter-inner {
  display: flex;
  align-items: center;
  gap: .75rem;
  flex-wrap: wrap;
}
.padel-search-form {
  position: relative;
  flex: 1;
  max-width: 380px;
  display: flex;
  align-items: center;
}
.padel-search-form svg {
  position: absolute;
  left: .875rem;
  color: var(--padel-text-muted);
  pointer-events: none;
}
.padel-search-form input {
  width: 100%;
  padding: .6rem .875rem .6rem 2.5rem;
  border-radius: 10px;
  border: 1px solid var(--padel-border);
  background: var(--padel-card);
  color: var(--padel-foreground);
  font-family: var(--padel-font-body);
  font-size: .875rem;
  outline: none;
  transition: border-color .2s, box-shadow .2s;
}
.padel-search-form input::placeholder { color: var(--padel-text-muted); }
.padel-search-form input:focus {
  border-color: rgba(0,255,135,.4);
  box-shadow: 0 0 0 3px rgba(0,255,135,.08);
}
.padel-filter-chips { display: flex; gap: .5rem; flex-wrap: wrap; }
.padel-chip {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: .375rem .875rem;
  font-family: var(--padel-font-display);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  text-decoration: none;
  transition: background .2s, color .2s;
  background: var(--padel-surface2);
  color: var(--padel-text-sec);
  border: none;
}
.padel-chip:hover { background: var(--padel-surface3); color: var(--padel-foreground); text-decoration: none; }
.padel-chip.active {
  background: rgba(0,255,135,.15);
  color: var(--padel-green);
  font-weight: 700;
}

/* -----------------------------------------------------------------------
   Single Post Layout
----------------------------------------------------------------------- */
.padel-breadcrumb {
  padding: .75rem 0;
  border-bottom: 1px solid var(--padel-border);
}
.padel-breadcrumb a {
  font-family: var(--padel-font-display);
  font-size: 13px;
  color: var(--padel-text-muted);
  text-decoration: none;
  transition: color .2s;
}
.padel-breadcrumb a:hover { color: var(--padel-foreground); }

.padel-single-hero {
  position: relative;
  overflow: hidden;
  padding: 3rem 0;
  border-bottom: 1px solid var(--padel-border);
}
.padel-single-hero-glow {
  position: absolute;
  inset: 0;
  background: var(--padel-grad-glow);
  pointer-events: none;
}
.padel-teal-hero { }
.padel-teal-glow { background: radial-gradient(circle at top right, rgba(0,229,255,.12), transparent 60%); }

.padel-single-title {
  font-family: var(--padel-font-display);
  font-size: clamp(1.8rem, 5vw, 3rem);
  font-weight: 900;
  letter-spacing: -.03em;
  color: var(--padel-foreground);
  margin: 1rem 0 1.25rem;
  line-height: 1.1;
}
.padel-single-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
}
.padel-meta-item {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-family: var(--padel-font-display);
  font-size: 13px;
  color: var(--padel-text-muted);
}

.padel-sticky-bar {
  position: sticky;
  top: 0;
  z-index: 40;
  border-bottom: 1px solid var(--padel-border);
  background: rgba(9,14,24,.9);
  backdrop-filter: blur(16px);
  padding: .75rem 0;
}
.padel-sticky-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.padel-conf-inline {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-family: var(--padel-font-display);
  font-size: 13px;
  color: var(--padel-text-muted);
}
.padel-conf-inline strong {
  font-size: 1.1rem;
  font-weight: 900;
  color: var(--padel-foreground);
}

.padel-single-body {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  padding-top: 3rem;
  padding-bottom: 4rem;
}

.padel-result-text {
  font-family: var(--padel-font-display) !important;
  font-size: 1.8rem !important;
  font-weight: 900 !important;
  background: var(--padel-grad-hero);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.padel-cta-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: var(--padel-radius);
  border: 1px solid rgba(0,255,135,.2);
  background: var(--padel-grad-card);
  padding: 1.5rem;
  gap: 1rem;
  flex-wrap: wrap;
}
.padel-cta-label {
  font-family: var(--padel-font-display);
  font-size: 12px;
  color: var(--padel-text-muted);
  margin: 0 0 .25rem;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.padel-cta-name {
  font-family: var(--padel-font-display);
  font-size: 1.25rem;
  font-weight: 800;
  color: var(--padel-foreground);
  margin: 0;
}

.padel-disclaimer {
  border-radius: 10px;
  background: var(--padel-surface2);
  padding: .875rem 1rem;
  text-align: center;
  font-family: var(--padel-font-display);
  font-size: 12px;
  color: var(--padel-text-muted);
}
.padel-disclaimer a { color: var(--padel-green); text-decoration: underline; }

.padel-related-title {
  font-family: var(--padel-font-display);
  font-size: 1.3rem;
  font-weight: 800;
  color: var(--padel-foreground);
  margin: 1.5rem 0 0;
}

/* Tournament single */
.padel-trophy-icon {
  width: 40px; height: 40px;
  border-radius: 10px;
  background: rgba(0,229,255,.1);
  display: flex; align-items: center; justify-content: center;
  color: var(--padel-teal);
}
.padel-tournament-icon-lg {
  width: 64px; height: 64px;
  border-radius: 14px;
  background: rgba(0,229,255,.1);
  display: flex; align-items: center; justify-content: center;
  color: var(--padel-teal);
  margin-bottom: 1rem;
}
.padel-tournament-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: var(--padel-border);
  border-radius: var(--padel-radius);
  overflow: hidden;
  border: 1px solid var(--padel-border);
}
.padel-stat-item {
  background: var(--padel-card);
  padding: 1rem 1.25rem;
  display: flex;
  flex-direction: column;
  gap: .3rem;
}
.padel-stat-label {
  font-family: var(--padel-font-display);
  font-size: 11px;
  color: var(--padel-text-muted);
  text-transform: uppercase;
  letter-spacing: .06em;
}
.padel-stat-value {
  font-family: var(--padel-font-display);
  font-size: 1rem;
  font-weight: 700;
  color: var(--padel-foreground);
}

.padel-featured-image { border-radius: var(--padel-radius); overflow: hidden; }
.padel-img { width: 100%; height: auto; display: block; }

/* -----------------------------------------------------------------------
   Comparison Table
----------------------------------------------------------------------- */
.padel-table-wrap {
  border-radius: var(--padel-radius);
  border: 1px solid var(--padel-border);
  background: var(--padel-card);
  overflow-x: auto;
}
.padel-comparison-table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
}
.padel-comparison-table thead tr {
  border-bottom: 1px solid var(--padel-border);
}
.padel-comparison-table thead th {
  padding: 1rem 1rem .75rem;
  font-family: var(--padel-font-display);
  font-size: 12px;
  font-weight: 600;
  color: var(--padel-text-muted);
  text-transform: uppercase;
  letter-spacing: .06em;
}
.padel-comparison-table tbody tr {
  border-bottom: 1px solid var(--padel-border);
  transition: background .15s;
}
.padel-comparison-table tbody tr:last-child { border-bottom: none; }
.padel-comparison-table tbody tr:hover { background: var(--padel-surface1); }
.padel-comparison-table tbody td {
  padding: 1rem;
  font-size: .9rem;
  color: var(--padel-foreground);
}
.padel-table-name {
  display: flex;
  align-items: center;
  gap: .75rem;
}
.padel-table-name img {
  width: 32px; height: 32px;
  border-radius: 6px;
  object-fit: contain;
  background: var(--padel-surface2);
}
.padel-table-name strong {
  font-family: var(--padel-font-display);
  font-size: .9rem;
  font-weight: 700;
}

/* -----------------------------------------------------------------------
   Pagination
----------------------------------------------------------------------- */
.padel-pagination {
  margin-top: 3rem;
  display: flex;
  justify-content: center;
  gap: .5rem;
  flex-wrap: wrap;
}
.padel-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 .75rem;
  border-radius: 8px;
  border: 1px solid var(--padel-border);
  background: var(--padel-card);
  color: var(--padel-text-sec);
  font-family: var(--padel-font-display);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  transition: background .2s, color .2s, border-color .2s;
}
.padel-pagination .page-numbers:hover { background: var(--padel-surface2); color: var(--padel-foreground); }
.padel-pagination .page-numbers.current {
  background: rgba(0,255,135,.15);
  color: var(--padel-green);
  border-color: rgba(0,255,135,.3);
  font-weight: 700;
}

/* -----------------------------------------------------------------------
   Result Count + Empty State
----------------------------------------------------------------------- */
.padel-result-count {
  font-family: var(--padel-font-display);
  font-size: 13px;
  color: var(--padel-text-muted);
  margin-bottom: 1.5rem;
}
.padel-empty {
  padding: 5rem 0;
  text-align: center;
}
.padel-empty p {
  font-size: .9rem;
  color: var(--padel-text-muted);
}

/* -----------------------------------------------------------------------
   Homepage Sections
----------------------------------------------------------------------- */
.padel-section-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 2rem;
}
.padel-section-header .padel-section-view-all {
  display: flex;
  align-items: center;
  gap: .4rem;
  font-family: var(--padel-font-display);
  font-size: 13px;
  font-weight: 700;
  color: var(--padel-green);
  text-decoration: none;
  opacity: 0;
  transition: opacity .2s;
}
.padel-section-header:hover .padel-section-view-all { opacity: 1; }
.padel-section-view-all { opacity: 1 !important; }

.padel-section-title {
  font-family: var(--padel-font-display);
  font-size: clamp(1.35rem, 3vw, 1.75rem);
  font-weight: 800;
  letter-spacing: -.025em;
  color: var(--padel-foreground);
  margin: .25rem 0 .4rem;
}
.padel-section-sub {
  font-size: .8rem;
  color: var(--padel-text-muted);
  margin: 0;
}
.padel-section-divider {
  border: none;
  border-top: 1px solid var(--padel-border);
  margin: 0;
}
.padel-section-bg { background: var(--padel-surface1); }

/* Why Trust Us feature cards */
.padel-feature-card {
  border-radius: var(--padel-radius);
  border: 1px solid var(--padel-border);
  background: var(--padel-card);
  box-shadow: var(--padel-shadow-card);
  padding: 1.5rem;
  text-align: center;
}
.padel-feature-icon {
  width: 48px; height: 48px;
  border-radius: 12px;
  background: var(--padel-surface2);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1rem;
}
.padel-feature-card h3 {
  font-family: var(--padel-font-display);
  font-size: .95rem;
  font-weight: 700;
  color: var(--padel-foreground);
  margin: 0 0 .5rem;
}
.padel-feature-card p {
  font-size: .8rem;
  color: var(--padel-text-muted);
  line-height: 1.6;
  margin: 0;
}

/* Hero section */
.padel-hero {
  position: relative;
  overflow: hidden;
  padding: 5rem 0;
}
.padel-hero-glow {
  position: absolute;
  inset: 0;
  background: var(--padel-grad-glow);
  pointer-events: none;
}
.padel-hero-blob-1 {
  position: absolute;
  top: -8rem; right: -8rem;
  width: 500px; height: 500px;
  border-radius: 50%;
  background: var(--padel-green);
  opacity: .06;
  filter: blur(80px);
  pointer-events: none;
}
.padel-hero-blob-2 {
  position: absolute;
  bottom: -8rem; left: -8rem;
  width: 400px; height: 400px;
  border-radius: 50%;
  background: var(--padel-teal);
  opacity: .04;
  filter: blur(70px);
  pointer-events: none;
}
.padel-hero-content { position: relative; z-index: 1; }
.padel-hero-pill {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  border-radius: 999px;
  border: 1px solid var(--padel-border);
  background: var(--padel-surface1);
  padding: .375rem 1rem;
  font-family: var(--padel-font-display);
  font-size: 13px;
  color: var(--padel-text-sec);
  margin-bottom: 1.5rem;
}
.padel-hero-pill-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--padel-green);
  animation: padel-pulse 2s infinite;
}
@keyframes padel-pulse {
  0%,100% { opacity: 1; transform: scale(1); }
  50%      { opacity: .5; transform: scale(.85); }
}
.padel-hero-title {
  font-family: var(--padel-font-display);
  font-size: clamp(2.2rem, 6vw, 3.5rem);
  font-weight: 900;
  letter-spacing: -.035em;
  color: var(--padel-foreground);
  line-height: 1.07;
  margin: 0 0 1.25rem;
}
.padel-text-gradient {
  background: var(--padel-grad-hero);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.padel-hero-desc {
  font-size: 1rem;
  color: var(--padel-text-sec);
  line-height: 1.7;
  max-width: 520px;
  margin: 0 0 2rem;
}
.padel-hero-buttons { display: flex; gap: .75rem; flex-wrap: wrap; margin-bottom: 2.5rem; }
.padel-hero-stats { display: flex; gap: 2rem; flex-wrap: wrap; }
.padel-hero-stat-value {
  font-family: var(--padel-font-display);
  font-size: 1.6rem;
  font-weight: 900;
  color: var(--padel-foreground);
  display: block;
}
.padel-hero-stat-label {
  font-family: var(--padel-font-display);
  font-size: 12px;
  color: var(--padel-text-muted);
}

/* CTA Section */
.padel-cta-section {
  position: relative;
  overflow: hidden;
  border-radius: 20px;
  border: 1px solid var(--padel-border);
  background: var(--padel-surface1);
  padding: 4rem 2rem;
  text-align: center;
}
.padel-cta-section h2 {
  font-family: var(--padel-font-display);
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 800;
  color: var(--padel-foreground);
  margin: 0 0 .75rem;
}
.padel-cta-section p {
  color: var(--padel-text-sec);
  font-size: .9rem;
  margin: 0 auto 2rem;
  max-width: 420px;
}
.padel-cta-buttons { display: flex; justify-content: center; gap: .75rem; flex-wrap: wrap; }