/* ==========================================================================
   EsportsKing Public CSS – Exact screenshot design
   ========================================================================== */

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

:root {
  --ek-red:        #e63946;
  --ek-red-dk:     #c1121f;
  --ek-red-glow:   rgba(230,57,70,.55);
  --ek-red-border: rgba(230,57,70,.45);
  --ek-red-soft:   rgba(230,57,70,.12);
  --ek-card-bg:    #0f0f13;
  --ek-modal-bg:   #13131a;
  --ek-text:       #e8e8f0;
  --ek-muted:      #7a7a99;
  --ek-success:    #2dce89;
  --ek-radius:     14px;
  --ek-trans:      all .3s ease;
}

/* ── Base section ── */
.ek-section {
  font-family: 'Inter', sans-serif;
  color: var(--ek-text);
  max-width: 1120px;
  margin: 0 auto;
  padding: 28px 16px 48px;
}

.ek-section-header { text-align: center; margin-bottom: 40px; }

.ek-section-title {
  font-family: 'Rajdhani', sans-serif;
  font-size: 2.2rem; font-weight: 700;
  color: #fff; letter-spacing: 2px; margin: 0 0 6px;
  text-shadow: 0 0 30px var(--ek-red-glow);
}

.ek-section-subtitle { color: var(--ek-muted); font-size: 1rem; margin: 0 0 16px; }

/* Wallet balance strip */
.ek-wallet-strip {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--ek-red-soft); border: 1px solid var(--ek-red-border);
  border-radius: 30px; padding: 6px 20px;
  font-size: .9rem; color: var(--ek-muted);
}
.ek-balance-val { color: var(--ek-red); font-weight: 700; font-size: 1rem; }

/* Empty */
.ek-empty { text-align: center; padding: 60px 20px; color: var(--ek-muted); }
.ek-empty-icon { font-size: 3.5rem; margin-bottom: 14px; }

/* ══ MATCHES GRID ══ */
.ek-matches-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
  gap: 28px;
}

/* ── Match Card ── */
.ek-match-card {
  background: var(--ek-card-bg);
  border: 1px solid var(--ek-red-border);
  border-radius: var(--ek-radius);
  padding: 22px 22px 18px;
  display: flex; flex-direction: column;
  box-shadow:
    0 0 0 1px rgba(230,57,70,.1),
    0 0 18px rgba(230,57,70,.22),
    0 0 50px rgba(230,57,70,.07),
    0 8px 40px rgba(0,0,0,.6);
  transition: var(--ek-trans);
}

.ek-match-card:hover {
  transform: translateY(-5px);
  border-color: rgba(230,57,70,.75);
  box-shadow:
    0 0 0 1px rgba(230,57,70,.3),
    0 0 30px rgba(230,57,70,.45),
    0 0 70px rgba(230,57,70,.14),
    0 12px 50px rgba(0,0,0,.7);
}

.ek-match-full { opacity: .6; }

/* Card top row: game badge + status pill */
.ek-card-top {
  display: flex; justify-content: space-between;
  align-items: center; margin-bottom: 14px;
}

.ek-game-pill {
  background: var(--ek-red-soft); border: 1px solid var(--ek-red-border);
  color: var(--ek-red); font-size: .72rem; font-weight: 700;
  letter-spacing: 1.2px; text-transform: uppercase;
  padding: 4px 14px; border-radius: 20px;
}

.ek-status-pill {
  background: var(--ek-red-soft); border: 1px solid var(--ek-red-border);
  color: var(--ek-red); font-size: .68rem; font-weight: 700;
  letter-spacing: .8px; text-transform: uppercase;
  padding: 4px 12px; border-radius: 20px;
}

/* Match title */
.ek-match-title {
  font-family: 'Rajdhani', sans-serif;
  font-size: 1.45rem; font-weight: 700; color: #fff;
  margin: 0 0 16px; letter-spacing: .5px;
}

/* Meta list */
.ek-meta-list { list-style: none; margin: 0 0 14px; padding: 0; display: flex; flex-direction: column; gap: 9px; }

