/* JD Community — theme independent.
   Inherits the host theme's font. Only the accent colour is configurable. */

.jdc{
  --jdc-accent:#00FF66;
  --jdc-bg:rgba(0,0,0,.03);
  --jdc-border:rgba(0,0,0,.12);
  --jdc-ink:inherit;
  --jdc-muted:rgba(0,0,0,.55);
  border:1px solid var(--jdc-border);
  border-radius:12px;
  overflow:hidden;
  margin:0 0 20px;
  background:var(--jdc-bg);
  font-size:15px;
  line-height:1.5;
}
/* dark themes */
@media (prefers-color-scheme: dark){
  .jdc{--jdc-bg:rgba(255,255,255,.04);--jdc-border:rgba(255,255,255,.14);--jdc-muted:rgba(255,255,255,.6)}
}
body.jdc-dark .jdc,
.jdc.is-dark{--jdc-bg:rgba(255,255,255,.04);--jdc-border:rgba(255,255,255,.14);--jdc-muted:rgba(255,255,255,.6)}

.jdc-head{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--jdc-border);flex-wrap:wrap}
.jdc-head h3{margin:0;font-size:15px;text-transform:uppercase;letter-spacing:.08em}
.jdc-pill{margin-left:auto;font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  border:1px solid var(--jdc-border);border-radius:999px;padding:4px 11px;color:var(--jdc-muted);white-space:nowrap}
.jdc-pill.jdc-live{color:var(--jdc-accent);border-color:var(--jdc-accent)}
.jdc-body{padding:4px 18px 18px}
.jdc-empty{padding:32px 22px;text-align:center}
.jdc-empty h4{margin:0 0 8px;font-size:17px}
.jdc-empty p{margin:0;color:var(--jdc-muted);font-size:14px}

/* table */
.jdc-tablewrap{overflow-x:auto}
.jdc-table{width:100%;border-collapse:collapse;margin:0}
.jdc-table th{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--jdc-muted);
  text-align:left;padding:11px 18px;border-bottom:1px solid var(--jdc-border);font-weight:700}
.jdc-table td{padding:12px 18px;border-bottom:1px solid var(--jdc-border);font-size:14px}
.jdc-table tr:last-child td{border-bottom:none}
.jdc-table th:last-child,.jdc-table td:last-child{text-align:right}
.jdc-rank{width:44px;font-weight:700}
.jdc-mgr b{display:block;font-size:14px;line-height:1.25}
.jdc-mgr span{display:block;font-size:12px;color:var(--jdc-muted);margin-top:2px}
.jdc-total{font-weight:700}
.jdc-podium{background:color-mix(in srgb, var(--jdc-accent) 8%, transparent)}
.jdc-podium .jdc-rank,.jdc-podium .jdc-total{color:var(--jdc-accent)}

/* join */
.jdc-join{padding:18px}
.jdc-code{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  border:1px dashed var(--jdc-accent);border-radius:10px;padding:13px 15px;margin-bottom:14px}
.jdc-code>span{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--jdc-muted)}
.jdc-code>b{font-size:22px;letter-spacing:.14em;color:var(--jdc-accent)}
.jdc-copy{margin-left:auto;background:transparent;border:1px solid var(--jdc-border);
  border-radius:999px;padding:7px 15px;cursor:pointer;font-size:11px;text-transform:uppercase;letter-spacing:.09em}
.jdc-actions{display:flex;gap:9px;flex-wrap:wrap}
.jdc-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  background:var(--jdc-accent);color:#000;border:none;border-radius:10px;padding:13px 22px;
  font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;
  text-decoration:none;cursor:pointer;transition:transform .2s ease,opacity .2s ease}
