/* GORJE-332b: «Varno v športu» - the public page (zgradi.py varno_okolje) and the rules block on /klub-trener (varno.js).
   Tokens of sistem.css. Cards in a row one height, the link at the bottom; no colour lines (Kir 28.10.2026). */
.vo { display: grid; gap: 3rem; padding-bottom: 4rem; }
.vo section { display: grid; gap: 1rem; }
.vo h2 { margin: 0; }
.vo-uvod { max-width: 60ch; margin: 0; }
.vo-mreza { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); margin: 0; padding: 0; list-style: none; }
.vo-mreza > li { display: flex; }
/* the 2 people first and wide, the 3 other ways under them; no empty cell at any width */
@media (min-width: 48rem) { .vo-mreza { grid-template-columns: repeat(2, minmax(0, 1fr)); } .vo-mreza > li:last-child { grid-column: 1 / -1; } }
@media (min-width: 64rem) { .vo-mreza { grid-template-columns: repeat(6, minmax(0, 1fr)); } .vo-mreza > li, .vo-mreza > li:last-child { grid-column: span 2; } .vo-mreza > li:nth-child(-n+2) { grid-column: span 3; } }
.vo-kartica { display: flex; flex-direction: column; gap: 0.5rem; width: 100%; padding: 1.25rem; }
.vo-kartica :is(h3, p) { margin: 0; }
.vo-kartica h3 { font-weight: 600; }
.vo-kartica .vo-dno { margin-top: auto; display: grid; gap: 0.25rem; padding-top: 0.5rem; }
.vo-stevilka { font-family: var(--f-glas); font-size: var(--t-3xl); font-weight: 700; line-height: 1.1; font-variant-numeric: tabular-nums; }
.vo-stevilka a { color: inherit; text-decoration: none; }
.vo-prvi { background: var(--led); box-shadow: none; }
/* GORJE-419: the contact person's round portrait next to the name; the circle is the site's one face .obraz--l (GORJE-421, stran.css) */
.vo-oseba { display: flex; align-items: center; gap: 0.75rem; }
.vo-nujno { background: var(--noc); color: var(--bela); box-shadow: none; }
.vo-nujno a { color: inherit; }
.vo-otroci { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); margin: 0; padding: 0; list-style: none; }
.vo-otroci > li { display: flex; }
.vo-otroci .kartica { display: grid; align-content: start; gap: 0.75rem; width: 100%; padding: 1.5rem; }
.vo-otroci :is(h3, ul) { margin: 0; }
.vo-seznam { margin: 0; padding-left: 1.2em; display: grid; gap: 0.625rem; max-width: 65ch; }
.vo-pravila { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); }
.vo-pravila .kartica { padding: 1.5rem; display: grid; align-content: start; gap: 0.75rem; }
.vo-pravila h3 { margin: 0; }
.vo-viri { display: grid; gap: 0.5rem; margin: 0; padding: 0; list-style: none; }
.vo-primer { margin: 0; }
@media (max-width: 47.99rem) { .vo { gap: 2.25rem; } }

/* the block on /klub-trener */
.vr { display: grid; gap: 1rem; }
.vr :is(h2, h3, p) { margin: 0; }
.vr-uvod { max-width: 65ch; }
.vr-pravila { padding: 1.5rem; display: grid; gap: 1.25rem; }
.vr-pravila .vo-pravila { gap: 1.5rem; }
.vr-pravila h3 { font-weight: 600; }
.vr-stanje { display: grid; gap: 0.75rem; padding-top: 1.25rem; box-shadow: inset 0 1px 0 var(--crta); }
.vr-stanje [data-vr-stanje]:focus { outline: none; }
.vr-izjava { display: grid; gap: 0.25rem; }
.vr-izjava dt { color: var(--megla); font-size: var(--t-sm); }
.vr-izjava dd { margin: 0; }
.vr-seznam { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); align-items: stretch; margin: 0; padding: 0; list-style: none; }
.vr-oseba { display: grid; grid-template-rows: auto 1fr auto; gap: 0.75rem; padding: 1.125rem 1.25rem; }
.vr-glava { display: grid; gap: 0.125rem; }
.vr-glava h3 { font-weight: 600; }
.vr-dl { display: grid; gap: 0.625rem; margin: 0; align-content: start; }
.vr-dl div { display: grid; gap: 0.25rem; }
.vr-dl dt { color: var(--megla); font-size: var(--t-sm); }
.vr-dl dd { margin: 0; }
/* the state: the one label with a dot (orodja/stran.css, GORJE-373b) */
.vr-da { --pika: var(--uspeh); }
.vr-staro { --pika: #C98500; }
.vr-ne { --pika: var(--megla); }
/* GORJE-404: the coach's application, opened in place (a plain disclosure, the text as he wrote it) */
.vr-prijava { margin-top: 0.25rem; }
.vr-prijava summary { cursor: pointer; color: var(--jezero); text-decoration: underline; text-underline-offset: 0.15em; min-height: 2.75rem; display: inline-flex; align-items: center; }
.vr-prijava summary:focus-visible { outline: 2px solid var(--jezero); outline-offset: 2px; border-radius: 0.25rem; }
.vr-prijava[open] { display: grid; gap: 0.375rem; }
.vr-prijava-besedilo { white-space: pre-line; max-width: 60ch; }
.vr-dno { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.vr-obrazec { display: grid; gap: 0.75rem; }
.vr-gumbi { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.vr-napaka { color: var(--napaka, #B42318); }
dd > .vr-gumbi { margin-top: 0.75rem; }  /* GORJE-418i: «To je moja prijava» / «Ni moja» under the application */
dd > .vr-napaka:not([hidden]) { display: block; margin-top: 0.5rem; }
@media (max-width: 47.99rem) { .vr-gumbi .gumb, .vr-stanje .gumb { width: 100%; justify-content: center; } }
@media print { .vr-stanje .gumb { display: none; } }