.ek-meta-item { display: flex; align-items: center; gap: 10px; font-size: .9rem; color: var(--ek-muted); }
.ek-meta-item strong { color: var(--ek-text); }

/* SVG icon base */
.ek-icon {
  display: inline-block; width: 20px; height: 20px;
  background-size: contain; background-repeat: no-repeat;
  background-position: center; flex-shrink: 0;
}

/* Icon definitions using SVG data URI (red #e63946) */
.ek-icon-cal {
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='%23e63946' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M17 12h-5v5h5v-5zM16 1v2H8V1H6v2H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2h-1V1h-2zm3 18H5V8h14v11z'/%3E%3C/svg%3E");
}

.ek-icon-ticket {
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='%23e63946' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20 12c0-1.1.9-2 2-2V6c0-1.1-.9-2-2-2H4c-1.1 0-2 .9-2 2v4c1.1 0 2 .9 2 2s-.9 2-2 2v4c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2v-4c-1.1 0-2-.9-2-2z'/%3E%3C/svg%3E");
}

.ek-icon-trophy {
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='%23e63946' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M19 5h-2V3H7v2H5c-1.1 0-2 .9-2 2v1c0 2.55 1.92 4.63 4.39 4.94.63 1.5 1.98 2.63 3.61 2.96V19H7v2h10v-2h-4v-3.1c1.63-.33 2.98-1.46 3.61-2.96C19.08 12.63 21 10.55 21 8V7c0-1.1-.9-2-2-2zM5 8V7h2v3.82C5.84 10.4 5 9.3 5 8zm14 0c0 1.3-.84 2.4-2 2.82V7h2v1z'/%3E%3C/svg%3E");
}

.ek-icon-people {
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='%23e63946' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0-3 1.34-3 3s1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5z'/%3E%3C/svg%3E");
}

/* Slots row */
.ek-meta-slots { justify-content: flex-start; }

.ek-slots-count {
  margin-left: auto; font-weight: 700;
  font-size: .88rem; color: var(--ek-red);
}

.ek-slots-critical { color: #ff8c00 !important; }

/* Slots bar */
.ek-slots-bar {
  height: 3px; background: rgba(255,255,255,.06);
  border-radius: 2px; overflow: hidden; margin-bottom: 14px;
}

.ek-slots-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--ek-red-dk), var(--ek-red), #ff6b6b);
  border-radius: 2px; transition: width .7s ease;
}

/* Description */
.ek-match-desc {
  font-size: .85rem; color: var(--ek-muted);
  line-height: 1.5; margin: 0 0 16px; flex: 1;
}

/* Card footer */
.ek-card-foot { margin-top: auto; }

/* ══ BUTTONS ══ */
.ek-btn {
  display: block; width: 100%; text-align: center;
  font-family: 'Rajdhani', sans-serif; font-weight: 900;
  font-size: 1.05rem; letter-spacing: 2.5px; text-transform: uppercase;
  border: none; cursor: pointer; text-decoration: none;
  transition: var(--ek-trans); padding: 15px 20px;
}

