/* ITPlugg v19.28 – komplett färgsystem, fokuserade kursvyer och praktiklabbar */

/* Färgen finns både som hex och RGB så även skuggor/transparens följer valet. */
:root{--accent-rgb:54 216 196;--accent-ink:#05262b}
html[data-v1919-accent="teal"]{--teal:#36d8c4;--teal-d:#1b9f92;--accent-rgb:54 216 196;--accent-ink:#05262b}
html[data-v1919-accent="blue"]{--teal:#68a8ff;--teal-d:#397edc;--accent-rgb:104 168 255;--accent-ink:#061a32}
html[data-v1919-accent="violet"]{--teal:#aa91ff;--teal-d:#7656df;--accent-rgb:170 145 255;--accent-ink:#1d1338}
html[data-v1919-accent="amber"]{--teal:#f5b83f;--teal-d:#bd7f13;--accent-rgb:245 184 63;--accent-ink:#302006}
html[data-v1919-accent="coral"]{--teal:#ff8176;--teal-d:#c95048;--accent-rgb:255 129 118;--accent-ink:#35100d}
html[data-v1919-accent="lime"]{--teal:#9bd650;--teal-d:#679b2e;--accent-rgb:155 214 80;--accent-ink:#172807}
html[data-v1919-accent="rose"]{--teal:#f277a8;--teal-d:#bd4777;--accent-rgb:242 119 168;--accent-ink:#351021}
html[data-v1919-accent="cyan"]{--teal:#42c9ee;--teal-d:#178aab;--accent-rgb:66 201 238;--accent-ink:#062833}
html[data-v1919-accent="indigo"]{--teal:#7e8cff;--teal-d:#4d5bd0;--accent-rgb:126 140 255;--accent-ink:#111537}
html[data-v1919-accent="orange"]{--teal:#f3984d;--teal-d:#b96323;--accent-rgb:243 152 77;--accent-ink:#321a08}
html[data-v1919-accent="mint"]{--teal:#62d7a5;--teal-d:#30986e;--accent-rgb:98 215 165;--accent-ink:#08291c}
html[data-v1919-accent="magenta"]{--teal:#d97cf2;--teal-d:#9c44b4;--accent-rgb:217 124 242;--accent-ink:#2c1034}

/* Fyra nya utseenden. */
html[data-v1919-theme="paper"]{
  color-scheme:light;--bg:#f7f8fa;--bg2:#fff;--line:#d9dee5;--txt:#17212b;--mut:#65717d;
  --theme-sidebar:#edf0f4;--theme-sidebar-2:#fafbfc;--theme-hero:#e9eef3;--theme-hero-2:#fff;--theme-shadow:rgba(32,42,52,.10)
}
html[data-v1919-theme="espresso"]{
  color-scheme:dark;--bg:#1c1715;--bg2:#2a211e;--line:#57453d;--txt:#fff8f1;--mut:#c0aaa0;
  --theme-sidebar:#171210;--theme-sidebar-2:#31241f;--theme-hero:#51372d;--theme-hero-2:#211815;--theme-shadow:rgba(8,4,2,.38)
}
html[data-v1919-theme="cyber"]{
  color-scheme:dark;--bg:#071318;--bg2:#0c252a;--line:#285059;--txt:#effcff;--mut:#8eb5bd;
  --theme-sidebar:#041015;--theme-sidebar-2:#0b2930;--theme-hero:#123d46;--theme-hero-2:#06191e;--theme-shadow:rgba(0,10,14,.42)
}
html[data-v1919-theme="lavender"]{
  color-scheme:light;--bg:#f3f0fa;--bg2:#fff;--line:#d9d0e8;--txt:#2c2538;--mut:#746986;
  --theme-sidebar:#e9e3f4;--theme-sidebar-2:#faf8fd;--theme-hero:#e4daf2;--theme-hero-2:#fff;--theme-shadow:rgba(62,43,87,.12)
}

/* Accentfärgen påverkar nu även ikoner, glöd, fokus och tonade kort. */
html[data-v1919-theme] .v1919-dev-sidebar button[data-active="1"]>span,
html[data-v1919-theme] .v1919-course-overview-drawer>summary small,
html[data-v1919-theme] .kick,
html[data-v1919-theme] .tag{color:var(--teal)!important}
html[data-v1919-theme] .v1919-sidebar-pulse b,
html[data-v1919-theme] .v1919-dev-footer-actions button:hover,
html[data-v1919-theme] .v1919-lesson-overlay small,
html[data-v1919-theme] .v1919-slide-points b,
html[data-v1919-theme] .v1919-slide-answer{color:var(--teal)!important;border-color:var(--teal)!important}
html[data-v1919-theme] .v1919-sidebar-pulse em{background:var(--teal)!important}
html[data-v1919-theme] .v1921-cockpit-summary .btn{background:var(--teal)!important;color:var(--accent-ink)!important;border-color:var(--teal)!important}
html[data-v1919-theme] .welcome-mark,
html[data-v1919-theme] .btn.p,
html[data-v1919-theme] .tab[aria-selected="true"],
html[data-v1919-theme] .mode-badge{background:var(--teal)!important;color:var(--accent-ink)!important;border-color:var(--teal)!important}
html[data-v1919-theme] :focus-visible{outline-color:color-mix(in srgb,var(--teal) 72%,white)!important}

/* Inställningar visas som tydliga listor i stället för stora kakelväggar. */
.v1919-theme-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
.v1919-theme-grid button{display:grid!important;grid-template-columns:54px minmax(0,1fr);grid-template-rows:auto auto;gap:1px 11px;align-items:center;min-width:0;padding:9px 10px!important;border-radius:12px!important}
.v1919-theme-grid i{grid-row:1/3;width:54px;height:42px!important;margin:0!important;border-radius:8px!important}
.v1919-theme-grid i:before{inset:7px 38% 7px 7px!important}.v1919-theme-grid i:after{right:7px!important;top:7px!important;height:46%!important}
.v1919-theme-grid b{align-self:end;font-size:12px!important;overflow-wrap:anywhere}.v1919-theme-grid small{align-self:start;font-size:9.5px!important;line-height:1.3}
.v1919-theme-grid .paper{background:linear-gradient(145deg,#f0f2f5,#fff)}
.v1919-theme-grid .espresso{background:linear-gradient(145deg,#1c1715,#5a3b30)}
.v1919-theme-grid .cyber{background:linear-gradient(145deg,#051217,#12606c)}
.v1919-theme-grid .lavender{background:linear-gradient(145deg,#ece6f7,#fff)}

.v1919-accent-picks{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px!important}
.v1919-accent-picks button{--swatch:var(--teal);width:auto!important;height:auto!important;min-width:0;display:grid;grid-template-columns:25px minmax(0,1fr) 18px;gap:8px;align-items:center;padding:8px!important;border:1px solid var(--line)!important;border-radius:11px!important;background:var(--bg)!important;color:var(--txt);box-shadow:none!important;text-align:left;cursor:pointer}
.v1919-accent-picks button>i{width:25px;height:25px;border-radius:8px;background:var(--swatch);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}
.v1919-accent-picks button>span,.v1919-accent-picks button b,.v1919-accent-picks button small{display:block;min-width:0}.v1919-accent-picks button b{font-size:10.5px;line-height:1.2}.v1919-accent-picks button small{margin-top:2px;color:var(--mut);font-size:8px;line-height:1.2}.v1919-accent-picks button>em{font-style:normal;color:transparent;font-weight:900}
.v1919-accent-picks button[data-active="1"]{border-color:var(--swatch)!important;background:color-mix(in srgb,var(--swatch) 8%,var(--bg))!important}.v1919-accent-picks button[data-active="1"]>em{color:var(--swatch)}
.v1919-accent-picks [data-accent="teal"]{--swatch:#36d8c4}.v1919-accent-picks [data-accent="blue"]{--swatch:#68a8ff}.v1919-accent-picks [data-accent="violet"]{--swatch:#aa91ff}.v1919-accent-picks [data-accent="amber"]{--swatch:#f5b83f}.v1919-accent-picks [data-accent="coral"]{--swatch:#ff8176}.v1919-accent-picks [data-accent="lime"]{--swatch:#9bd650}.v1919-accent-picks [data-accent="rose"]{--swatch:#f277a8}.v1919-accent-picks [data-accent="cyan"]{--swatch:#42c9ee}.v1919-accent-picks [data-accent="indigo"]{--swatch:#7e8cff}.v1919-accent-picks [data-accent="orange"]{--swatch:#f3984d}.v1919-accent-picks [data-accent="mint"]{--swatch:#62d7a5}.v1919-accent-picks [data-accent="magenta"]{--swatch:#d97cf2}

/* Kursflikarna får plats, bryter aldrig text och blir innehållets tydliga nav. */
body.v1919-refreshed:not(.home-active) #portalShell>nav{
  position:sticky;top:0;z-index:40;display:grid!important;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:7px!important;
  overflow:visible!important;flex-wrap:wrap!important;padding:7px!important
}
body.v1919-refreshed:not(.home-active) #portalShell>nav .tab{
  min-width:0!important;width:100%!important;max-width:none!important;white-space:normal!important;overflow-wrap:anywhere;
  padding:9px 8px!important;line-height:1.2;text-align:center
}
.tab,.btn,.pick,.course,.lab-card,.tool-card,.qa-card,.command,.tag{min-width:0;max-width:100%;overflow-wrap:anywhere;word-break:normal}
.tag{white-space:normal!important;line-height:1.25}
#portalShell :is(h1,h2,h3,h4,p,li,span,small,label,button,summary){min-width:0;overflow-wrap:anywhere}
#portalShell :is(.panel,.card,.tool-shell,.study-plan,.lab-shell,[role="tabpanel"]){min-width:0;max-width:100%}

/* När en aktivitet väljs försvinner kursöversikten och fokus ligger på uppgiften. */
body[data-v1925-focus="1"] #portalShell>.course-toggle-row,
body[data-v1925-focus="1"] #portalShell>.courses,
body[data-v1925-focus="1"] #portalShell>.allrow,
body[data-v1925-focus="1"] #courseOverviewHub{display:none!important}
body[data-v1925-focus="1"] .portal-topbar{margin-bottom:9px!important}
body[data-v1925-focus="1"] #portalShell>nav{margin-bottom:12px!important}
body[data-v1925-focus="1"] #portalShell>[role="tabpanel"]{animation:v1925PanelIn .18s ease-out}
@keyframes v1925PanelIn{from{opacity:.45;transform:translateY(5px)}to{opacity:1;transform:none}}

/* Praktikverkstad: uppgift, arbetslogg, kontroll och reflektion. */
.v1925-lab-list-intro{display:flex;justify-content:space-between;gap:14px;align-items:center;margin:0 0 13px;padding:13px 14px;border:1px solid color-mix(in srgb,var(--teal) 28%,var(--line));border-radius:14px;background:color-mix(in srgb,var(--teal) 5%,var(--bg2))}
.v1925-lab-list-intro b,.v1925-lab-list-intro span{display:block}.v1925-lab-list-intro span{margin-top:3px;color:var(--mut);font-size:11px}.v1925-lab-list-intro em{font:800 9px var(--m);font-style:normal;color:var(--teal);white-space:nowrap}
.v1925-lab-card{display:flex;flex-direction:column;min-height:260px!important}.v1925-lab-card .v1925-lab-time{margin:8px 0;color:var(--mut);font:9.5px var(--m)}.v1925-lab-card .v1925-lab-preview{margin:0 0 12px;padding-left:18px;color:var(--mut);font-size:10.5px;line-height:1.45}.v1925-lab-card .btn{margin-top:auto;align-self:flex-start}.v1925-lab-card[data-done="1"]{border-color:color-mix(in srgb,var(--teal) 45%,var(--line))!important}
.v1925-lab-workshop{max-width:960px;margin:auto}.v1925-lab-toolbar{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:11px}.v1925-lab-toolbar>span{font:9.5px var(--m);color:var(--mut)}
.v1925-lab-brief{padding:18px;border:1px solid color-mix(in srgb,var(--teal) 34%,var(--line));border-radius:17px;background:linear-gradient(135deg,var(--bg2),color-mix(in srgb,var(--teal) 6%,var(--bg2)))}
.v1925-lab-brief small{color:var(--teal);font:800 9px var(--m);letter-spacing:.12em;text-transform:uppercase}.v1925-lab-brief h3{margin:5px 0 8px;font-size:clamp(20px,3vw,28px)}.v1925-lab-brief p{margin:0;color:var(--mut);line-height:1.55}.v1925-lab-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:14px}.v1925-lab-facts div{padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--bg)}.v1925-lab-facts b,.v1925-lab-facts span{display:block}.v1925-lab-facts b{font-size:9px;color:var(--teal);text-transform:uppercase;letter-spacing:.08em}.v1925-lab-facts span{margin-top:4px;color:var(--txt);font-size:10.5px;line-height:1.4}
.v1925-lab-safety{margin:11px 0 0;padding:9px 11px;border-left:3px solid var(--amber);border-radius:0 9px 9px 0;background:color-mix(in srgb,var(--amber) 8%,var(--bg));color:var(--mut);font-size:10.5px}
.v1925-lab-steps{display:grid;gap:10px;margin:14px 0}.v1925-task-step{display:grid;grid-template-columns:38px minmax(0,1fr);gap:11px;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--bg2)}.v1925-task-step[data-done="1"]{border-color:color-mix(in srgb,var(--teal) 42%,var(--line));background:color-mix(in srgb,var(--teal) 4%,var(--bg2))}.v1925-task-number{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:color-mix(in srgb,var(--teal) 12%,var(--bg));color:var(--teal);font:900 13px var(--m)}.v1925-task-step h4{margin:0 0 5px;font-size:14px}.v1925-task-step>div>p{margin:0 0 9px;color:var(--txt);line-height:1.5;font-size:12px}.v1925-task-step textarea,.v1925-lab-reflection textarea{box-sizing:border-box;width:100%;min-height:76px;padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--txt);font:inherit;resize:vertical}.v1925-task-step label{display:flex;gap:8px;align-items:flex-start;margin-top:8px;color:var(--mut);font-size:10.5px}.v1925-task-step details{margin-top:8px!important;padding:8px 10px!important;border-style:dashed!important;font-size:10.5px}.v1925-task-step details p{margin:7px 0 0;color:var(--mut)}
.v1925-lab-reflection{padding:15px;border:1px solid var(--line);border-radius:14px;background:var(--bg2)}.v1925-lab-reflection h4{margin:0 0 5px}.v1925-lab-reflection p{margin:0 0 9px;color:var(--mut);font-size:11px}.v1925-lab-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.v1925-lab-status{min-height:20px;margin:9px 0 0;color:var(--mut);font-size:10.5px}.v1925-lab-status[data-state="bad"]{color:var(--rose)}.v1925-lab-status[data-state="ok"]{color:var(--teal)}
.v1925-lab-review{margin-top:13px;padding:15px;border:1px solid color-mix(in srgb,var(--teal) 38%,var(--line));border-radius:14px;background:color-mix(in srgb,var(--teal) 5%,var(--bg2))}.v1925-lab-review h4{margin:0 0 6px}.v1925-lab-review ol{margin:8px 0 12px;padding-left:19px;color:var(--mut);font-size:11px;line-height:1.55}

@media(max-width:760px){
  .v1919-theme-grid,.v1919-accent-picks{grid-template-columns:1fr!important}
  body.v1919-refreshed:not(.home-active) #portalShell>nav{display:flex!important;overflow-x:auto!important;flex-wrap:nowrap!important}
  body.v1919-refreshed:not(.home-active) #portalShell>nav .tab{flex:0 0 auto!important;width:auto!important;min-width:105px!important;white-space:normal!important}
  .v1925-lab-list-intro{align-items:flex-start;flex-direction:column}.v1925-lab-facts{grid-template-columns:1fr}.v1925-task-step{grid-template-columns:1fr}.v1925-task-number{width:32px;height:32px}
}
@media(min-width:761px) and (max-width:1080px){.v1919-accent-picks{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(prefers-reduced-motion:reduce){body[data-v1925-focus="1"] #portalShell>[role="tabpanel"]{animation:none}}

/* v19.28: kontots verkliga roll syns utan att eleven behöver prova lärarkoden. */
.v1926-account-role{margin-left:auto;padding:5px 9px;border:1px solid var(--line);border-radius:999px;color:var(--mut);background:var(--bg2);font:800 8px var(--m);text-transform:uppercase;letter-spacing:.08em;white-space:nowrap}
.v1926-account-role[data-admin="1"]{color:var(--teal);border-color:color-mix(in srgb,var(--teal) 55%,var(--line));background:color-mix(in srgb,var(--teal) 8%,var(--bg2))}
@media(max-width:520px){.v1919-account-profile{align-items:flex-start;flex-wrap:wrap}.v1926-account-role{margin-left:0}}