/* Veikkaus Results styles - mobile first */
.vr-wrap { max-width: 960px; margin: 0 auto; padding: 1rem; }
.vr-title { font-size: clamp(1.4rem, 2.5vw, 2rem); margin: 0 0 .25rem; }
.vr-meta { color: #666; font-size: .95rem; margin-bottom: .75rem; }

/* Numeropallot */
.vr-balls { display: flex; flex-wrap: wrap; gap: .5rem; margin: .5rem 0 1rem; }
.vr-ball { display:inline-flex; align-items:center; justify-content:center;
  width: 2.5rem; height: 2.5rem; border-radius: 50%; background: #154a7d; color:#fff; font-weight: 700; }
.vr-ball--extra { background: #f39c12; }
.vr-ball--plus { background: #2ecc71; }

/* Keno ruudukko */
.vr-keno-grid { display: grid; grid-template-columns: repeat(10, minmax(0,1fr)); gap: .25rem; margin: .5rem 0 1rem; }
.vr-keno-cell { display:flex; align-items:center; justify-content:center; height:2rem; border-radius:.5rem; background:#f1f5f9; font-weight:600; }
.vr-keno-secondary { margin-bottom: .75rem; }

/* Voittotaulukko */
.vr-prizes { width:100%; border-collapse: collapse; font-size: .95rem; margin-top: .5rem; }
.vr-prizes th, .vr-prizes td { text-align:left; border-bottom:1px solid #e5e7eb; padding:.5rem .5rem; }
.vr-prizes th { font-weight:700; }
.vr-more-wrap { margin:.5rem 0 1rem; }
.vr-more-btn {
  background:#fff;
  color:#111827;
  border:1px solid #d1d5db;
  padding:.55rem .9rem;
  border-radius:.5rem;
  cursor:pointer;
  box-shadow: 0 1px 1px rgba(0,0,0,.03);
}
.vr-more-btn:hover { background:#f9fafb; }
.vr-more-btn:focus { outline:2px solid #93c5fd; outline-offset:2px; }

/* Tabs (Keno) */
.vr-keno-tabs { margin-top: .75rem; }
.vr-tabs { display:flex; gap:.5rem; flex-wrap:wrap; margin-bottom:.5rem; }
.vr-tab { background:#f1f5f9; border:1px solid #e5e7eb; padding:.45rem .75rem; border-radius:.5rem; cursor:pointer; }
.vr-tab.is-active { background:#154a7d; color:#fff; border-color:#154a7d; }
.vr-tabpanel { display:block; }
.vr-tabpanel[hidden] { display:none; }

/* Responsive */
@media (min-width: 640px) {
  .vr-ball { width: 3rem; height: 3rem; }
  .vr-keno-cell { height:2.2rem; }
}

/* --- Tabs: parempi kontrasti vaalealla teemalla --- */
:root {
  --vr-tab-text: #111827;        /* tumma teksti */
  --vr-tab-bg:   #eef2f7;        /* vaalea tausta */
  --vr-tab-bd:   #cbd5e1;        /* reunaviiva */
  --vr-tab-active-bg: #154a7d;   /* aktiivinen tausta */
  --vr-tab-active-tx: #ffffff;   /* aktiivinen teksti */
}

.vr-tab {
  background: var(--vr-tab-bg);
  color: var(--vr-tab-text);
  border: 1px solid var(--vr-tab-bd);
  font-weight: 600;
  opacity: 1 !important;         /* älä haalista inaktiivista */
  filter: none !important;
}

.vr-tab:hover {
  background: #e6edf6;
}

.vr-tab:focus {
  outline: 2px solid #93c5fd;
  outline-offset: 2px;
}

.vr-tab.is-active {
  background: var(--vr-tab-active-bg);
  color: var(--vr-tab-active-tx);
  border-color: var(--vr-tab-active-bg);
}

/* Jos joku teema tyylittää aria-selected=false harmaaksi, kumoa se */
.vr-tab[aria-selected="false"] {
  color: var(--vr-tab-text) !important;
}

/* Tab-paneelit pysyvät piilossa kun hidden */
.vr-tabpanel[hidden] { display: none; }

/* (Valinnainen) slot-välilehdille hieman vahvempi korostus */
.vr-keno-slots .vr-tab:not(.is-active) {
  box-shadow: inset 0 -2px 0 #d1d5db;
}

