/* ============================================
   CRICKETLE — IPL CSS TEAM CARDS
   Progressive reveal: colors first, text later
   ============================================ */

/* ── BASE TEAM CARD ────────────────────────── */
.ct-team-card {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  transform-origin: center center;
  transition: transform 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* ── ZOOM SCALE LEVELS ─────────────────────── */
.ct-team-card.ct-zoom-0 { transform: scale(6);   }
.ct-team-card.ct-zoom-1 { transform: scale(4.5); }
.ct-team-card.ct-zoom-2 { transform: scale(3);   }
.ct-team-card.ct-zoom-3 { transform: scale(2);   }
.ct-team-card.ct-zoom-4 { transform: scale(1.4); }
.ct-team-card.ct-zoom-5 { transform: scale(1);   }

/* ── ABBREVIATION — hidden by default ─────────
   Only color + pattern visible at first.
   Fades in blurred at guess 3, clears at 5.
   ─────────────────────────────────────────── */
.ct-team-abbr {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 72px;
  letter-spacing: 4px;
  line-height: 1;
  position: relative;
  z-index: 2;
  text-shadow: 0 4px 20px rgba(0,0,0,0.5);
  opacity: 0;
  filter: blur(16px);
  transform: scale(0.8);
  transition: opacity 0.7s ease, filter 0.7s ease, transform 0.7s ease;
  user-select: none;
}

/* ── FULL NAME — hidden until full reveal ────── */
.ct-team-fullname {
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 3px;
  text-transform: uppercase;
  position: relative;
  z-index: 2;
  margin-top: 8px;
  opacity: 0;
  transition: opacity 0.7s ease;
  user-select: none;
}

/* ── PROGRESSIVE TEXT REVEAL ──────────────────
   zoom-3 → abbr fades in heavily blurred
   zoom-4 → abbr semi-clear
   zoom-5 → full reveal: abbr + name
   ─────────────────────────────────────────── */
.ct-team-card.ct-zoom-3 .ct-team-abbr {
  opacity: 0.55;
  filter: blur(8px);
  transform: scale(0.9);
}
.ct-team-card.ct-zoom-4 .ct-team-abbr {
  opacity: 0.8;
  filter: blur(3px);
  transform: scale(0.95);
}
.ct-team-card.ct-zoom-5 .ct-team-abbr {
  opacity: 1;
  filter: blur(0px);
  transform: scale(1);
}
.ct-team-card.ct-zoom-5 .ct-team-fullname {
  opacity: 1;
}

/* ── STRIPE PATTERN OVERLAY ─────────────────── */
.ct-team-card::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  opacity: 0.12;
}

/* ── BOTTOM COLOR ACCENT BAR ────────────────── */
.ct-team-card::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 6px;
  z-index: 3;
}

/* ══════════════════════════════════════════════
   IPL TEAM THEMES
   ══════════════════════════════════════════════ */

