/* WrestleDelaware — Wrestler Profile CSS (single-source theme, no duplicates) */

:root{
  /* Canonical theme tokens */
  --bg0:#070b12;
  --bg1:#0b1220;
  --card:rgba(255,255,255,.06);
  --card2:rgba(255,255,255,.08);
  --border:rgba(255,255,255,.12);
  --text:#eaf0ff;
  --muted:rgba(234,240,255,.72);

  /* brand accents */
  --accent:#4aa3ff;
  --accent2:#16d3a2;
  --win:#2fe59a;
  --loss:#ff5d6c;

  /* Legacy aliases (keep older markup safe) */
  --wd-bg: var(--bg0);
  --wd-card: var(--card);
  --wd-border: var(--border);
  --wd-text: var(--text);
  --wd-sub: var(--muted);
  --wd-link: var(--accent);
}

*{ box-sizing:border-box; }

body{
  margin:0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background:
    radial-gradient(1000px 600px at 15% 0%, rgba(74,163,255,.18), transparent 60%),
    radial-gradient(900px 500px at 90% 10%, rgba(22,211,162,.14), transparent 55%),
    linear-gradient(180deg, var(--bg1), var(--bg0));
  color: var(--text);
}

a{ color:var(--wd-link); text-decoration:none; }
a:hover{ text-decoration:underline; }

.wd-wrap{ max-width:1100px; margin:0 auto; padding:18px; overflow:visible; }

.wd-sticky{
  position: sticky;
  top: 0;
  z-index: 10;
  background: rgba(7,11,18,.92);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--border);
  padding: 12px 0 10px;
}
/* Headshot (profile left column) */
.wd-headshot-wrap{
  margin-top: 12px;
  width: 170px;
  height: 170px;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.05);
  box-shadow: 0 12px 26px rgba(0,0,0,.35);
}

.wd-headshot{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* iPhone / iPad: make smaller */
@media (max-width: 900px){
  .wd-headshot-wrap{
    width: 120px;
    height: 120px;
    border-radius: 14px;
  }
}


/* Brand bar */
.wd-brandbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:12px 16px;
  margin: 10px 0 14px;
  border:1px solid var(--border);
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.04));
  border-radius:16px;
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
}

.wd-brand{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
  color: var(--text);
}

.wd-brandlogo{
  width:34px;
  height:34px;
  border-radius:10px;
  box-shadow: 0 6px 18px rgba(0,0,0,.35);
}

.wd-brandtext{ display:flex; flex-direction:column; }
.wd-brandname{ font-weight:800; letter-spacing:.2px; line-height:1.1; }
.wd-brandurl{ font-size:12px; color: var(--muted); margin-top:2px; }

.wd-brandnav{ display:flex; gap:10px; }

.wd-navbtn{
  text-decoration:none;
  color: var(--text);
  padding:8px 12px;
  border-radius:12px;
  border:1px solid var(--border);
  background: rgba(255,255,255,.06);
}
.wd-navbtn:hover{
  border-color: rgba(74,163,255,.45);
  background: rgba(74,163,255,.12);
}

/* Title/subtitle */
.wd-title{ margin:10px 0 4px; font-size:30px; }
.wd-sub{ margin:0; color: var(--muted); }

/* Cards / sections */
.wd-card{
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 14px;
}
.wd-section{ margin-top:14px; }
.wd-section h2{ margin:0 0 10px; font-size:18px; }
/* In-Season Results header row (title + season record pill) */
.wd-h2row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.wd-seasonrec{
  white-space: nowrap;
  padding:7px 10px;
  border-radius:999px;
  border:1px solid var(--border);
  background: rgba(255,255,255,.06);
  font-size:13px;
  color: rgba(234,240,255,.92);
}