.jdc-btn:hover{transform:translateY(-2px);opacity:.92;color:#000}
.jdc-btn-alt{background:transparent;color:inherit;border:1px solid var(--jdc-border)}
.jdc-btn-alt:hover{border-color:var(--jdc-accent);color:inherit}
.jdc-note{font-size:12px;color:var(--jdc-muted);margin:12px 0 0}

/* prizes */
.jdc-prizes{border:none;background:transparent;display:flex;flex-direction:column;gap:9px}
.jdc-prize{display:flex;gap:16px;flex-wrap:wrap;border:1px solid var(--jdc-border);
  border-radius:10px;padding:14px 16px;background:var(--jdc-bg)}
.jdc-prize-who{flex:0 0 180px}
.jdc-prize-who b{display:block;font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--jdc-accent)}
.jdc-prize-who span{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--jdc-muted);margin-top:2px}
.jdc-prize-what{flex:1 1 200px;min-width:0}
.jdc-prize-what b{display:block;font-size:14px}
.jdc-prize-what span{display:block;font-size:12px;color:var(--jdc-muted);margin-top:2px}

/* predictor */
.jdc-fix{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;
  padding:15px 0;border-bottom:1px solid var(--jdc-border)}
.jdc-fix:last-of-type{border-bottom:none}
.jdc-team{display:flex;align-items:center;gap:9px;min-width:0}
.jdc-team.jdc-away{justify-content:flex-end}
.jdc-crest{width:30px;height:30px;border-radius:50%;border:1px solid var(--jdc-border);
  display:grid;place-items:center;font-size:9px;font-weight:700;color:var(--jdc-muted);flex:0 0 auto}
.jdc-team b{font-size:13px;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jdc-score{display:flex;align-items:center;gap:6px}
.jdc-inp{width:46px;height:44px;text-align:center;border:1px solid var(--jdc-border);
  border-radius:9px;font-size:17px;font-weight:700;background:transparent;color:inherit;-moz-appearance:textfield}
.jdc-inp::-webkit-outer-spin-button,.jdc-inp::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.jdc-inp:focus{outline:none;border-color:var(--jdc-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--jdc-accent) 20%,transparent)}
.jdc-dash{color:var(--jdc-muted);font-weight:700}
.jdc-actual{font-size:18px;font-weight:700;white-space:nowrap}
.jdc-ko{grid-column:1/-1;font-size:11px;color:var(--jdc-muted);text-transform:uppercase;letter-spacing:.08em;margin-top:-6px}
.jdc-yours{grid-column:1/-1;display:flex;align-items:center;gap:9px;margin-top:4px;font-size:12px;color:var(--jdc-muted)}
.jdc-pts{margin-left:auto;font-size:11px;font-weight:700;padding:3px 9px;border-radius:999px;border:1px solid var(--jdc-border)}
.jdc-pts.jdc-p3{color:var(--jdc-accent);border-color:var(--jdc-accent)}
.jdc-submit{width:100%;margin-top:16px}
.jdc-msg{font-size:12px;margin:10px 0 0;text-align:center;min-height:1em}
.jdc-msg.jdc-ok{color:var(--jdc-accent)}
.jdc-msg.jdc-err{color:#d63638}
.jdc-rules{display:flex;gap:16px;flex-wrap:wrap;padding:12px 18px;border-top:1px solid var(--jdc-border)}
.jdc-rules span{font-size:12px;color:var(--jdc-muted)}
.jdc-rules b{color:var(--jdc-accent)}

/* card */
.jdc-card{display:flex;align-items:center;gap:14px;padding:15px 17px;text-decoration:none;color:inherit}
.jdc-card:hover{border-color:var(--jdc-accent);color:inherit}
.jdc-card-l{display:flex;flex-direction:column;gap:3px;min-width:0}
.jdc-card-l b{font-size:13px;text-transform:uppercase;letter-spacing:.06em}
.jdc-card-l i{font-style:normal;font-size:12px;color:var(--jdc-muted)}

@media(max-width:600px){
  .jdc-team b{font-size:11px}
  .jdc-crest{width:26px;height:26px;font-size:8px}
  .jdc-inp{width:40px;height:40px;font-size:16px}
  .jdc-table th,.jdc-table td{padding:10px 12px}
  .jdc-body{padding:2px 13px 14px}
  .jdc-head{padding:12px 13px}
  .jdc-prize-who{flex:1 1 100%}
}