/* ★ Signature hexagon JOIN MATCH button matching screenshot ★ */
.ek-btn-join {
  background: linear-gradient(135deg, #ff1f32, var(--ek-red-dk));
  color: #fff !important;
  clip-path: polygon(22px 0%, calc(100% - 22px) 0%, 100% 50%, calc(100% - 22px) 100%, 22px 100%, 0% 50%);
  padding: 16px 50px;
  box-shadow: 0 0 28px rgba(230,57,70,.75), 0 0 65px rgba(230,57,70,.25), inset 0 1px 0 rgba(255,255,255,.15);
}

.ek-btn-join:hover {
  background: linear-gradient(135deg, #ff3347, #d91a2a);
  box-shadow: 0 0 45px rgba(230,57,70,.95), 0 0 100px rgba(230,57,70,.4);
  transform: translateY(-2px);
}

.ek-btn-joined {
  background: rgba(230,57,70,.1); color: var(--ek-red) !important;
  border: 1px solid rgba(230,57,70,.35); border-radius: 8px; cursor: default;
}

.ek-btn-full, .ek-btn-disabled {
  background: rgba(120,120,150,.1); color: var(--ek-muted) !important;
  border: 1px solid rgba(120,120,150,.25); border-radius: 8px; cursor: not-allowed;
}

/* ══ MODAL ══ */
.ek-modal {
  position: fixed; inset: 0; z-index: 99999;
  display: flex; align-items: center; justify-content: center; padding: 16px;
}

.ek-modal-overlay {
  position: absolute; inset: 0;
  background: rgba(0,0,0,.85); backdrop-filter: blur(8px);
}

.ek-modal-box {
  position: relative; background: var(--ek-modal-bg);
  border: 1px solid var(--ek-red-border); border-radius: 18px;
  box-shadow: 0 0 0 1px rgba(230,57,70,.1), 0 20px 60px rgba(0,0,0,.7), 0 0 40px rgba(230,57,70,.18);
  width: 100%; max-width: 460px; padding: 32px;
  animation: ekModalIn .35s cubic-bezier(.175,.885,.32,1.275);
}

@keyframes ekModalIn {
  from { opacity: 0; transform: scale(.88) translateY(24px); }
  to   { opacity: 1; transform: scale(1) translateY(0); }
}

.ek-modal-close {
  position: absolute; top: 14px; right: 14px;
  background: rgba(255,255,255,.05); border: none; color: var(--ek-muted);
  font-size: 1rem; width: 32px; height: 32px; border-radius: 50%;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: var(--ek-trans);
}
.ek-modal-close:hover { background: var(--ek-red); color: #fff; }

.ek-modal-header { text-align: center; margin-bottom: 18px; }

.ek-modal-header h2 {
  font-family: 'Rajdhani', sans-serif; font-size: 1.6rem;
  font-weight: 700; color: #fff; margin: 0 0 4px;
}

.ek-modal-subtitle { color: var(--ek-muted); font-size: .9rem; margin: 0; }

.ek-modal-fee-info {
  display: flex; gap: 10px; margin-bottom: 20px; justify-content: center;
}

.ek-fee-chip, .ek-balance-chip {
  background: var(--ek-red-soft); border: 1px solid var(--ek-red-border);
  border-radius: 8px; padding: 8px 16px; font-size: .85rem;
  color: var(--ek-muted); flex: 1; text-align: center;
}

.ek-fee-highlight   { color: var(--ek-red);     font-size: .95rem; font-weight: 700; }
.ek-balance-highlight { color: var(--ek-success); font-size: .95rem; font-weight: 700; }

/* Form groups */
.ek-form-group { margin-bottom: 14px; }

.ek-form-group label {
  display: block; font-size: .78rem; font-weight: 600;
  color: var(--ek-muted); text-transform: uppercase;
  letter-spacing: .5px; margin-bottom: 5px;
}

.ek-form-group input, .ek-form-group select, .ek-form-group textarea {
  width: 100%; background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.09); border-radius: 8px;
  color: var(--ek-text); font-family: 'Inter', sans-serif;
  font-size: .92rem; padding: 10px 14px;
  box-sizing: border-box; outline: none; transition: var(--ek-trans);
}

.ek-form-group input:focus, .ek-form-group select:focus {
  border-color: var(--ek-red); box-shadow: 0 0 0 3px rgba(230,57,70,.15);
}

.ek-form-group input:disabled { opacity: .45; cursor: not-allowed; }
.ek-form-group small { display: block; font-size: .73rem; color: var(--ek-muted); margin-top: 4px; }

.ek-modal-actions { display: flex; gap: 10px; margin-top: 18px; }
.ek-modal-actions .ek-btn { flex: 1; }
.ek-modal-actions .ek-btn-join { clip-path: none; border-radius: 10px; padding: 13px; }
.ek-modal-actions .ek-btn-secondary { border-radius: 10px; padding: 13px; background: rgba(255,255,255,.05); color: var(--ek-text) !important; border: 1px solid var(--ek-red-border); }

/* Alerts */
.ek-alert { padding: 11px 14px; border-radius: 8px; font-size: .86rem; margin-top: 10px; }
.ek-alert-error   { background: rgba(230,57,70,.1);   border: 1px solid rgba(230,57,70,.3);   color: #ff6b7a; }
.ek-alert-success { background: rgba(45,206,137,.1);  border: 1px solid rgba(45,206,137,.3);  color: var(--ek-success); }

/* ══ WALLET SHORTCODE ══ */
.ek-wallet-hero {
  display: flex; align-items: center; gap: 24px;
  background: var(--ek-card-bg); border: 1px solid var(--ek-red-border);
  border-radius: var(--ek-radius); padding: 24px 28px; margin-bottom: 32px;
  box-shadow: 0 0 18px rgba(230,57,70,.15), 0 8px 32px rgba(0,0,0,.5);
}

.ek-wallet-avatar img { border-radius: 50%; border: 3px solid var(--ek-red); box-shadow: 0 0 20px rgba(230,57,70,.35); }
.ek-wallet-info h2 { font-family: 'Rajdhani', sans-serif; font-size: 1.4rem; color: #fff; margin: 0 0 12px; }

.ek-wallet-balance-card {
  display: flex; flex-direction: column; background: var(--ek-red-soft);
  border: 1px solid var(--ek-red-border); border-radius: 8px; padding: 12px 20px; min-width: 200px;
}

.ek-balance-label { font-size: .78rem; color: var(--ek-muted); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 4px; }
.ek-balance-amount { font-family: 'Rajdhani', sans-serif; font-size: 2rem; font-weight: 700; color: var(--ek-success); }

.ek-tx-list { display: flex; flex-direction: column; gap: 10px; }

.ek-tx-item {
  display: flex; align-items: center; gap: 14px;
  background: var(--ek-card-bg); border: 1px solid rgba(255,255,255,.05);
  border-radius: 10px; padding: 14px 18px; transition: var(--ek-trans);
}
.ek-tx-item:hover { border-color: var(--ek-red-border); transform: translateX(4px); }
.ek-tx-credit { border-left: 3px solid var(--ek-success); }
.ek-tx-debit  { border-left: 3px solid var(--ek-red); }
.ek-tx-icon { font-size: 1.3rem; width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: rgba(255,255,255,.04); flex-shrink: 0; }
.ek-tx-details { flex: 1; min-width: 0; }
.ek-tx-desc { font-size: .9rem; color: var(--ek-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ek-tx-date { font-size: .76rem; color: var(--ek-muted); margin-top: 2px; }
.ek-tx-amount { font-family: 'Rajdhani', sans-serif; font-size: 1.05rem; font-weight: 700; white-space: nowrap; }
.ek-tx-balance { font-size: .76rem; color: var(--ek-muted); white-space: nowrap; }

/* ══ LEADERBOARD ══ */
.ek-leaderboard-wrap { max-width: 800px; margin: 0 auto; }
.ek-podium { display: flex; justify-content: center; align-items: flex-end; gap: 16px; margin-bottom: 36px; padding: 24px; }
.ek-podium-item { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; }
.ek-podium-1 { order: 2; } .ek-podium-2 { order: 1; } .ek-podium-3 { order: 3; }
.ek-podium-crown { font-size: 1.5rem; animation: crownFloat 2s ease-in-out infinite; }
@keyframes crownFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
.ek-podium-avatar img { border-radius: 50%; }
.ek-podium-1 .ek-podium-avatar img { border: 3px solid gold; box-shadow: 0 0 20px rgba(255,215,0,.4); }
.ek-podium-name { font-family: 'Rajdhani', sans-serif; font-size: .95rem; font-weight: 700; color: #fff; }
.ek-podium-earnings { font-size: .85rem; color: var(--ek-success); font-weight: 600; }
.ek-ranking-list { display: flex; flex-direction: column; gap: 8px; }
.ek-rank-item { display: flex; align-items: center; gap: 14px; background: var(--ek-card-bg); border: 1px solid rgba(255,255,255,.05); border-radius: 10px; padding: 12px 18px; transition: var(--ek-trans); }
.ek-rank-item:hover { border-color: var(--ek-red-border); transform: translateX(4px); }
.ek-rank-current { border-color: var(--ek-red) !important; box-shadow: 0 0 18px rgba(230,57,70,.25); }
.ek-rank-pos { width: 44px; text-align: center; flex-shrink: 0; }
.ek-rank-badge { display: inline-block; padding: 4px 8px; border-radius: 6px; font-size: .8rem; font-weight: 700; background: rgba(255,255,255,.07); color: var(--ek-muted); }
.ek-rank-badge.gold   { background: rgba(255,215,0,.15);    color: gold; }
.ek-rank-badge.silver { background: rgba(192,192,192,.15);  color: silver; }
.ek-rank-badge.bronze { background: rgba(205,127,50,.15);   color: #cd7f32; }
.ek-rank-avatar img { border-radius: 50%; }
.ek-rank-info { flex: 1; }
.ek-rank-name { font-weight: 600; color: #fff; font-size: .95rem; }
.ek-rank-stats { font-size: .76rem; color: var(--ek-muted); margin-top: 2px; }
.ek-you-badge { display: inline-block; background: var(--ek-red); color: #fff; font-size: .65rem; font-weight: 700; padding: 2px 7px; border-radius: 10px; margin-left: 6px; vertical-align: middle; }
.ek-rank-earnings { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.ek-earnings-amount { font-family: 'Rajdhani', sans-serif; font-size: 1.1rem; font-weight: 700; color: var(--ek-success); }
.ek-earnings-label { font-size: .72rem; color: var(--ek-muted); }

/* ══ AUTH FORMS (Native) ══ */
.ek-auth-container { max-width: 800px; margin: 40px auto; background: var(--ek-card-bg); padding: 30px 40px; border-radius: 14px; border: 1px solid var(--ek-red-border); box-shadow: 0 0 40px rgba(0,0,0,.6); }

/* ══ ADMIN ENHANCEMENTS ══ */
.ek-prize-summary-bar {
  display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 20px;
}
.ek-prize-item {
  flex: 1; min-width: 140px; background: var(--ek-card-bg); border: 1px solid var(--ek-red-border);
  border-radius: 10px; padding: 14px 18px; text-align: center; font-size: 0.85rem; color: var(--ek-muted);
}
.ek-prize-item strong { display: block; font-size: 1.2rem; font-weight: 700; margin-top: 4px; color: #fff; }
.ek-prize-1st strong { color: gold; }
.ek-prize-2nd strong { color: silver; }
.ek-prize-3rd strong { color: #cd7f32; }

.ek-badge-pos { background: rgba(230, 57, 70, 0.15); color: var(--ek-red); border: 1px solid var(--ek-red-border); }
.ek-winner-row { background: rgba(230, 57, 70, 0.03) !important; }

.ek-select-sm { 
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1); 
  border-radius: 6px; color: #fff; padding: 5px 8px; font-size: 0.85rem; outline: none;
}
.ek-select-sm option { background: var(--ek-modal-bg); color: #fff; }

.ek-admin-notice { padding: 10px 14px; border-radius: 8px; font-size: 0.86rem; margin-bottom: 12px; }
.ek-admin-notice.success { background: rgba(45, 206, 137, 0.1); color: #2dce89; border: 1px solid rgba(45, 206, 137, 0.3); }
.ek-admin-notice.error { background: rgba(230, 57, 70, 0.1); color: #ff6b7a; border: 1px solid rgba(230, 57, 70, 0.3); }
.ek-login-container { max-width: 480px; }
.ek-auth-title { font-family: 'Rajdhani', sans-serif; font-size: 2.2rem; font-weight: 800; color: #fff; letter-spacing: 1px; margin: 0 0 5px; text-transform: uppercase; }
.ek-auth-title-line { width: 100px; height: 4px; background: linear-gradient(90deg, var(--ek-red) 30%, transparent 30%, transparent 35%, var(--ek-red) 35%, var(--ek-red) 45%, transparent 45%, transparent 50%, var(--ek-red) 50%, var(--ek-red) 55%, transparent 55%, transparent 60%, var(--ek-red) 60%); margin-bottom: 30px; }
.ek-auth-grid { display: flex; flex-wrap: wrap; gap: 20px; justify-content: space-between; }
.ek-input-group { position: relative; margin-bottom: 20px; width: calc(50% - 10px); }
.ek-login-container .ek-input-group { width: 100%; }
.ek-input-group input, .ek-input-group select { width: 100% !important; background: rgba(255,255,255,.02) !important; border: 1px solid rgba(255,255,255,.08) !important; border-radius: 6px !important; color: #e8e8f0 !important; padding: 15px 15px 15px 50px !important; font-size: 1rem !important; transition: all .3s ease; box-sizing: border-box !important; margin: 0 !important; height: auto !important; line-height: normal !important; }
.ek-input-group input:focus, .ek-input-group select:focus { border-color: #e63946 !important; box-shadow: 0 0 0 1px #e63946 !important; outline: none !important; }

/* Icons */
.ek-input-group::before { content: ''; position: absolute !important; left: 16px !important; top: 50% !important; transform: translateY(-50%) !important; width: 20px !important; height: 20px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; z-index: 2 !important; pointer-events: none; }
.ek-input-group::after { content: ''; position: absolute !important; left: 42px !important; top: 12px !important; bottom: 12px !important; width: 1px !important; background: rgba(255,255,255,.1) !important; z-index: 2 !important; pointer-events: none; }

/* Form description and Eye btn */
.ek-input-desc { display: block; color: var(--ek-muted); font-size: 0.75rem; margin-top: 5px; margin-left: 50px; }
.ek-input-group.ek-has-desc { margin-bottom: 10px; }
.ek-eye-btn { position: absolute !important; right: 16px !important; top: 50% !important; transform: translateY(-50%) !important; width: 20px !important; height: 20px !important; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237a7a99' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'%3E%3C/path%3E%3Ccircle cx='12' cy='12' r='3'%3E%3C/circle%3E%3C/svg%3E") no-repeat center !important; border: none !important; cursor: pointer !important; opacity: 0.7; z-index: 3 !important; }
.ek-eye-btn:hover { opacity: 1; }
.ek-help-icon { position: absolute !important; right: 16px !important; top: 50% !important; transform: translateY(-50%) !important; width: 20px !important; height: 20px !important; border: 1px solid var(--ek-muted) !important; border-radius: 50% !important; color: var(--ek-muted) !important; font-size: 0.7rem !important; display: flex !important; align-items: center !important; justify-content: center !important; cursor: help !important; }

/* SVG Icon URLs */
.ek-icon-user::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e63946' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'%3E%3C/path%3E%3Ccircle cx='12' cy='7' r='4'%3E%3C/circle%3E%3C/svg%3E"); }
.ek-icon-mail::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e63946' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z'%3E%3C/path%3E%3Cpolyline points='22,6 12,13 2,6'%3E%3C/polyline%3E%3C/svg%3E"); }
.ek-icon-lock::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e63946' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='11' width='18' height='11' rx='2' ry='2'%3E%3C/rect%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'%3E%3C/path%3E%3C/svg%3E"); }
.ek-icon-phone::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e63946' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='2' width='14' height='20' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='12' y1='18' x2='12' y2='18'%3E%3C/line%3E%3C/svg%3E"); }
.ek-icon-calendar::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e63946' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E"); }
.ek-icon-game::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e63946' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='6' width='20' height='12' rx='2' ry='2'%3E%3C/rect%3E%3Cpath d='M6 12h4'%3E%3C/path%3E%3Cpath d='M8 10v4'%3E%3C/path%3E%3Cline x1='15' y1='13' x2='15.01' y2='13'%3E%3C/line%3E%3Cline x1='18' y1='11' x2='18.01' y2='11'%3E%3C/line%3E%3C/svg%3E"); }
.ek-icon-id::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e63946' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2' ry='2'%3E%3C/rect%3E%3Cpath d='M6 8h.01'%3E%3C/path%3E%3Cpath d='M10 8h8'%3E%3C/path%3E%3Cpath d='M6 12h.01'%3E%3C/path%3E%3Cpath d='M10 12h8'%3E%3C/path%3E%3Cpath d='M6 16h.01'%3E%3C/path%3E%3Cpath d='M10 16h8'%3E%3C/path%3E%3C/svg%3E"); }
.ek-icon-shield::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e63946' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z'%3E%3C/path%3E%3C/svg%3E"); }

.ek-terms-group { width: 100%; display: flex; align-items: center; margin-bottom: 20px; }
.ek-terms-group input { appearance: none; -webkit-appearance: none; width: 22px; height: 22px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.2); border-radius: 4px; cursor: pointer; margin-right: 10px; position: relative; transition: var(--ek-trans); }
.ek-terms-group input:checked { background: rgba(230,57,70,.15); border-color: var(--ek-red); }
.ek-terms-group input:checked::after { content: ''; position: absolute; left: 7px; top: 2px; width: 5px; height: 11px; border: solid var(--ek-red); border-width: 0 2px 2px 0; transform: rotate(45deg); }
.ek-terms-group label { color: #e8e8f0; font-size: 0.9rem; font-weight: normal; }
.ek-terms-group a { color: var(--ek-red); text-decoration: none; font-weight: 600; }

.ek-auth-btn { background-color: #a1000b; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ff3347'%3E%3Cpath d='M7 5l7 7-7 7 2 2 9-9-9-9z'/%3E%3Cpath d='M1 5l7 7-7 7 2 2 9-9-9-9z'/%3E%3C/svg%3E"), linear-gradient(90deg, #6b0208 0%, #d40f1c 25%, #ff1f32 50%, #d40f1c 75%, #6b0208 100%); background-repeat: no-repeat; background-position: right 25px center, center; background-size: 24px, cover; color: #fff; border: 1px solid #ff1f32; padding: 18px 30px; font-family: 'Rajdhani', sans-serif; font-weight: 800; font-size: 1.3rem; letter-spacing: 2px; text-transform: uppercase; cursor: pointer; width: 100%; transition: var(--ek-trans); box-shadow: 0 0 20px rgba(230,57,70,.2), inset 0 0 20px rgba(0,0,0,.5); clip-path: polygon(15px 0, 100% 0, 100% calc(100% - 15px), calc(100% - 15px) 100%, 0 100%, 0 15px); margin-top: 15px; }
.ek-auth-btn:hover { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M7 5l7 7-7 7 2 2 9-9-9-9z'/%3E%3Cpath d='M1 5l7 7-7 7 2 2 9-9-9-9z'/%3E%3C/svg%3E"), linear-gradient(90deg, #8a030b 0%, #e81120 25%, #ff3347 50%, #e81120 75%, #8a030b 100%); box-shadow: 0 0 30px rgba(230,57,70,.5), inset 0 0 10px rgba(0,0,0,.3); border-color: #ff3347; }
.ek-auth-btn:disabled { opacity: 0.6; cursor: not-allowed; }

.ek-auth-or { text-align: center; position: relative; margin: 30px 0; color: var(--ek-muted); font-size: 0.9rem; font-weight: 600; text-transform: uppercase; }
.ek-auth-or::before, .ek-auth-or::after { content: ''; position: absolute; top: 50%; width: 45%; height: 1px; background: rgba(255,255,255,.1); }
.ek-auth-or::before { left: 0; } .ek-auth-or::after { right: 0; }
.ek-auth-footer { text-align: center; color: #e8e8f0; font-size: 0.9rem; }
.ek-auth-footer a { color: var(--ek-red); font-weight: 700; text-decoration: none; margin-left: 5px; }

/* Utility */
.ek-text-success { color: var(--ek-success); }
.ek-text-danger  { color: var(--ek-red); }

/* Responsive */
@media (max-width: 640px) {
  .ek-matches-grid { grid-template-columns: 1fr; }
  .ek-modal-actions { flex-direction: column; }
  .ek-wallet-hero { flex-direction: column; text-align: center; }
  .ek-modal-fee-info { flex-direction: column; }
}