/* ── MUMBAI INDIANS — Royal Blue + Gold ──────── */
.ct-team-mi {
  background: linear-gradient(160deg, #003f8a 0%, #001f5c 40%, #002d7a 70%, #004aaa 100%);
}
.ct-team-mi::before {
  background: repeating-linear-gradient(
    45deg, #d4a843 0px, #d4a843 2px, transparent 2px, transparent 24px
  );
}
.ct-team-mi::after { background: linear-gradient(90deg, #d4a843, #f5c842, #d4a843); }
.ct-team-mi .ct-team-abbr     { color: #d4a843; }
.ct-team-mi .ct-team-fullname { color: #b8d4ff; }

/* ── CHENNAI SUPER KINGS — Yellow + Blue ─────── */
.ct-team-csk {
  background: linear-gradient(160deg, #f5b800 0%, #e6a800 35%, #ffd000 65%, #f5b800 100%);
}
.ct-team-csk::before {
  background: repeating-linear-gradient(
    -45deg, #003399 0px, #003399 3px, transparent 3px, transparent 20px
  );
}
.ct-team-csk::after { background: linear-gradient(90deg, #003399, #0044cc, #003399); }
.ct-team-csk .ct-team-abbr     { color: #003399; }
.ct-team-csk .ct-team-fullname { color: #001a66; }

/* ── ROYAL CHALLENGERS BENGALURU — Red + Black + Gold */
.ct-team-rcb {
  background: linear-gradient(160deg, #cc0000 0%, #8b0000 30%, #1a1a1a 60%, #2d0000 100%);
}
.ct-team-rcb::before {
  background: repeating-linear-gradient(
    90deg, #c8a951 0px, #c8a951 1px, transparent 1px, transparent 18px
  );
}
.ct-team-rcb::after { background: linear-gradient(90deg, #c8a951, #f0d060, #c8a951); }
.ct-team-rcb .ct-team-abbr     { color: #f0d060; }
.ct-team-rcb .ct-team-fullname { color: #ffcccc; }

/* ── KOLKATA KNIGHT RIDERS — Purple + Gold ───── */
.ct-team-kkr {
  background: linear-gradient(160deg, #3a0066 0%, #220044 35%, #4a0080 65%, #1a0033 100%);
}
.ct-team-kkr::before {
  background: repeating-linear-gradient(
    135deg, #c8a400 0px, #c8a400 2px, transparent 2px, transparent 16px
  );
}
.ct-team-kkr::after { background: linear-gradient(90deg, #c8a400, #ffd700, #c8a400); }
.ct-team-kkr .ct-team-abbr     { color: #ffd700; }
.ct-team-kkr .ct-team-fullname { color: #ddb8ff; }

/* ── DELHI CAPITALS — Blue + Red ─────────────── */
.ct-team-dc {
  background: linear-gradient(160deg, #004c97 0%, #003070 40%, #cc0000 75%, #990000 100%);
}
.ct-team-dc::before {
  background: repeating-linear-gradient(
    60deg, rgba(255,255,255,0.15) 0px, rgba(255,255,255,0.15) 2px, transparent 2px, transparent 22px
  );
}
.ct-team-dc::after { background: linear-gradient(90deg, #cc0000, #ff4444, #004c97); }
.ct-team-dc .ct-team-abbr     { color: #ffffff; }
.ct-team-dc .ct-team-fullname { color: #aaccff; }

/* ── PUNJAB KINGS — Red + Silver ─────────────── */
.ct-team-pbks {
  background: linear-gradient(160deg, #d71920 0%, #a00010 35%, #c0392b 65%, #8b0000 100%);
}
.ct-team-pbks::before {
  background: repeating-linear-gradient(
    0deg, rgba(255,255,255,0.1) 0px, rgba(255,255,255,0.1) 3px, transparent 3px, transparent 20px
  );
}
.ct-team-pbks::after { background: linear-gradient(90deg, #c0c0c0, #ffffff, #c0c0c0); }
.ct-team-pbks .ct-team-abbr     { color: #ffffff; }
.ct-team-pbks .ct-team-fullname { color: #ffcccc; }

/* ── RAJASTHAN ROYALS — Pink + Blue ──────────── */
.ct-team-rr {
  background: linear-gradient(160deg, #e91e8c 0%, #b5006e 35%, #254aa5 65%, #1a3580 100%);
}
.ct-team-rr::before {
  background: repeating-linear-gradient(
    45deg, rgba(255,255,255,0.12) 0px, rgba(255,255,255,0.12) 2px, transparent 2px, transparent 18px
  );
}
.ct-team-rr::after { background: linear-gradient(90deg, #e91e8c, #ff69b4, #254aa5); }
.ct-team-rr .ct-team-abbr     { color: #ffffff; }
.ct-team-rr .ct-team-fullname { color: #ffd6f0; }

/* ── SUNRISERS HYDERABAD — Orange + Black ─────── */
.ct-team-srh {
  background: linear-gradient(160deg, #f26522 0%, #c04a00 35%, #1a1a1a 65%, #0d0d0d 100%);
}
.ct-team-srh::before {
  background: repeating-linear-gradient(
    -60deg, rgba(255,165,0,0.2) 0px, rgba(255,165,0,0.2) 3px, transparent 3px, transparent 20px
  );
}
.ct-team-srh::after { background: linear-gradient(90deg, #f26522, #ff8c42, #f26522); }
.ct-team-srh .ct-team-abbr     { color: #ff8c00; }
.ct-team-srh .ct-team-fullname { color: #ffe0cc; }

/* ── GUJARAT TITANS — Navy + Teal ────────────── */
.ct-team-gt {
  background: linear-gradient(160deg, #1c2b4a 0%, #0f1e38 35%, #0d4f4f 65%, #082e2e 100%);
}
.ct-team-gt::before {
  background: repeating-linear-gradient(
    120deg, #c8a951 0px, #c8a951 1px, transparent 1px, transparent 20px
  );
}
.ct-team-gt::after { background: linear-gradient(90deg, #1c8c8c, #20b2aa, #1c8c8c); }
.ct-team-gt .ct-team-abbr     { color: #20b2aa; }
.ct-team-gt .ct-team-fullname { color: #aadddd; }

/* ── LUCKNOW SUPER GIANTS — Teal + Gold ──────── */
.ct-team-lsg {
  background: linear-gradient(160deg, #009999 0%, #006666 35%, #004c4c 65%, #003333 100%);
}
.ct-team-lsg::before {
  background: repeating-linear-gradient(
    30deg, #d4a843 0px, #d4a843 1px, transparent 1px, transparent 22px
  );
}
.ct-team-lsg::after { background: linear-gradient(90deg, #d4a843, #f5c842, #d4a843); }
.ct-team-lsg .ct-team-abbr     { color: #f5c842; }
.ct-team-lsg .ct-team-fullname { color: #ccffff; }

/* ══════════════════════════════════════════════
   WORLD CRICKET TEAM THEMES
   ══════════════════════════════════════════════ */

/* ── INDIA — Blue + Orange ───────────────────── */
.ct-team-ind {
  background: linear-gradient(160deg, #003580 0%, #002060 35%, #ff6200 70%, #cc4d00 100%);
}
.ct-team-ind::before {
  background: repeating-linear-gradient(
    45deg, rgba(255,255,255,0.1) 0px, rgba(255,255,255,0.1) 2px, transparent 2px, transparent 18px
  );
}
.ct-team-ind::after { background: linear-gradient(90deg, #ff6200, #ffa040, #ff6200); }
.ct-team-ind .ct-team-abbr     { color: #ffa040; }
.ct-team-ind .ct-team-fullname { color: #aac4ff; }

/* ── AUSTRALIA — Yellow + Green ──────────────── */
.ct-team-aus {
  background: linear-gradient(160deg, #00693c 0%, #004d2c 35%, #ffd700 65%, #ccac00 100%);
}
.ct-team-aus::before {
  background: repeating-linear-gradient(
    -45deg, #ffd700 0px, #ffd700 1px, transparent 1px, transparent 16px
  );
}
.ct-team-aus::after { background: linear-gradient(90deg, #00693c, #00a85a, #00693c); }
.ct-team-aus .ct-team-abbr     { color: #ffd700; }
.ct-team-aus .ct-team-fullname { color: #ccffcc; }

/* ── ENGLAND — Navy + Red ────────────────────── */
.ct-team-eng {
  background: linear-gradient(160deg, #003087 0%, #001f5c 35%, #cc0000 65%, #990000 100%);
}
.ct-team-eng::before {
  background: repeating-linear-gradient(
    90deg, rgba(255,255,255,0.12) 0px, rgba(255,255,255,0.12) 2px, transparent 2px, transparent 20px
  );
}
.ct-team-eng::after { background: linear-gradient(90deg, #cc0000, #ff3333, #cc0000); }
.ct-team-eng .ct-team-abbr     { color: #ffffff; }
.ct-team-eng .ct-team-fullname { color: #aabbff; }

/* ── PAKISTAN — Green + White ────────────────── */
.ct-team-pak {
  background: linear-gradient(160deg, #004d1a 0%, #003311 35%, #006622 65%, #1a4d00 100%);
}
.ct-team-pak::before {
  background: repeating-linear-gradient(
    60deg, rgba(255,255,255,0.15) 0px, rgba(255,255,255,0.15) 2px, transparent 2px, transparent 22px
  );
}
.ct-team-pak::after { background: linear-gradient(90deg, #ffffff, #ccffcc, #ffffff); }
.ct-team-pak .ct-team-abbr     { color: #ffffff; }
.ct-team-pak .ct-team-fullname { color: #ccffcc; }

/* ── WEST INDIES — Maroon + Yellow ──────────── */
.ct-team-wi {
  background: linear-gradient(160deg, #6b0020 0%, #4d0016 35%, #8b0026 65%, #3d0010 100%);
}
.ct-team-wi::before {
  background: repeating-linear-gradient(
    135deg, #ffc600 0px, #ffc600 2px, transparent 2px, transparent 18px
  );
}
.ct-team-wi::after { background: linear-gradient(90deg, #ffc600, #ffe066, #ffc600); }
.ct-team-wi .ct-team-abbr     { color: #ffc600; }
.ct-team-wi .ct-team-fullname { color: #ffccdd; }

/* ── NEW ZEALAND — Black + White ─────────────── */
.ct-team-nz {
  background: linear-gradient(160deg, #0a0a0a 0%, #1a1a1a 35%, #222222 65%, #111111 100%);
}
.ct-team-nz::before {
  background: repeating-linear-gradient(
    45deg, rgba(255,255,255,0.08) 0px, rgba(255,255,255,0.08) 3px, transparent 3px, transparent 20px
  );
}
.ct-team-nz::after { background: linear-gradient(90deg, #aaaaaa, #ffffff, #aaaaaa); }
.ct-team-nz .ct-team-abbr     { color: #ffffff; }
.ct-team-nz .ct-team-fullname { color: #cccccc; }

/* ── SOUTH AFRICA — Green + Yellow ──────────── */
.ct-team-sa {
  background: linear-gradient(160deg, #007a4d 0%, #005533 35%, #ffb81c 65%, #cc9200 100%);
}
.ct-team-sa::before {
  background: repeating-linear-gradient(
    30deg, #001489 0px, #001489 2px, transparent 2px, transparent 16px
  );
}
.ct-team-sa::after { background: linear-gradient(90deg, #ffb81c, #ffe080, #ffb81c); }
.ct-team-sa .ct-team-abbr     { color: #ffb81c; }
.ct-team-sa .ct-team-fullname { color: #ccffee; }

/* ── SRI LANKA — Blue + Yellow ──────────────── */
.ct-team-sl {
  background: linear-gradient(160deg, #003f8a 0%, #002255 35%, #1a6bb5 65%, #0d4a80 100%);
}
.ct-team-sl::before {
  background: repeating-linear-gradient(
    -30deg, #f5c842 0px, #f5c842 1px, transparent 1px, transparent 18px
  );
}
.ct-team-sl::after { background: linear-gradient(90deg, #f5c842, #ffe066, #f5c842); }
.ct-team-sl .ct-team-abbr     { color: #f5c842; }
.ct-team-sl .ct-team-fullname { color: #b8d4ff; }

/* ── BANGLADESH — Green + Red ────────────────── */
.ct-team-ban {
  background: linear-gradient(160deg, #006a4e 0%, #004d38 35%, #f42a41 65%, #c01830 100%);
}
.ct-team-ban::before {
  background: repeating-linear-gradient(
    90deg, rgba(255,255,255,0.1) 0px, rgba(255,255,255,0.1) 2px, transparent 2px, transparent 20px
  );
}
.ct-team-ban::after { background: linear-gradient(90deg, #f42a41, #ff6677, #f42a41); }
.ct-team-ban .ct-team-abbr     { color: #ffffff; }
.ct-team-ban .ct-team-fullname { color: #ccffee; }

/* ── AFGHANISTAN — Blue + Red ────────────────── */
.ct-team-afg {
  background: linear-gradient(160deg, #002366 0%, #001544 35%, #cc0000 65%, #990000 100%);
}
.ct-team-afg::before {
  background: repeating-linear-gradient(
    45deg, #009a44 0px, #009a44 2px, transparent 2px, transparent 16px
  );
}
.ct-team-afg::after { background: linear-gradient(90deg, #009a44, #00cc55, #009a44); }
.ct-team-afg .ct-team-abbr     { color: #ffffff; }
.ct-team-afg .ct-team-fullname { color: #aabbff; }

/* ── ZIMBABWE — Red + Green + Yellow ─────────── */
.ct-team-zim {
  background: linear-gradient(160deg, #006400 0%, #004d00 30%, #cc0000 60%, #8b0000 100%);
}
.ct-team-zim::before {
  background: repeating-linear-gradient(
    60deg, #ffd200 0px, #ffd200 2px, transparent 2px, transparent 18px
  );
}
.ct-team-zim::after { background: linear-gradient(90deg, #ffd200, #ffee66, #ffd200); }
.ct-team-zim .ct-team-abbr     { color: #ffd200; }
.ct-team-zim .ct-team-fullname { color: #ccffcc; }

/* ── IRELAND — Green + White ─────────────────── */
.ct-team-ire {
  background: linear-gradient(160deg, #169b62 0%, #0d6b44 35%, #107a4c 65%, #0a5233 100%);
}
.ct-team-ire::before {
  background: repeating-linear-gradient(
    -45deg, rgba(255,255,255,0.15) 0px, rgba(255,255,255,0.15) 2px, transparent 2px, transparent 18px
  );
}
.ct-team-ire::after { background: linear-gradient(90deg, #ffffff, #ccffcc, #ffffff); }
.ct-team-ire .ct-team-abbr     { color: #ffffff; }
.ct-team-ire .ct-team-fullname { color: #ccffee; }
