/* F72 (28. 9. 2026, Fable 5.1): sekcija "Sporocila (SMS)" - slog prototip v3 (steklo, brez obrob, ritem 8/12/16/24/32, motion CSS-first,
   reduced-motion). Vse pod .smsp-koren; spremenljivke plosce (--bg3, --txt, --mut, --grn, --amb, --red, --vio, --blu) z rezervami. */
.smsp-koren{--smsp-steklo:linear-gradient(160deg,rgba(22,24,48,.72),rgba(12,13,26,.82));--smsp-rob:rgba(255,255,255,.06);--smsp-sij:inset 0 1px 0 rgba(255,255,255,.07),inset 0 0 0 1px rgba(255,255,255,.02);
  --smsp-senca:0 24px 60px -28px rgba(0,0,0,.7),0 2px 8px -4px rgba(0,0,0,.5);--smsp-ok:var(--grn,#34E0A1);--smsp-wait:var(--amb,#FBBF24);--smsp-bad:var(--red,#FB7185);--smsp-vio:var(--vio,#6D5EF8);--smsp-blu:var(--blu,#2E8CFF);--smsp-cyn:var(--cyn,#22E0E0);
  --smsp-txt:var(--txt,#EAF0FF);--smsp-mut:var(--mut,#9AA3CC);--smsp-dim:var(--dim,#727BA8);--smsp-d-fast:150ms;--smsp-d-ui:220ms;--smsp-ease:cubic-bezier(.22,.61,.36,1);--smsp-ease-out:cubic-bezier(.16,1,.3,1);--smsp-spring:cubic-bezier(.34,1.56,.64,1);
  display:grid;gap:16px;margin:0 0 16px;min-width:0;color:var(--smsp-txt);font-size:13px;line-height:1.5}
.smsp-koren *{box-sizing:border-box;min-width:0}
.smsp-koren [hidden]{display:none!important}
.smsp-vidno-bralnik{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.smsp-kartica{position:relative;padding:24px;border-radius:20px;border:1px solid var(--smsp-rob);background:var(--smsp-steklo);-webkit-backdrop-filter:blur(18px) saturate(1.15);backdrop-filter:blur(18px) saturate(1.15);box-shadow:var(--smsp-senca),var(--smsp-sij);animation:smsp-vstop var(--smsp-d-ui) var(--smsp-ease-out) backwards;animation-delay:calc(var(--i,0)*50ms)}
.smsp-kartica::before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(90% 50% at 50% -20%,rgba(255,255,255,.06),transparent 60%)}
.smsp-kartica>*{position:relative}
.smsp-mreza{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:16px;align-items:stretch}
.smsp-mreza .smsp-kartica{--i:0}.smsp-test{--i:1}.smsp-zgodovina{--i:2}.smsp-predloge{--i:3}
.smsp-glava{display:flex;align-items:flex-start;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.smsp-glava>div{flex:1 1 220px;min-width:0}
.smsp-glava>.smsp-ic{flex:0 0 auto;margin-top:2px;filter:drop-shadow(0 4px 12px rgba(46,140,255,.5))}
.smsp-h2{margin:0;font-size:16px;font-weight:700;line-height:1.3;letter-spacing:-.01em}
.smsp-drobno{margin:4px 0 0;font-size:12px;color:var(--smsp-mut)}
.smsp-ic{display:inline-block;object-fit:contain;vertical-align:middle}
/* stanje prehoda */
.smsp-prehod{overflow:hidden}
.smsp-prehod::after{content:'';position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,var(--smsp-ton-barva,var(--smsp-vio)) 0%,transparent 65%);opacity:.18;pointer-events:none;transition:background 800ms var(--smsp-ease)}
.smsp-ton-ok{--smsp-ton-barva:var(--smsp-ok)}.smsp-ton-wait{--smsp-ton-barva:var(--smsp-wait)}.smsp-ton-bad{--smsp-ton-barva:var(--smsp-bad)}.smsp-ton-tiho{--smsp-ton-barva:var(--smsp-dim)}
.smsp-stanje{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:4px 0 8px}
.smsp-pika{position:relative;display:inline-block;width:12px;height:12px;border-radius:50%;background:var(--smsp-ton-barva,var(--smsp-vio));box-shadow:0 0 14px var(--smsp-ton-barva,var(--smsp-vio));flex:0 0 12px}
.smsp-pika::after{content:'';position:absolute;inset:-4px;border-radius:50%;border:2px solid var(--smsp-ton-barva,var(--smsp-vio));opacity:0;animation:smsp-pulz 2.4s ease-out infinite}
.smsp-ton-bad .smsp-pika::after{animation-duration:1.2s}
.smsp-stanje-naslov{font-size:clamp(22px,2.2vw,28px);font-weight:800;letter-spacing:-.02em;line-height:1.1;color:var(--smsp-ton-barva,var(--smsp-txt))}
.smsp-stanje-rel{font-size:13px;color:var(--smsp-mut);font-variant-numeric:tabular-nums}
.smsp-razlaga{margin:0 0 6px;font-size:13px;color:var(--smsp-txt)}
.smsp-pomen{margin:0 0 16px;font-size:13px;color:var(--smsp-mut)}
.smsp-dejstva{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 16px;margin:0;padding:12px 0 0;border-top:1px solid var(--smsp-rob)}
.smsp-dejstva>div{display:grid;gap:2px;min-width:0}
.smsp-dejstva dt{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--smsp-dim)}
.smsp-dejstva dd{margin:0;font-size:13px;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.smsp-dejstva dd small{color:var(--smsp-mut)}
.smsp-dejstva-ozko{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));border-top:0;padding-top:0}
/* merila */
.smsp-merila{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-content:start}
.smsp-merilo{position:relative;overflow:hidden;display:block;width:100%;padding:16px;border-radius:16px;border:1px solid var(--smsp-rob);background:linear-gradient(160deg,rgba(28,31,60,.62),rgba(14,15,30,.7));-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:var(--smsp-sij);cursor:pointer;text-align:left;color:inherit;font:inherit;transition:box-shadow var(--smsp-d-fast),transform var(--smsp-d-fast);animation:smsp-vstop var(--smsp-d-ui) var(--smsp-ease-out) backwards;animation-delay:calc(var(--i,0)*50ms + 80ms)}
.smsp-merilo:nth-child(2){--i:1}.smsp-merilo:nth-child(3){--i:2}.smsp-merilo:nth-child(4){--i:3}
.smsp-merilo::after{content:'';position:absolute;right:-22px;top:-22px;width:80px;height:80px;border-radius:50%;background:linear-gradient(120deg,rgba(109,94,248,.18),rgba(46,140,255,.14) 55%,rgba(34,224,224,.12));opacity:.7;pointer-events:none}
.smsp-merilo h3{margin:0;display:flex;align-items:center;gap:8px;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--smsp-mut)}
.smsp-merilo strong{display:block;margin:10px 0 4px;font-size:clamp(26px,2.4vw,32px);font-weight:800;line-height:1.1;letter-spacing:-.02em;font-variant-numeric:tabular-nums;background:linear-gradient(120deg,#6D5EF8 0%,#2E8CFF 52%,#22E0E0 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.smsp-merilo p{margin:0;font-size:12px;color:var(--smsp-mut)}
@media(hover:hover) and (pointer:fine){.smsp-merilo:hover{transform:translateY(-2px);box-shadow:0 0 0 1px rgba(34,224,224,.28),var(--smsp-sij)}}
/* gumbi */
.smsp-gumb{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:8px 16px;border-radius:999px;border:1px solid var(--smsp-rob);background:rgba(255,255,255,.06);box-shadow:var(--smsp-sij);color:var(--smsp-txt);font:600 13px/1.2 inherit;font-family:inherit;cursor:pointer;white-space:nowrap;text-decoration:none;transition:transform var(--smsp-d-fast) var(--smsp-ease),box-shadow var(--smsp-d-fast),background var(--smsp-d-fast),opacity var(--smsp-d-fast)}
.smsp-gumb .smsp-ic{filter:drop-shadow(0 2px 6px rgba(46,140,255,.45))}
.smsp-gumb:disabled{opacity:.5;cursor:not-allowed}
@media(hover:hover) and (pointer:fine){.smsp-gumb:not(:disabled):hover{transform:translateY(-2px);background:rgba(255,255,255,.1);box-shadow:0 10px 26px -12px rgba(109,94,248,.85),var(--smsp-sij)}}
.smsp-gumb:not(:disabled):active{transform:scale(.96);transition-duration:90ms}
.smsp-gumb-primarni{background:linear-gradient(110deg,#5E52E6 0%,#1D66D2 100%);border-color:transparent;color:#fff;box-shadow:0 12px 34px -12px rgba(109,94,248,.75),inset 0 1px 0 rgba(255,255,255,.22)}
.smsp-gumb-primarni::before{content:'';position:absolute;top:-40%;bottom:-40%;width:36%;left:-60%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);animation:smsp-lesket 6s var(--smsp-ease) 2s infinite}
.smsp-gumb-tih{background:transparent;border-color:transparent;box-shadow:none;color:var(--smsp-mut)}
@media(hover:hover) and (pointer:fine){.smsp-gumb-tih:not(:disabled):hover{color:var(--smsp-txt);background:rgba(255,255,255,.06)}}
.smsp-gumb-majhen{min-height:34px;padding:6px 12px;font-size:12px}
.smsp-akcije{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:16px}
.smsp-sporocilo{margin:8px 0 0;font-size:12px;color:var(--smsp-mut);min-height:1.2em}
.smsp-sporocilo.smsp-ton-ok{color:var(--smsp-ok)}.smsp-sporocilo.smsp-ton-bad{color:var(--smsp-bad)}
.smsp-opomba{margin:0 0 12px;padding:10px 12px;border-radius:12px;background:rgba(251,191,36,.1);box-shadow:inset 0 1px 0 rgba(255,255,255,.05);font-size:12px;color:var(--smsp-txt)}
/* obrazci */
.smsp-koren label{display:grid;gap:6px;font-size:12px;color:var(--smsp-mut);font-weight:600}
.smsp-koren input:not([type=checkbox]),.smsp-koren select,.smsp-koren textarea{width:100%;min-height:40px;padding:8px 12px;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:rgba(255,255,255,.04);color:var(--smsp-txt);font:inherit;font-size:13px;box-shadow:inset 0 1px 0 rgba(255,255,255,.03);transition:border-color var(--smsp-d-fast),box-shadow var(--smsp-d-fast);color-scheme:dark}
.smsp-koren textarea{min-height:96px;resize:vertical;line-height:1.5}
.smsp-koren input:focus,.smsp-koren select:focus,.smsp-koren textarea:focus{outline:0;border-color:rgba(109,94,248,.7);box-shadow:0 0 0 4px rgba(109,94,248,.18)}
.smsp-koren :focus-visible{outline:2px solid var(--smsp-cyn);outline-offset:3px}
.smsp-koren input::placeholder,.smsp-koren textarea::placeholder{color:var(--smsp-dim)}
.smsp-test-obrazec{display:grid;gap:6px}
.smsp-vrsta-vnos{display:flex;gap:8px;flex-wrap:wrap}
.smsp-vrsta-vnos input{flex:1 1 220px}
.smsp-filtri{display:grid;grid-template-columns:repeat(2,minmax(0,1fr)) repeat(2,minmax(0,.8fr)) minmax(0,1.2fr) auto;gap:12px;align-items:end;margin-bottom:16px}
.smsp-f-gumbi{display:flex;gap:8px;align-items:end}
.smsp-izbira{flex:0 1 260px;margin-left:auto}
/* zgodovina */
.smsp-vrstice{display:grid;gap:8px}
.smsp-vrstica{border-radius:14px;background:rgba(255,255,255,.035);box-shadow:inset 0 1px 0 rgba(255,255,255,.05);animation:smsp-vstop var(--smsp-d-ui) var(--smsp-ease-out) backwards;animation-delay:calc(var(--i,0)*45ms);transition:background var(--smsp-d-fast)}
.smsp-vrstica:hover,.smsp-vrstica[open]{background:rgba(255,255,255,.055)}
.smsp-vrstica>summary{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr) minmax(0,1.4fr) auto minmax(0,1.6fr);gap:12px;align-items:center;padding:12px 14px;cursor:pointer;list-style:none;font-size:12.5px;min-width:0}
.smsp-vrstica>summary::-webkit-details-marker{display:none}
.smsp-vrstica>summary>*{min-width:0;overflow-wrap:anywhere}
.smsp-cas{color:var(--smsp-mut);font-variant-numeric:tabular-nums}.smsp-stevilka{font-variant-numeric:tabular-nums;letter-spacing:.02em}.smsp-vrsta{color:var(--smsp-mut)}.smsp-razlog{color:var(--smsp-mut);font-size:12px}
.smsp-znacka{display:inline-flex;align-items:center;gap:6px;width:max-content;max-width:100%;padding:3px 9px;border-radius:20px;font-size:11.5px;font-weight:700;white-space:nowrap;background:rgba(46,140,255,.16);color:var(--lblu,#7FB6FF)}
.smsp-znacka-ok{background:rgba(52,224,161,.14);color:var(--smsp-ok)}.smsp-znacka-wait{background:rgba(251,191,36,.14);color:var(--smsp-wait)}.smsp-znacka-bad{background:rgba(251,113,133,.14);color:var(--smsp-bad)}
.smsp-podrobnost{display:grid;gap:12px;padding:4px 14px 14px;animation:smsp-vstop var(--smsp-d-ui) var(--smsp-ease-out)}
.smsp-oblacek{position:relative;max-width:520px;padding:12px 14px;border-radius:18px 18px 18px 6px;background:linear-gradient(120deg,rgba(109,94,248,.28),rgba(46,140,255,.18));box-shadow:inset 0 1px 0 rgba(255,255,255,.1);font-size:13px;line-height:1.5;overflow-wrap:anywhere;white-space:pre-wrap}
.smsp-vec{display:flex;justify-content:center;margin-top:12px}
.smsp-prazno{display:grid;justify-items:center;text-align:center;gap:8px;padding:32px 20px;color:var(--smsp-mut)}
.smsp-prazno .smsp-ic{filter:drop-shadow(0 10px 26px rgba(46,140,255,.5));animation:smsp-pop var(--smsp-d-ui) var(--smsp-spring) backwards}
.smsp-prazno b{font-size:15px;color:var(--smsp-txt)}.smsp-prazno p{margin:0;max-width:44ch}
.smsp-napaka{color:var(--smsp-txt)}
/* predloge */
.smsp-predloge-mreza{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.smsp-predloga{display:grid;gap:10px;padding:16px;border-radius:16px;background:rgba(255,255,255,.035);box-shadow:inset 0 1px 0 rgba(255,255,255,.05);min-width:0;animation:smsp-vstop var(--smsp-d-ui) var(--smsp-ease-out) backwards;animation-delay:calc(var(--i,0)*50ms + 120ms)}
.smsp-predloga:nth-child(2){--i:1}.smsp-predloga:nth-child(3){--i:2}
.smsp-stikalo{display:flex;align-items:center;gap:12px;cursor:pointer;color:var(--smsp-txt);font-weight:500}
.smsp-stikalo input{position:absolute;opacity:0;width:1px;height:1px}
.smsp-stikalo-drsnik{position:relative;flex:0 0 40px;width:40px;height:24px;border-radius:12px;background:rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.05);transition:background var(--smsp-d-ui) var(--smsp-ease)}
.smsp-stikalo-drsnik::after{content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.4);transition:transform var(--smsp-d-ui) var(--smsp-spring)}
.smsp-stikalo input:checked+.smsp-stikalo-drsnik{background:linear-gradient(120deg,#6D5EF8,#2E8CFF)}
.smsp-stikalo input:checked+.smsp-stikalo-drsnik::after{transform:translateX(16px)}
.smsp-stikalo input:focus-visible+.smsp-stikalo-drsnik{outline:2px solid var(--smsp-cyn);outline-offset:3px}
.smsp-stikalo input:disabled~*{opacity:.6}
.smsp-stikalo span b{display:block;font-size:13px}.smsp-stikalo span small{display:block;font-size:11.5px;color:var(--smsp-mut);font-weight:500}
.smsp-cipi{display:flex;gap:6px;flex-wrap:wrap}
.smsp-cip{min-height:28px;padding:3px 10px;border-radius:999px;border:0;background:rgba(109,94,248,.16);color:var(--lvio,#A99CFF);font:600 11.5px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;cursor:pointer;transition:background var(--smsp-d-fast),transform var(--smsp-d-fast)}
.smsp-cip:not(:disabled):hover{background:rgba(109,94,248,.3);transform:translateY(-1px)}.smsp-cip:disabled{opacity:.5;cursor:not-allowed}
.smsp-stevec{margin:0;font-size:12px;font-variant-numeric:tabular-nums;color:var(--smsp-mut)}
.smsp-stevec-ok{color:var(--smsp-ok)}.smsp-stevec-opozorilo{color:var(--smsp-wait)}.smsp-stevec-tiho{color:var(--smsp-dim)}
.smsp-predogled{display:grid;gap:6px}
.smsp-predogled-naslov{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--smsp-dim)}
.smsp-vzorec{background:rgba(52,224,161,.18);color:inherit;border-radius:4px;padding:0 3px}
.smsp-neznano{background:rgba(251,113,133,.25);color:inherit;border-radius:4px;padding:0 3px;text-decoration:underline wavy var(--smsp-bad)}
/* skelet */
.smsp-sk-blok{position:relative;overflow:hidden;min-height:96px;border-radius:16px;background:rgba(255,255,255,.04)}
.smsp-sk-blok::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.07),transparent);transform:translateX(-100%);animation:smsp-shimmer 1.2s var(--smsp-ease) infinite}
.smsp-sk-vrstice{min-height:120px}
/* animacije */
@keyframes smsp-vstop{from{opacity:0;transform:translateY(14px)}}
@keyframes smsp-pop{from{opacity:0;transform:scale(.88)}}
@keyframes smsp-pulz{0%{opacity:.8;transform:scale(.6)}70%,100%{opacity:0;transform:scale(1.9)}}
@keyframes smsp-shimmer{to{transform:translateX(100%)}}
@keyframes smsp-lesket{0%{left:-60%}16%{left:130%}100%{left:130%}}
@media(prefers-reduced-motion:reduce){.smsp-koren *,.smsp-koren *::before,.smsp-koren *::after{animation:none!important;transition:none!important}}
/* odzivnost: 1440 -> 1024 -> 768 -> 390 */
@media(max-width:1100px){.smsp-mreza{grid-template-columns:1fr}.smsp-filtri{grid-template-columns:repeat(2,minmax(0,1fr))}.smsp-f-isci{grid-column:1/-1}.smsp-f-gumbi{grid-column:1/-1}.smsp-predloge-mreza{grid-template-columns:1fr}}
@media(max-width:900px){.smsp-vrstica>summary{grid-template-columns:minmax(0,1fr) auto;gap:6px 12px}.smsp-razlog{grid-column:1/-1}.smsp-vrsta{grid-column:1/-1}}
@media(max-width:600px){.smsp-kartica{padding:16px;border-radius:16px}.smsp-merila{grid-template-columns:1fr 1fr;gap:8px}.smsp-merilo{padding:12px}.smsp-dejstva{grid-template-columns:1fr}.smsp-glava .smsp-gumb{width:100%}.smsp-izbira{margin-left:0;flex-basis:100%}.smsp-stanje-naslov{font-size:22px}.smsp-vrsta-vnos .smsp-gumb{width:100%}}