/* Badges */
.wd-badges{ display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.wd-badge{
  white-space: nowrap;
  padding:7px 10px;
  border-radius:999px;
  border:1px solid var(--border);
  background: rgba(255,255,255,.06);
  font-size:13px;
}
.wd-badge--champion{
  font-size:14px;
  font-weight:800;
  padding:9px 14px;
  background: linear-gradient(135deg, rgba(255,215,0,.25), rgba(255,165,0,.18));
  border-color: rgba(255,215,0,.5);
  color: rgba(255,255,255,.98);
  box-shadow: 0 0 12px rgba(255,215,0,.15);
}

/* Tabs */
.wd-tabbar{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:10px; }
.wd-tab{
  border:1px solid var(--border);
  background: rgba(255,255,255,.05);
  color: var(--text);
  border-radius: 999px;
  padding: 7px 12px;
  cursor:pointer;
}
.wd-tab.is-active{
  border-color: rgba(74,163,255,.6);
  background: linear-gradient(90deg, rgba(74,163,255,.22), rgba(22,211,162,.18));
}

/* Tables */
.wd-tablewrap{
  border:1px solid var(--border);
  border-radius:16px;
  overflow:auto;
  background: rgba(255,255,255,.04);
}
.wd-table{
  width:100%;
  border-collapse:collapse;
  font-size: 13.5px;
}
.wd-table thead th{
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:11px;
  color: rgba(234,240,255,.75);
  background: rgba(255,255,255,.06);
  border-bottom:1px solid var(--border);
  padding: 10px 10px;
}
.wd-table td{
  padding: 10px 10px;
  border-bottom:1px solid rgba(255,255,255,.06);
  color: rgba(234,240,255,.92);
  vertical-align:top;
}
.wd-table tbody tr:hover{ background: rgba(74,163,255,.07); }
tr.wd-win td:nth-child(3){ color: var(--win); font-weight:800; }
tr.wd-loss td:nth-child(3){ color: var(--loss); font-weight:800; }

/* ============================
   Significant Wins (header-right)
   ============================ */
.wd-badges-grid{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
}

.wd-badges-left{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  min-width:260px;
  flex:1 1 420px;
}

.wd-sigwins{
  flex:0 1 520px;
  min-width:280px;
  max-width:100%;
}

.wd-sigwins-title{
  font-weight:800;
  margin:2px 0 8px 0;
}

.wd-sigwins-box{
  border:1px solid var(--border);
  border-radius:12px;
  padding:10px;
  background: rgba(255,255,255,.03);

  max-height: 420px;     /* <-- add */
  overflow-y: auto;      /* <-- add */

  overflow-x: auto;      /* keep */
}


.wd-sigwins-table{
  width:100%;
  border-collapse:collapse;
  font-size:13px;
}

.wd-sigwins-table th,
.wd-sigwins-table td{
  text-align:left;
  padding:6px 8px;
  border-bottom:1px solid rgba(255,255,255,.08);
  vertical-align:top;
  white-space:nowrap;
}

.wd-sigwins-table td.wd-sigwins-opp{
  white-space:normal;
  min-width:160px;
}
.wd-sigwins-table thead th{
  position: sticky;
  top: 0;
  z-index: 2;
  background: rgba(11,18,32,.95);
  border-bottom: 1px solid rgba(255,255,255,.12);
}

.wd-sigwins-event{
  font-size:12px;
  color: var(--muted);
  margin-top:2px;
}

.wd-sigwins--empty .wd-sigwins-box{ display:none; }
.wd-sigwins-empty{ color: var(--muted); padding:10px 0; }

/* Mobile tuning (upgrade): make ONLY the brand bar sticky, shrink logo, and stop header overlap */
/* Loading state */
.wd-loading{
  padding: 40px 20px;
  text-align: center;
  color: var(--muted);
  font-size: 15px;
}

.wd-loading::before{
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 3px solid rgba(74,163,255,.2);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: wd-spin 0.8s linear infinite;
  margin-right: 10px;
  vertical-align: middle;
}

@keyframes wd-spin{
  to{ transform: rotate(360deg); }
}

@media (max-width: 700px){
  .wd-wrap{ padding:14px; }
  .wd-title{ font-size:26px; }
  .wd-h2row{ flex-wrap:wrap; }
  .wd-seasonrec{ font-size:12px; padding:6px 9px; }

  /* The big header container should NOT be sticky on mobile */
  .wd-sticky{
    position: static;
    top: auto;
    z-index: auto;
    background: transparent;
    border-bottom: 0;
    padding: 0;
    backdrop-filter: none;
  }

  /* Make only the brand bar sticky */
  .wd-brandbar{
    position: sticky;
    top: 0;
    z-index: 30;
    padding: 8px 10px;
    margin: 8px 0 10px;
    border-radius: 14px;

    /* ensure it reads as a header while sticky */
    background: rgba(7,11,18,.96);
    backdrop-filter: blur(8px);
  }

  /* Shrink logo and tighten brand text */
  .wd-brandlogo{
    width: 26px;
    height: 26px;
    border-radius: 8px;
  }

  .wd-brandname{
    font-size: 14px;
    line-height: 1.05;
  }

  /* Hide the small url line to save vertical space */
  .wd-brandurl{ display:none; }

  /* Buttons smaller */
  .wd-navbtn{
    padding: 7px 10px;
    border-radius: 10px;
  }

  /* Optional: keep sig wins from dominating the top on mobile */
  .wd-sigwins{ flex: 1 1 100%; min-width: 0; }
  .wd-badges-left{ flex: 1 1 100%; min-width: 0; }
}